Facebook Switch to Like

Facebook ‘Switch to Like’ Issue

Facebook Switch to LikeIn this article we show how being logged in as a page admin can mess up all your ‘Like’ buttons and what to do about it.

Where does this ‘Switch’ come from?

With well over 50 Million FaceBook ‘Pages’ there is likely an equal number of Page Admins out there (although unfortunately no exact figures have been released). If you are an admin of a FaceBook page, either your own or a business page, then you have the option to ‘use Facebook’ as that ‘page’ or ‘person’.

Use Facebook as...If you select to use Facebook as a page admin, you will post as that person or rather page, and your Facebook experience changes, as you now see things ‘through the eyes’ of that person/page. For example, if you post an update to the page timeline while logged in as that page’s admin, it will not only appear on the page’s timeline, but also be pushed out as an update to the pages’ fans. However, if you post an update to the page when you’re logged in as yourself, your update will merely show up on the pages timeline. It will NOT be pushed out as an update to the page’s fans.

But there are other differences too, for example, if I’m signed in to use Facebook as the page admin for my daughter’s school, then I can no longer like articles. While at first this may seem ‘unfair’ or ‘broken’ it actually makes a lot of sense if you think about it. Facebook treats it’s users as people, pages are not people and thus do not have the ‘right’ to like or ‘vote’ – and when you’re signed in as a page admin, Facebook sees you as a ‘page’.

Unfortunately, it’s not that simple. Because page admins CAN like other pages, you just can’t like outside Facebook content, such as articles, that have the facebook share button.

While you can share an update on your page’s timeline by copying and pasting a link to an article, you can NOT click on the common FB ‘Like’ button that many of these articles offer. You have to ‘Switch’.
Forbes site showing the Facebook Switch button, obscuring content
What the ‘Switch’ means to website owners and developers
This is confusing and not very consistent, but the real problem for publishes is that this ‘Switch’ promt that Facebook pushes out through it’s Open Graph technology, breaks websites all over the web. Countless major websites are effected by this ‘bug’, e.g. Forbes, c|Net, SearchEngine Journal, SlideShare, dot Net Magazine, Tech Radar, Webdesigner Depot, to name just a few!

While for the user the solution is extremely simple – they just need to click on the ‘Switch’ promt – the owners of the websites where this button breaks the content are stuck with a problem. Their content can be obscured or blocked by this ‘Switch’ promt.

Facebook Like Button Tool
The Problem Explained
Like BOX vs Like BUTTON

The ‘Like Box‘ is aimed to help you drive ‘likes’ to your facebook page, while the ‘Like Button‘ is aimed to help you drive ‘likes’ for any other webpage. Facebook provides tools for you to generate snippets for both.

These tools offer you several options, and these options are different for the Box compared to the Button.

Facebook Like BOXIn the Like Box you can display your Facebook page’s steam, faces, etc… Clearly, to allow room for this, you need to set a taller height. If you do not set a height, Facebook will use the defaults based on your selections. E.g. if you select ‘Stream’ and ‘Faces’ the default will be 590px height and 300px width. Now, this will look fine if you have allocated that room on your website, but if not, it will interfere with your layout.

If you are logged in as a page admin, the space is still held, yet the button is only 60px x 45px.

The Facebook Like Button tool can also be used to drive likes to your facebook page, but it does not intergrate and pull streams or other likes from your page. This button is simpler and the issues are consequently slightly less daunting. However, if you use the Facebook Like Button HTML5 implementation – which is the first in the snippet option – and your user happens to be logged in as a page admin, the functionality is set to produce the ‘Switch’ promt in – wait – an iFrame. This iFame has a white background and is bigger .

Facebook Like BOX CodeTo summarize:

Similarly, if you use the Facebook iFrame code snippet to begin with, Facebook adds a height and width setting, even if you did not set on in your settings. These will now cut off the Switch button display, because Facebook has not allowed for the possibility that users are logged in as page admins and see this button instead of the normal button.

While you will still see the ‘Switch’ promt if you’re logged in to Facebook as a page admin and the website uses Facebooks own generator, avoiding the Facebook integration on your website to break your layout is an easy fix.

We sincerely hope that Facebook will soon change this functionality, because it gives users a poor website experience and developer a headache to fix. Ideally we would like to see Facebook integrate the Switch functionliaty off page in a popup/lightbox. I.e. the like button remains the same, but users who are logged in as page admins, are promted to Switch after they click the button in a popup, and then returned immediately to the page.

[button link="/contact-us" size="large" variation="steelblue" bgColor="#232323" textColor="#ccc" align="left"]Contact Us[/button]If you know HTML – you now have all the knowledge you need to fix this issue on your website. However, if you don’t know HTML, or you’re still confused, or you’re just hoping to have someone else come in and fix this bug for you, then you now know where to find the right experts!

11 thoughts on “Facebook ‘Switch to Like’ Issue

  1. annestahl Post author

    Thanks for the input, here. Personally, I don’t like this kind of work-around, it is a very blunt hack and doesn’t solve the problem at core. Of course, only Facebook can truly solve the problem, and thus far they have opted not to. Pls add your own comments to the FB bug report so that FB eventually updates the plugin to be more user friendly and not to break their customers’ websites. https://developers.facebook.com/bugs/1440919559471095

    Reply
  2. Fakechuck Weinberger

    I’m all set, Anne. Please be posting to fb as a page admin when you check-out http://www.newswick.com. You’ll see the fb “switch” button at the bottom of the page. Also, if you were to pan the google map to Lake Tahoe (on the border of California and Nevada), you’ll see a bunch of markers. Click on one of the markers to open its infobox, and you’ll see an additional “switch” button. FYI, those infoboxes (and the associated fb like plug-in) are generated dynamically in js.

    I can’t for the life of me figure out how to override the width of the fb iframe so that it is pegged at 45px instead of the 90 – 140 px that facebook assigns to it.

    Reply
  3. Fakechuck Weinberger

    Very good write-up of the problem. I, however, am still having problems implementing a solution. I use multiple fb like buttons in my web app home page If one of my users switches to post as an fb page admin and then reloads my home page he/she is shown the “switch” icon. My problem is that the span and iframe elements that contain the icon are way too wide at 140px, I need them to be 46px. The added length leaves a 94px wide white background on my otherwise blue background. Dynamically altering the width of these elements isn’t a great solution for me. Is there a way to use the configurator so that the span and iframe generated by fb are narrower??? Simply setting a width of 45 in the configurator doesn’t do the job as that width is overridden by the the min-width of the span and iframe.

    Reply
  4. annestahl Post author

    Hi Alta, Facebook keeps changing this… so there is actually an update which I will post soon. Right now, you can fix the issue by choosing a different ‘type’ of code to insert. when you fill out the form at https://developers.facebook.com/docs/reference/plugins/like-box/ to generate your code, don’t choose the HTML5 default, but instead use the XFBML. However, I’m sure FB will change things again soon. It doesn’t make any sense that they don’t show news feeds or likes, unless you’re switched to your personal profile. While I can accept that they require a use to like or share as themselves, it can happen after they click like. And I’m sure they’ll update and fix this soon.

    Hope this helps.
    Anne, Amplexity.com

    Reply
  5. alta

    Try again – This make no sense – you have the “The Problem Explained” but where is the Solution?
    How about a goo outline for the “Solution”.
    Is this the FB config? If so, what controls it?
    Or, do we have to change the html/css coding?

    Reply

Leave a Reply