- HubPages»
- Technology»
- Internet & the Web»
- Social Networking»
How to Add a Facebook Button to Your Website - Made Easy
Adding a Facebook Button to Your Website
This Hub will cover how to add a Facebook Like Button to your website. It will also introduce where to get the code for the Facebook "Like" button and a variety of other Facebook plugins for your website. Other Hubs will cover in more detail how to add the Like button to your Blogger blog.
Facebook has a developers page that offers information on how to install several different "Social Plugins"
Also addressed in this Hub is how to add a Facebook icon that links to your Facebook page to your website. This is not code copied from the Facebook developers page, but simply an icon and a link to your personal or business Facebook page.
Facebook Developers: Like Button, Like Box and More
Adding a Facebook Like Button or Like Box?
I personally feel that the Like Button is better suited to a Blog or Article site... a site where the button links to very specific topic, whereas the Like Box is better suited to adding to a website because it directs website visitors to your Facebook Business page where they can see your Wall, your photos, discussions, video, etc.
Either the button or box can be customized for your website or blog by changing the options on the Facebook developers page.
The first thing you need to do is to paste the URL of your site into the box that says, "Facebook Page URL." You can then customized the width, the color scheme and whether you want to display the faces of people that like your page, the news feed stream on your page wall or the header of the like box.
Each time you change an option on the left hand side of the screen, the change will be reflected on the right hand side of the screen so you can see what your finished Like Box is going to look like.
Once you have the options you are happy with, click on the button that says Get Code to get the code needed to paste into your website.
Copy the code and paste it on your site where you'd like the box or button to go. To do this, you will need to have access to the HTML code of your site, or be using a site like Blogger.com that allows you to add "gadgets" or modules that include iframe code.
Adding Find Us on Facebook Link
For some people, even reducing the size and number of elements on the Facebook Like Box is still too big or too much, they would prefer just to have a small Facebook icon on their website that links to either their Facebook personal or business page.
To do that, all you need is a graphic image of the Facebook icon of your choice (search Google images) In another Hub, I discuss using Royalty Free Images. For this case, using a small, low resolution icon that links to the Facebook application, I believe this is considered Fair Use. However, if you are concerned, there are some Free for Personal and Commercial Use social icons available.
Once you've saved your image, add it to your website with the link target to your Facebook page.
<a href="http://www.facebook.com/pages/Anticipation-Villa/174391555938617?sk=wall"> <img src="IMAGES/facebook_icon.png" width="200" height="80" alt="Anticipation Villa on Facebook" /></a>