How To Add a facebook like button in your blog

<div dir="ltr" style="text-align: left;" trbidi="on"> <div dir="ltr" style="text-align: left;" trbidi="on"> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgx44Sz-OxZ5u6MLHCe7e8hM2nawicztfKhLWiRZr9ESweWL7XQMkj-i5FWhULyjiCIIG3aNfOwci6lYZC-_Naq8vj31cGaoUCm3p-tGRcCGAhhuUKAyGiwqfFw8nh_H1C8-An87dzNriyH/s1600/follow.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="http://pretoproblogger.blogspot.com" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgx44Sz-OxZ5u6MLHCe7e8hM2nawicztfKhLWiRZr9ESweWL7XQMkj-i5FWhULyjiCIIG3aNfOwci6lYZC-_Naq8vj31cGaoUCm3p-tGRcCGAhhuUKAyGiwqfFw8nh_H1C8-An87dzNriyH/s1600/follow.png" title="http://pretoproblogger.blogspot.com" /></a></div> <br /> <i>If you want your blog to be more active socially on facebook your blog must have a facebook follow button in your blog. It is very much simple and any newbie blogger could easily add it.</i><br /> <br /> <h2 style="text-align: left;"> Steps to add Facebook Follow Button :</h2> <br /> <br /> <ul style="text-align: left;"> <li>First log into your facebook account. I am Sure you have one. If you don't have go to facebook.com and create a new one. It takes only few minutes.</li> </ul> <div> <br /></div> <ul style="text-align: left;"> <li>Then go to this link: <a href="https://developers.facebook.com/docs/reference/plugins/follow/"> Facebook Social Plugin Website</a> ( <a href="https://developers.facebook.com/docs/reference/plugins/follow/">https://developers.facebook.com/docs/reference/plugins/follow/</a> )</li> </ul> <div> <br /></div> <ul style="text-align: left;"> <li>Enter your facebook profile url as shown in the figure below. You can also customise your buttons from the options available.</li> </ul> <div> <br /></div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyeHmwy2nO6wvZFfhkAeMBXG28yyNXLHgL9OPlKmuXCgIdft4Kttj5EqbLsesll6s4EGcDswhl_kRiLLC1nQad60pOUIcCW0dpKCEXcovi3wmW7bnKcaFYhHqU0FuyFc2PyyQjk6BWa6-o/s1600/Get-Your-Follow-Button-of-facebook.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="http://pretoproblogger.blogspot.com" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyeHmwy2nO6wvZFfhkAeMBXG28yyNXLHgL9OPlKmuXCgIdft4Kttj5EqbLsesll6s4EGcDswhl_kRiLLC1nQad60pOUIcCW0dpKCEXcovi3wmW7bnKcaFYhHqU0FuyFc2PyyQjk6BWa6-o/s1600/Get-Your-Follow-Button-of-facebook.jpg" title="http://pretoproblogger.blogspot.com" /></a></div> <div> <br /></div> <ul style="text-align: left;"> <li>Once you have customised your button click on get code to get your code. Select IFRAME tab and copy the code.</li> </ul> <div> <br /></div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhc9mhosNpvR9nDzg1JKv4u2pK2ojkhyphenhyphensOJIUhtJ4FMAVLLpSVPceJ10S4dHxvnNao97DlOtA5N8FhRzeRU4i1PpNYORHQT8w57vk41vDRx24Li_QGfyTbuFDY3Zoy60yeu3QQNVqzkPnVy/s1600/fbk.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="http://pretoproblogger.blogspot.com" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhc9mhosNpvR9nDzg1JKv4u2pK2ojkhyphenhyphensOJIUhtJ4FMAVLLpSVPceJ10S4dHxvnNao97DlOtA5N8FhRzeRU4i1PpNYORHQT8w57vk41vDRx24Li_QGfyTbuFDY3Zoy60yeu3QQNVqzkPnVy/s1600/fbk.jpg" title="http://pretoproblogger.blogspot.com" /></a></div> <div> <br /></div> <div> <br /></div> <h3> <ul style="text-align: left;"> <li><b>Follow these steps to add the button in blogger</b></li> </ul> </h3> <br /> <br /> <div style="text-align: left;"> </div> <ul style="background-color: white; box-sizing: border-box; color: #333333; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;"> <li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;"><span style="font-family: inherit;">Go to your <b style="box-sizing: border-box;">blogger dashboard</b></span></span></li> </ul> <ul style="background-color: white; box-sizing: border-box; color: #333333; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;"> <li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;"><span style="font-family: inherit;">Select your blogger blog</span></span></li> </ul> <ul style="background-color: white; box-sizing: border-box; color: #333333; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;"> <li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;"><span style="font-family: inherit;">Click on <b style="box-sizing: border-box;">Layout </b>from Drop Down menu (shown in picture)</span></span></li> </ul> <div style="-webkit-transition: all 0.4s ease-in-out; box-sizing: border-box; color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-align: center; text-decoration: none; transition: all 0.4s ease-in-out;"> <div style="text-align: center;"> <a class="pirobox" data-pirobox="gallery" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhFC00yUiEneD6AjI38US0XzgRdNNkTHwtoqTm9JAIePU5WoBPQ15Tbz9E1zq7eJgaqmu9nmXkP5hZ-elIzdQu-_aArare_n3GyD-Zb0rm7bk-L5MzwqzO_sXvn1rJIxJZDQ3IOQGf0QE/s900/1.jpg" imageanchor="1" style="-webkit-transition: all 0.4s ease-in-out; box-sizing: border-box; color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none; transition: all 0.4s ease-in-out;"><span style="box-sizing: border-box;"><span style="font-family: inherit;"><img border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhFC00yUiEneD6AjI38US0XzgRdNNkTHwtoqTm9JAIePU5WoBPQ15Tbz9E1zq7eJgaqmu9nmXkP5hZ-elIzdQu-_aArare_n3GyD-Zb0rm7bk-L5MzwqzO_sXvn1rJIxJZDQ3IOQGf0QE/s900/1.jpg" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; -webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; box-sizing: border-box; height: auto; max-width: 100%; padding: 1px; position: relative; transition: all 0.4s ease-in-out;" width="400" /></span></span></a></div> </div> <span style="font-family: inherit;"><br style="box-sizing: border-box;" /></span> <br /> <ul style="box-sizing: border-box; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;"> <li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;"><span style="font-family: inherit;">A new Window appear</span></span></li> </ul> <ul style="box-sizing: border-box; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;"> <li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;"><span style="font-family: inherit;">Click on <b style="box-sizing: border-box;">Add gadget</b></span></span></li> </ul> <ul style="box-sizing: border-box; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;"> <li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;"><span style="font-family: inherit;">And select <b style="box-sizing: border-box;">HTML/JavaScript</b></span></span></li> </ul> <ul style="box-sizing: border-box; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;"> <li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;"><span style="font-family: inherit;">Next Box of HTML/JavaScript will appear <b style="box-sizing: border-box;">(shown in picture)</b></span></span></li> </ul> <span style="font-family: inherit;"><span style="box-sizing: border-box;"><b style="box-sizing: border-box; line-height: 18px;">   </b></span></span><br /> <div style="text-align: center;"> <span style="font-family: inherit;"><span style="box-sizing: border-box;"><b style="box-sizing: border-box; line-height: 18px;"><b style="box-sizing: border-box;"><a class="pirobox" data-pirobox="gallery" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGAMOxnn2e2idyVYMtV5VFR0V8y4gRM4WvXfjh-Uj4RTeahMfv0NZ4KMtnTL0hgUsBSHtjW0v96bm52gxxVuAlZLOH4mSyV4liN99iqDL0EEBjA-ISYSmmMoHMEa9y-xUOmQ5ADyld1wk/s900/2.png" imageanchor="1" style="-webkit-transition: all 0.4s ease-in-out; box-sizing: border-box; color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none; transition: all 0.4s ease-in-out;"><span style="box-sizing: border-box;"><span style="font-family: inherit;"><img alt="http://pretoproblogger.blogspot.com" border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGAMOxnn2e2idyVYMtV5VFR0V8y4gRM4WvXfjh-Uj4RTeahMfv0NZ4KMtnTL0hgUsBSHtjW0v96bm52gxxVuAlZLOH4mSyV4liN99iqDL0EEBjA-ISYSmmMoHMEa9y-xUOmQ5ADyld1wk/s900/2.png" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; -webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; box-sizing: border-box; height: auto; max-width: 100%; padding: 1px; position: relative; transition: all 0.4s ease-in-out;" title="http://pretoproblogger.blogspot.com" width="400" /></span></span></a></b></b></span></span></div> <span style="font-family: inherit;"><span style="box-sizing: border-box;"><b style="box-sizing: border-box; line-height: 18px;"> </b></span></span><span style="font-family: inherit;"><br style="box-sizing: border-box;" /></span><br /> <ul style="box-sizing: border-box; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;"> <li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;"><span style="font-family: inherit;">Now the box of HTML/JavaScript will appear when you click on the box.</span></span></li> </ul> <div style="-webkit-transition: all 0.4s ease-in-out; box-sizing: border-box; color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-align: center; text-decoration: none; transition: all 0.4s ease-in-out;"> <div style="text-align: center;"> <a class="pirobox" data-pirobox="gallery" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuUdV6YIWJL_6zaX7XjWBObPleQyH90jbXnEyWlI1cx-p71AHEPFFTP_HHljNXTZsdowc_jZVihijglqjUzCgfqwCt7ENToRb94VpaD7pBmHPYYdY1epu_Cw5TmOh7S2SVcGqujzXNRB0/s900/5.png" imageanchor="1" style="-webkit-transition: all 0.4s ease-in-out; box-sizing: border-box; color: #6a6a6a; margin-left: 1em; margin-right: 1em; text-decoration: none; transition: all 0.4s ease-in-out;"><span style="box-sizing: border-box;"><span style="font-family: inherit;"><img alt="http://pretoproblogger.blogspot.com" border="1" height="221" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuUdV6YIWJL_6zaX7XjWBObPleQyH90jbXnEyWlI1cx-p71AHEPFFTP_HHljNXTZsdowc_jZVihijglqjUzCgfqwCt7ENToRb94VpaD7pBmHPYYdY1epu_Cw5TmOh7S2SVcGqujzXNRB0/s900/5.png" style="-webkit-box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; -webkit-transition: all 0.4s ease-in-out; border: 1px solid rgb(230, 230, 230); box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 5px; box-sizing: border-box; height: auto; max-width: 100%; padding: 1px; position: relative; transition: all 0.4s ease-in-out;" title="http://pretoproblogger.blogspot.com" width="400" /></span></span></a></div> </div> <ul style="box-sizing: border-box; line-height: 1.4; margin: 0.5em 0px; padding: 0px 2.5em;"> <li style="box-sizing: border-box; margin: 0px 0px 0.25em; padding: 0px;"><span style="box-sizing: border-box;"><span style="font-family: inherit;">Now <b style="box-sizing: border-box;">paste the code to add the Facebook follow button</b> to your blog.</span></span></li> </ul> <div> <span style="line-height: 22px;"><i>You are done now.</i></span></div> <div> <span style="line-height: 22px;"><i><br /></i></span></div> <div> <blockquote class="tr_bq"> <span style="line-height: 22px;"><i>Comment if you like this Facebook Follow Button or if you are having problem adding it in your blog.</i></span></blockquote> </div> <br /> <div class="separator" style="background-color: white; box-sizing: border-box; clear: both; color: #333333; line-height: 19.1875px; text-align: center;"> </div> <div style="background-color: white; box-sizing: border-box; color: #333333; line-height: 19.1875px; text-align: center;"> <span style="font-family: inherit;"><span style="box-sizing: border-box;"><b style="box-sizing: border-box; line-height: 18px;"></b><span style="box-sizing: border-box; line-height: 18px;"></span></span></span></div> <div style="text-align: left;"> <br /></div> </div> </div>

How To Add a facebook like button in your blog

If you want your blog to be more active socially on facebook your blog must have a facebook follow button in your blog. It is very much...

Read more »