Add Connected Social Gadget Buttons ToButtons orTopPosts
Step 1. In Your Blogger Dashboard Click > Design > Edit Html > Tick The Expand Widget Templates Box.
Step 2. Click Ctrl and F for a search of code in your blogs Html ]]></b:skin>
and Paste the following code Directly Above / Before
#stats .rss , #stats .twitter,
#stats .google { padding-top: 50px;margin-right:17px; display: block; width: 48px; float: left; }
#stats .email { padding-top: 50px; display: block; width: 48px; float: left; }
#stats .rss { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCLOr71FHHle1AFn_plfnHSQkowHzCZZTzHU9Y_gPofQaF1FflWSQVPjs_SzWmAJKValqwWImiIMHjq-SiWIINHeczOLn6unrml5-gYIDzRRevsOnghVfYvTmsAL0fFqlLTm8XYn4xGv8s/) center top no-repeat }
#stats .email { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9t0RJQDAKHuTC9NlS1nwGcrSO2CLXfWp_hbTjejvm6Detri7KoyZVsHdC36sgKtWwdymApxbv1Ct9X4H2ndu8AtwZtNG-0mAPyZRdEODlnc3XRUYH50xq_P39HA7S_8apnXgXd7Bj1XXL/) center top no-repeat }
#stats .twitter { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhp-nFztjxF5xtGpzrK4uvQSf0A5cwOv6SgLTZnH1HDFOP4vaQXRraSrwG6JH0ED9pwi63oD5jeUKl_02GdUTNJBc7umH6apbE4ccy-9gJGn72P3fX-s8vKKJaf6V_NqBjNBxSBRIsc8gaY/) center top no-repeat }
#demo-container-outer {padding:0px 0px 0 0px;margin:0 0 1px 0;background:#235872;border-bottom:solid 1px #13475f;border-top:solid 1px #13475f;}
#demo-container{width:901px;margin:0 auto;}
ul#simple-menu{list-style-type:none;width:100%;position:relative;height:27px;font-family:"Trebuchet MS",Arial,sans-serif;font-size:13px;font-weight:bold;margin:0;padding:0px 0 0 0;}
#stats .google { padding-top: 50px;margin-right:17px; display: block; width: 48px; float: left; }
#stats .email { padding-top: 50px; display: block; width: 48px; float: left; }
#stats .rss { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCLOr71FHHle1AFn_plfnHSQkowHzCZZTzHU9Y_gPofQaF1FflWSQVPjs_SzWmAJKValqwWImiIMHjq-SiWIINHeczOLn6unrml5-gYIDzRRevsOnghVfYvTmsAL0fFqlLTm8XYn4xGv8s/) center top no-repeat }
#stats .email { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9t0RJQDAKHuTC9NlS1nwGcrSO2CLXfWp_hbTjejvm6Detri7KoyZVsHdC36sgKtWwdymApxbv1Ct9X4H2ndu8AtwZtNG-0mAPyZRdEODlnc3XRUYH50xq_P39HA7S_8apnXgXd7Bj1XXL/) center top no-repeat }
#stats .twitter { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhp-nFztjxF5xtGpzrK4uvQSf0A5cwOv6SgLTZnH1HDFOP4vaQXRraSrwG6JH0ED9pwi63oD5jeUKl_02GdUTNJBc7umH6apbE4ccy-9gJGn72P3fX-s8vKKJaf6V_NqBjNBxSBRIsc8gaY/) center top no-repeat }
#demo-container-outer {padding:0px 0px 0 0px;margin:0 0 1px 0;background:#235872;border-bottom:solid 1px #13475f;border-top:solid 1px #13475f;}
#demo-container{width:901px;margin:0 auto;}
ul#simple-menu{list-style-type:none;width:100%;position:relative;height:27px;font-family:"Trebuchet MS",Arial,sans-serif;font-size:13px;font-weight:bold;margin:0;padding:0px 0 0 0;}
OK back to your blogs design page and click Add A Gadget > Choose Html/Javascript :
Step 3. Copy and Paste the following code into the Html/Javascript gadget ;
<div id='stats'>
<p><a class='rss' href='http://feeds.feedburner.com/theblogtemplates' title='Subscribe via RSS'>RSS</a>
<a class='twitter' href='http://twitter.com/theblogtemplate' title='Follow Us on Twitter'>Twitter</a>
<a class='email' href='http://feedburner.google.com/fb/a/mailverify?uri=widgetsforfree&loc=en_US' title='Subscribe to Email Updates'>Email</a></p>
</div>
<p><a class='rss' href='http://feeds.feedburner.com/theblogtemplates' title='Subscribe via RSS'>RSS</a>
<a class='twitter' href='http://twitter.com/theblogtemplate' title='Follow Us on Twitter'>Twitter</a>
<a class='email' href='http://feedburner.google.com/fb/a/mailverify?uri=widgetsforfree&loc=en_US' title='Subscribe to Email Updates'>Email</a></p>
</div>
=================================
Stay Connected Stylish Rss Feed And Social Gadget For Blogger
In your Blogger dashboard click Design > Add A Gadget > Choose Html/Javascript.
Step 2. Copy and paste the code below into the Html/Javascript gadget :
Step 2. Copy and paste the code below into the Html/Javascript gadget :
<table border="0"><tbody>
<tr><td><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEistUCOWvvdmcgjW5lUFINrlKINaWnkGN-OYkeBwZaGdTuYnJ2iHOJi8OQGboHaKBf9psSgEzl7Dn2x2H98Q4w890fnjM3YPGZ53bh0W2boShEhiXLD1omEuxgixPdzJH41_boedO50qysY/s1600/stay+connected.png" /></td><td>
<a target="_blank" href="FEED-URL-HERE" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpB9B_bV9FwzighlXtZIJSiQvHOPASf5yU3-p57nzZ9cW98_5qm3_pC75pyE9jR0_lERjQc7E5oB4BbX6BxgcHwcOaF__IUD5NXwMPqaXygusYyZBc71D7zIN7wkJaKuuVgzlxqOQaMm0/s1600/connect-rss-feed.png" /></a></td><td>
<a target="_blank" href="TWITTER-URL-HERE" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5I6R8bKVZEjPyA11ot5su6XQaoNV-flYuMU2_WT-hHATki_BTxxgHsAiDsWdCUvzMNiiY_FBNlF_nyvbrDkN4FXsauKlywKBNqG37Tun4lIAnC7m2FgiC8Yj5elU_car0zbLZ2BtKfEI/s1600/connect-twitter-follow.png" /></a></td><td>
<a target="_blank" href="FACEBOOK-URL-HERE" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicFxrzfE7kN31B3O-9WWZU75xzrxtfMw8v9CZnGyKt1l1VWTZJb_4dk8xwI8qFq13Max_E3OaWkknuVW1d0LybwayJTSVl7yczFLd1XdsjhL36f4O9Ck9Jqv_96PGgBSCZFEp9ItaXn6Q/s1600/connect-facebook-follow.png" /></a></td></tr>
</tbody></table>
<a href="http://www.eca.com/"><img alt="Best Blogger Tips" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5kreFRwyAdSY8X5lbY1bwKjSnIQoaWyNpJIj4LQ3hrvesTMX1AtiKe7T9mzEtGTK3hbjsoFpa_HJb-PKQip-9ZINEOwSTIXVOBaI19vURcaeco3vbQjICIFDvp989bNFa75Xfy_n-LYH8/s1600/best+blogger+tips.png" /></a>
<tr><td><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEistUCOWvvdmcgjW5lUFINrlKINaWnkGN-OYkeBwZaGdTuYnJ2iHOJi8OQGboHaKBf9psSgEzl7Dn2x2H98Q4w890fnjM3YPGZ53bh0W2boShEhiXLD1omEuxgixPdzJH41_boedO50qysY/s1600/stay+connected.png" /></td><td>
<a target="_blank" href="FEED-URL-HERE" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpB9B_bV9FwzighlXtZIJSiQvHOPASf5yU3-p57nzZ9cW98_5qm3_pC75pyE9jR0_lERjQc7E5oB4BbX6BxgcHwcOaF__IUD5NXwMPqaXygusYyZBc71D7zIN7wkJaKuuVgzlxqOQaMm0/s1600/connect-rss-feed.png" /></a></td><td>
<a target="_blank" href="TWITTER-URL-HERE" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5I6R8bKVZEjPyA11ot5su6XQaoNV-flYuMU2_WT-hHATki_BTxxgHsAiDsWdCUvzMNiiY_FBNlF_nyvbrDkN4FXsauKlywKBNqG37Tun4lIAnC7m2FgiC8Yj5elU_car0zbLZ2BtKfEI/s1600/connect-twitter-follow.png" /></a></td><td>
<a target="_blank" href="FACEBOOK-URL-HERE" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicFxrzfE7kN31B3O-9WWZU75xzrxtfMw8v9CZnGyKt1l1VWTZJb_4dk8xwI8qFq13Max_E3OaWkknuVW1d0LybwayJTSVl7yczFLd1XdsjhL36f4O9Ck9Jqv_96PGgBSCZFEp9ItaXn6Q/s1600/connect-facebook-follow.png" /></a></td></tr>
</tbody></table>
<a href="http://www.eca.com/"><img alt="Best Blogger Tips" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5kreFRwyAdSY8X5lbY1bwKjSnIQoaWyNpJIj4LQ3hrvesTMX1AtiKe7T9mzEtGTK3hbjsoFpa_HJb-PKQip-9ZINEOwSTIXVOBaI19vURcaeco3vbQjICIFDvp989bNFa75Xfy_n-LYH8/s1600/best+blogger+tips.png" /></a>
Important - You must add your Rss, Twitter and Facebook URLs.
Replace the text in red with the relevant URL.
==========================
Add Twitter And Facebook Buttons To BloggerButtons orTop Posts
Add Twitter And Facebook Buttons To BloggerButtons orTop Posts
using these buttons at the time of writing the post but as you know I'm always changing so for future reference i have a live demo below.
Demo
Step 1. In Your Blogger Dashboard Click > Design > Edit Html > Tick The Expand Widget Templates Box.
Step 2. Click Ctrl and F for a search and find the code
<data:post.body/>
<div style='float:left; margin-right:10px;'>
<a class='twitter-share-button' data-count='vertical' data-via='eca' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/><br/>
<a href='http://www.facebook.com/sharer.php' name='fb_share' type='box_count'>Share</a><script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/><br/><a href='http://ecatrack.blogspot.com'><img alt='Best Blogger Tips' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5kreFRwyAdSY8X5lbY1bwKjSnIQoaWyNpJIj4LQ3hrvesTMX1AtiKe7T9mzEtGTK3hbjsoFpa_HJb-PKQip-9ZINEOwSTIXVOBaI19vURcaeco3vbQjICIFDvp989bNFa75Xfy_n-LYH8/s1600/best+blogger+tips.png'/></a>
</div>
note: Replace My Twitter Username In Red eca With Yours, If you don't have one Leave It Blank.
Save Your Template.
=================================================
0 التعليقات:
Post a Comment