How To Beautify FB Fan Page | Like Button More Prettier

Written by : Precious Pinkest | 3:57:00 PM | 1


♥ ASSALAMUALAIKUM ♥


Today I felt want to do a tutorial.Its been a while since my last entry for the tutorial a month ago.I see almost all the blogs in the blogosphere have added Fan Page or known as Like Button on their blog.What is Fan Page or Like Box?The Fan Page Box is a social plugin that enables Facebook Page owners to attract and gain Likes from their own website.Its enables users to:

oldfanpage
Before

icon_heart-pink See how many users already like this Page, and which of their friends like it too.
icon_heart-pink Read recent posts from the Page.
icon_heart-pink Like the Page with one click, without needing to visit the Page.


Since Fan Page is only have  two options for background either Dark or Light,Of course the background is boring right? Must expect the other looks from the others Fan Page isn’t it?..Well I’ve got the solution in that..hehehe

By today I wanna share to you all on how we can beautify our Fan Page into more interesting ,more prettier than before.Make sure you all follow all the instruction very carefully tau..!

How To Do It ;

pink01 Click Dasboard > Layout (Design): Click Add a Gadget>CLICK HTML / Javascript.
pink02 Copy the HTML code below and paste code on the  box.

likebutton1
This HTML codes is for Fan Page WITH Faces.

<div style="padding:5px 5px 5px;background: url(Your Own Background Image)repeat;-moz-border-radius: 15px;border-radius: 15px;-moz-box-shadow:inset 0 0 2px #ff1493;-webkit-box-shadow:inset 0 0 2px #FF1493;box-shadow:inset 0 0 2px #FF1493;"><div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:fan connections="10" css="http://pinkdiva.googlecode.com/files/fanboxstyle.css1" height="203" logobar="0" profile_id="Fan Page ID" stream="0" width="240" class=" FB_fan FB_ElementReady"></fb:fan>
<span style="font-size:10px;">Widget by : <a href="http://developers.facebook.com/">Facebook</a> | <a href="http://www.gurlalush.blogspot.com/">Mrs Pink Diva</a></span>
</div>
likebutton2
And This One is For Fan Page WITHOUT Faces.
<div style="padding:5px 5px 5px;background: url(Your Own Background Image) repeat;-moz-border-radius: 15px;border-radius: 15px;-moz-box-shadow:inset 0 0 2px #ff1493;-webkit-box-shadow:inset 0 0 2px #FF1493;box-shadow:inset 0 0 2px #FF1493;"><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like-box href="Your Fan Page URL Link" send="true" width="260" show_faces="false" stream="false" header="true"></fb:like-box>
<span style="font-size:10px;">Widget by : <a href="http://developers.facebook.com/">Facebook</a> | <a href="http://www.gurlalush.blogspot.com/">Mrs Pink Diva</a></span></div>

pink03Preview and Save.

Your Own Background Image - you have to put a link on your own background
✿✿ Fan Page ID - you have to put your own Fan Page ID

 ID

✿✿✿ Fan Page URL Link  - you have to put your own Fan Page Link.


FANPAGEURL

✿✿✿✿ inset , 2px , #ff1493Part this is your border type,pixel and colour. you change according to your desired colours.

Happy Trying Guyz!!

Sharing The Love :)

1 comment:

Note : All comments are moderated manually by real humans, so you won't see them appearing immediately.

For Non-Bloggers
Please select profile & click "Name/URL" If you do not have any profiles on any those listed. (Leave the URL empty).

It's harsh to call you Anonymous , So please Leave at least a Name.