Promotion on Facebook
With over 500 million visitors a month, Facebook’s growth isn’t showing any signs of slowing down. Chances are, you have a profile yourself. Facebook has been making various moves to become more ingrained in the web for years, but in April 2010, they unveiled some major changes that look set to plant them firmly at the centre of it all. Now you can let your website visitors share your site with their friends on Facebook with one click, and all it takes is one line of code.
This page was last updated on 2018-07-18
Adding a Facebook “Like” Button
If you place the Facebook “Like” widget on your site, it will open a small <iframe> at that point on your page, which will contain the Like button itself, with a little thumbs-up icon, and a listing of any friends of the current user that have liked this site before. Here’s what it looks like (this is live!):
It’s probably best if you get used to seeing these buttons, because it looks like they’re going to start popping up in every corner of the web. Clicking on “Like” will report this action back to Facebook, who will then mix this in with all those other status updates, incriminating photos and whatever else is on your Facebook Wall, where it can be seen by your friends or anybody else, depending on your privacy settings. The note on your profile will look something like this:
The first part here (“HTML Source: HTML Tutorials”) is the <title> content from the page you point to, so the importance of writing good titles has never been more relevant. After that, the domain name of the homepage is listed.
For Facebook, this whole setup makes a lot of sense. They get lots more information about what’s popular on the web, and they learn more about all of their user’s interests. For you, the website owner, this is one of the easiest ways to promote your site. Every time a happy visitor clicks your Like button, your site has the potential to be visited by all of their friends. And since it’s a personal recommendation, rather than an anonymously “popular” web search result, you may find that new readers that you attract this way become more loyal readers than those who float in from search results pages.
It’s unclear how search engines are going to use these recommendations. Presumably, Google is just as interested in what sites are being shared between friends as Facebook is, since this information can be harnessed to improve their search results. If they have access to streams of this kind of information, it is sure to help your ranking in results pages too.
Liking a website
The basic Facebook Like button code is very simple. You just have to decide whether you want to point people towards your homepage, or to the specific page that a reader was on when they hit the button. News sites and other general interest sites will probably gain more by linking to individual pages (below). Here on HTML Source, I’ve decided to point all recommendations to the homepage, so that new readers can choose to start learning wherever they are most interested.
The difference is in the href parameter that you pass to Facebook. We just pass the same value on every page. See the italicised part below:
<iframe src="http://www.facebook.com/widgets/like.php?href=http://www.yourhtmlsource.com"
scrolling="no" frameborder="0"
style="border:none; width: 450px; height: 80px;"></iframe>
Liking a single page
If you’d like to let people point to individual pages (which also allows them to separately Like more than one page on your site), you should send whatever URL is relevant each time, like below.
<iframe src="http://www.facebook.com/widgets/like.php?href=http://www.yourhtmlsource.com/promotion/facebook.html"
scrolling="no" frameborder="0"
style="border:none; width: 450px; height: 80px;"></iframe>
If you’re using PHP on your website, you can make this automatic with this code:
http://www.facebook.com/widgets/like.php?href=<?= "http://".$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI']; ?>
This will inject the current page’s URL at this point, meaning every Like button will point to this specific page. It’s up to you which of these two options makes most sense for your site.
