How To Add A Facebook Like Button To An iWeb Site
August 19th, 2011In our social networking world, having a Facebook page for your business can be extremely important. In this video, we’re going to show you how you can add a Facebook ‘like’ button to your site in iWeb.
If you haven’t already, make sure you check out our video on how to create a custom Facebook page that looks similar to your website.
Video Transcript:
To add a Facebook Like, button to your iWeb website, first go to the Facebook Developers Like Button page. You can pause the video here and type in this URL, or you can do a search for the phrase Facebook Like Button and click on the result for the Facebook Developers Like Button page.
In the Step 1 – Get Like Button Code form, first enter the URL for your Facebook page. If you are unsure of what this URL is, you can visit your Facebook page, and copy and paste the URL into this field.
If you would like to include this Send button, you can leave this box checked, otherwise, you can remove it.
For Layout Style, go through each option and choose the one that you like best.
You can leave the width at 450, or you can change it if you’d like.
You can also choose to show the faces of people who have liked your page. That option looks like this on a webpage.
And lastly, you can pick your font and colour scheme that you would like to use.
When you are done, press the Get Code button, and highlight the code that pops up in the window.
Now let’s open up iWeb, and drag an HTML snippet onto our page. Paste the code that we just copied into this HTML Snippet. You should be able to see your Facebook Like or Recommend button, and you can resize it and move it to a location on your site that fits best.
And that is how you add a Facebook Like button to an iWeb website. Be sure to check out our other helpful iWeb tips and tricks videos which are located in the SEO For iWeb Walkthrough Video Tutorial or our iWeb SEO blog
Twitter
Facebook
Youtube
Blog RSS
November 24th, 2011 at 9:35 pm
This doesn’t work. Seems they have changed something on the facebook developers page. any ideas?
September 15th, 2012 at 4:15 pm
When I opened up iWeb I add the snippet, the box came up, as well as the box that you paste the code in. When I hit apply, the snippet box changed to blank nothing in it.
September 18th, 2012 at 12:33 pm
You will need to publish the site in order to see the like button.
December 5th, 2012 at 7:55 am
I have become so frustrated with everything to do with iWeb 08. Everything I try to do requires roundabouts and tricks. I am following your directions explicitly to add social media buttons to my site. They appear in my publish to a folder visits…well, google+ appears normal looking, Twitter appears as blue text line that merely says ‘Tweet’ and works but not graphically, and facebook button is a wide narrow white box against my grey background site that does nothing.
I uploaded the site to see if perhaps the buddons would be there on the finished uploaded product…they don’t even appear.
Then there are meta tags and other SEO things I try that lead nowhere because the HTML is unaccessible except by snippet.
The tragic thing about this rant is that I have spend a full week of days making my site on iWeb 08 and now I am so exhausted and frustrated and sad that I may have to begin again from the beginning and use another system.
Talk me down from the edge…please.
December 5th, 2012 at 11:38 am
Hi Rob,
I definitely understand your frustrations. All I can say at this point is stick with iWeb. There is light at the end of the tunnel, but for now, you just need to trust us and stick it out.
December 21st, 2012 at 4:09 pm
Hi there,
This works great. Thanks!
Is there any way of making the “Like” button bigger? I tried resizing the fame in iWeb (and even tried changing the “height” values in the code), but it’s still quite small. Any advice?
Thanks!
December 26th, 2012 at 5:26 pm
On Facebook’s page you have two options for the size of the Like button. You can have a small one and a big one only.
May 31st, 2013 at 9:55 am
Hi Jeremy, thanks for your posts.
A question: The URL that I must paste is only the Facebook Page URL? Because I have been doing it with my webpages URL, in every different page I added the different URL to the like button HTML SNIPPET. Since december I`ve had problems with this, because I used to have 140 likes in the main page and now I only have 21. And it doesn’t increase anymore.
Thank you again for your comments and I’m waiting anxious for Easyweb… !
June 8th, 2013 at 8:29 am
Can you add a facebook like button to an iweb site that is a closed group fan page on facebook
June 8th, 2013 at 8:31 am
Also in the video above it states to choose the iframe code and paste into iweb snippet HTML. The facebook get like button tab does not allow you to choose the iframe code
June 29th, 2013 at 8:13 pm
I have two questions, can I put to like buttons in each of my web pages, one for Facebook Page and another for the url of each web page?
Thanks and looking foward for your Easyweb
June 29th, 2013 at 8:37 pm
Sorry, the other question was, is there something I have to do after Like Button Migration (November 7, 2012)? And what should I do? I used to have 146 likes and right now it is stucked on 21 likes.
Thank you very much Jeremy
October 25th, 2013 at 2:18 am
I followed your instructions to the letter but my FB Follow button, nor the Like button won’t show / work on my iWeb page once published to the net.
My iWeb version is 3.0.3.
Any tips?
November 27th, 2015 at 8:30 pm
Need some assistance with my attempt to add a “Like Us on Facebook” button onto my iWeb site using Facebook URL https://www.facebook.com/groups/181886622157378/.
I have tried all suggestions listed to date unsuccessfully. Attempted first using html code provided by Facebook:
Then used iframe code modified code provided here on this site:
Also, Facebook says to Include the JavaScript SDK on your page once, ideally right after the opening tag.
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = “//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5”;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));
If I need to include this script, I’m not sure where or how. Would appreciate any assistance!! Thanks to you all.
November 27th, 2015 at 11:44 pm
You cannot include it by default in iWeb. You will have to use a tool like our free iWeb SEO Tool to include it on your site. You can include that code in the Header field. However, it has to be surrounded by the tag otherwise that code will actually appear on your website.
March 8th, 2016 at 4:51 pm
I followed your instructions to the letter but my FB Follow button, nor the Like button won’t show / work on my iWeb page once published to the net
March 24th, 2016 at 11:54 pm
Sorry for the problems you are experiencing.
Unfortunately this article is 5 years old and some things have changed with Facebook. Although it still should work, I recommend you check out EverWeb which provides this feature built in and is just as easy as iWeb to build your website.