Adding social media share buttons in blogger post is must but social follow buttons on homepage give your visitors a chance to follow your blog and share the contents with their friends on social media. Social media sites are now a days more famous than anything else on the internet.
The above screenshot will show you how it will look on your blog.
Billions of people are now using social media sites and using this method to gain visitors on your blog is a nice idea.
This gadgets has 4 buttons including facebook, twitter, google plus and a button to subscribe to your blog feed.
Also, it comes with nice hover effect and if you want you can change the effect.
To install this gadget on your blog just follow simple steps given below.
Steps to follow
Customise
Change the links in blue color to your own links. You can copy the links when you visit your social media profile.
You can also place this gadget anywhere else in your blog. For example if you want to place this gadget on top of your sidebar gadgets then you just need to paste the second long code in 'HTML/Javascript' gadget.
The above screenshot will show you how it will look on your blog.
Billions of people are now using social media sites and using this method to gain visitors on your blog is a nice idea.
This gadgets has 4 buttons including facebook, twitter, google plus and a button to subscribe to your blog feed.
Also, it comes with nice hover effect and if you want you can change the effect.
To install this gadget on your blog just follow simple steps given below.
Steps to follow
- Open blogger
- Go to 'Template' and select 'Edit HTML'
- Now look for this code
]]></b:skin>
- Paste this code just above that code
#social-icons {
margin-bottom:-30px;
height:50px;
width:100%;
clear:both;
z-index: 2;
position: relative;
}
.social-media-icons {
display:table
}
.social-media-icons ul {
text-align:right;
padding:5px 5px 0 0
list-style-image:none;
list-style-position:outside;
list-style-type:none;
}
.social-media-icons ul {
margin-bottom:0;
padding:0;
float:right;
}
.social-media-icons li.media_icon {
margin-left:6px;
padding-left:0 !important;
background:none !important;
display:inline;
float:left;
}
.social-media-icons li:hover {
transform:scale(1.1);
-webkit-transform:scale(1.1);
-moz-transform:scale(1.1);
-ms-transform:scale(1.1);
-o-transform:scale(1.1);
-webkit-box-shadow: 0 58px 36px -56px black;
-moz-box-shadow: 0 58px 36px -56px black;
box-shadow: 0 58px 36px -56px black;
- Now search for this code
<b:section class='header' id='header' maxwidgets='1' name='Header' showaddelement='no'>
- Paste this code just above that code
<div class='social-media-icons' id='social-icons'>
<ul>
<li class='media_icon'><a href='http://facebook.com/username'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmVaAU7loBGa6PLeczRGdbJmHoAJ9vCr4QswhJkrzMAKBsvxouoIYpAqBvbd8WPPLv0fr9wumsjqwZaePwgvI8RCleZBnyLXokMFGevLSdyD4XVrnZJY-9xsvMI7aH_6lU4vZNThfxZlY/s1600/Facebook.png'/></a></li>
<li class='media_icon'><a href='http://twitter.com/#!/username'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWX3yQqxzQOWaWE7jCIqii6Wir5ELQEp3ffsO9H_ezpPkQ5ELCYG8azYBnSBw8n5d3fv7To1UyS9NCNoY88weG3uDofDX3GkeIjwbGKVNBAWJvqGJJkkTn1rofrIg-abbxJ-dfIFAU20I/s1600/Twitter.png'/></a></li>
<li class='media_icon'><a href='https://plus.google.com/XXXXXXXXXXXXXXXXXX/about'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihe1OAi-IwuBipdGoADsJ9p40D-DUdeCFxbJzE7ZPQeDA7b_J11KDJaPlbLY1qFMSLWTdCtSyeZoTqIzxjLsitBN-UdPpuQNsKS42c6ih1ayZKf63vZr-HontX89Xdw8B5g2f9w0hhXcI/s1600/googleplus.png'/></a></li>
<li class='media_icon'><a href='http://name-of-your-blog.com/feeds/posts/default'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVZ3WoOxWYmq6A9HRa6Gw01J0tLP3At3jIsjsY8_nY1wU7gbT3IyTeHwEa-8h4TtuX-bWEL0rnlDd0Kyup23Cf-LZgmXWPTPQZHVPeH3jJIVIL36Ovm7Xj8A0EzDZNmkXbFUpEybszBUM/s1600/RSS.png'/></a></li>
</ul></div>
- Change the important links before saving the template. Customisation settings are given below
Customise
Change the links in blue color to your own links. You can copy the links when you visit your social media profile.
You can also place this gadget anywhere else in your blog. For example if you want to place this gadget on top of your sidebar gadgets then you just need to paste the second long code in 'HTML/Javascript' gadget.
0 comments:
Don't forget to check 'Notify me' box to get notification of reply.