Bu yazımda blogger için dönen sosyal ağ kutucuklarını paylaşacağım. Kutucuklar rss, facebook, e-mail rss, twitter, google plus ve pinterest olarak eklenmiştir. Demoya hemen üst taraftan bakabilirsiniz. Kodlarda büyük harf ile yazılan yerleri kendi bilgilerinizle değiştirmeyi unutmayınız.
<style>
#social a:hover {
background-color: transparent;
opacity:0.7;
}
#social img {
-moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
}
#social img:hover {
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}
</style>
<center>
<div id="social">
<!--Start Rss Icon-->
<a title="Grab Our Rss Feed" href="YOUR-FEED-URL-HERE" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqWhhTTf5StMsAHePtso03P4_lvlWkacskwUFd3zgbx2dUmeZKzgX_5he-ahjjI6E3q6oWx9OZ2dtY9jSIrWSszT6-npGEVOQ9YAZpz3HeK3pcWE3FZmOjbnTGlAZgRYFaKUjrdppfyvJd/s1600/RSS-48x48.png" style="margin-right:1px;" alt="Icon"/></a>
<!--End Rss Icon-->
<!--Start Email Rss Icon-->
<a rel="nofollow" title="Get Free Updates Via Email" href="YOUR-EMAIL-RSS-URL-HERE" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6Y19wF0cMWZmw0u4pDNrUTRV0Ce9r44y7QBxjMHSMntfCfzyZkOEDPeerTLdNlyg1Or1zChgKBZnByDiXsR05txdUIUyN_gorg5OjxCnAoFDCuv9vQAhBv-pfuXMTiELap2ZzcW62-vUo/s1600/RSS-EMAIL-48x48.png" style="margin-right:1px;" alt="Icon"/></a>
<!--End Email Rss Icon-->
<!--Start Facebook Icon-->
<a rel="nofollow" title="Like Our Facebook Page" href="YOUR-FACEBOOK-PAGE-URL-HERE" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-2RvxKJa7i3pxi51g4mj1uQ_Wu6HFfiP7eOxoPzb_vWD7_tivWjhe1blQ5kvCQ1x28WZrdfAgDHzOEY6YD4VwsfWeh3fKrXmDx50UcZbeSCXqjPCMe95Jkp35dow-lPYUufoR2jt8o5Qd/s1600/FACEBOOK-48x48.png" style="margin-right:1px;" alt="Icon"/></a>
<!--End Facebook Icon-->
<!--Start Twitter Icon-->
<a rel="nofollow" title="Follow Our Updates On Twitter" href="YOUR-TWITTER-URL-HERE" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSFmziAbWCU5dKQMyKoQ-9V9SldqZ4nv1K6plE_JxPoiq9UrPKi_TnmGPwHCQZ7dhA1pGFzGDM8e99LSFllkHTXc8Kf84ulmw4T0jj4RNxO8jH9qOeQdojwnSlBTxSINNyAlOhs73_RrUi/s1600/TWITTER-48x48.png" style="margin-right:1px;" alt="Icon"/></a>
<!--End Twitter Icon-->
<!--Start Google+ Icon-->
<a title="Follow Us On Google+" rel="nofollow" href="YOUR-GOOGLE-PLUS-URL-HERE" target="_blank"><img style="margin-right:1px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiseu6zQ8ZylC-YMsnuetXOlxofgWX4sxJQJuZNh3glDHg86kAlVJZpd0FWGTg3ypUPa0QQsTMZdcK5ZOSlj_rwQXjmsiARt8yv-4hxXghU-mkgGbOJ8iFzm5BcxS_eQi19TCVQPhiUv62Y/s1600/GOOGLE-PLUS-48x48.png"/></a>
<!--End Google+ Icon-->
<!--Start Pinterest Icon-->
<a title="Follow Our Pins" rel="nofollow" href="YOUR-PINTEREST-URL-HERE" target="_blank"><img style="margin-right:1px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdKibzhi6WpLLLB5h6xVj5RyEcWxW3DmAxJatYTcduhnHKTpGow-d5pAcQveBTWZnFMfB62ZaSsVab2ehCjH0JwUa00mbeTfYXYudoYkypSNbLSvkZlxJPetqUovh74Az_y-IVCbb9R4by/s1600/PINTEREST-48x48.png" alt="Follow Me on Pinterest" /></a>
<!--End Pinterest Icon-->
</div>
</center>
#social a:hover {
background-color: transparent;
opacity:0.7;
}
#social img {
-moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
}
#social img:hover {
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}
</style>
<center>
<div id="social">
<!--Start Rss Icon-->
<a title="Grab Our Rss Feed" href="YOUR-FEED-URL-HERE" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqWhhTTf5StMsAHePtso03P4_lvlWkacskwUFd3zgbx2dUmeZKzgX_5he-ahjjI6E3q6oWx9OZ2dtY9jSIrWSszT6-npGEVOQ9YAZpz3HeK3pcWE3FZmOjbnTGlAZgRYFaKUjrdppfyvJd/s1600/RSS-48x48.png" style="margin-right:1px;" alt="Icon"/></a>
<!--End Rss Icon-->
<!--Start Email Rss Icon-->
<a rel="nofollow" title="Get Free Updates Via Email" href="YOUR-EMAIL-RSS-URL-HERE" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6Y19wF0cMWZmw0u4pDNrUTRV0Ce9r44y7QBxjMHSMntfCfzyZkOEDPeerTLdNlyg1Or1zChgKBZnByDiXsR05txdUIUyN_gorg5OjxCnAoFDCuv9vQAhBv-pfuXMTiELap2ZzcW62-vUo/s1600/RSS-EMAIL-48x48.png" style="margin-right:1px;" alt="Icon"/></a>
<!--End Email Rss Icon-->
<!--Start Facebook Icon-->
<a rel="nofollow" title="Like Our Facebook Page" href="YOUR-FACEBOOK-PAGE-URL-HERE" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-2RvxKJa7i3pxi51g4mj1uQ_Wu6HFfiP7eOxoPzb_vWD7_tivWjhe1blQ5kvCQ1x28WZrdfAgDHzOEY6YD4VwsfWeh3fKrXmDx50UcZbeSCXqjPCMe95Jkp35dow-lPYUufoR2jt8o5Qd/s1600/FACEBOOK-48x48.png" style="margin-right:1px;" alt="Icon"/></a>
<!--End Facebook Icon-->
<!--Start Twitter Icon-->
<a rel="nofollow" title="Follow Our Updates On Twitter" href="YOUR-TWITTER-URL-HERE" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSFmziAbWCU5dKQMyKoQ-9V9SldqZ4nv1K6plE_JxPoiq9UrPKi_TnmGPwHCQZ7dhA1pGFzGDM8e99LSFllkHTXc8Kf84ulmw4T0jj4RNxO8jH9qOeQdojwnSlBTxSINNyAlOhs73_RrUi/s1600/TWITTER-48x48.png" style="margin-right:1px;" alt="Icon"/></a>
<!--End Twitter Icon-->
<!--Start Google+ Icon-->
<a title="Follow Us On Google+" rel="nofollow" href="YOUR-GOOGLE-PLUS-URL-HERE" target="_blank"><img style="margin-right:1px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiseu6zQ8ZylC-YMsnuetXOlxofgWX4sxJQJuZNh3glDHg86kAlVJZpd0FWGTg3ypUPa0QQsTMZdcK5ZOSlj_rwQXjmsiARt8yv-4hxXghU-mkgGbOJ8iFzm5BcxS_eQi19TCVQPhiUv62Y/s1600/GOOGLE-PLUS-48x48.png"/></a>
<!--End Google+ Icon-->
<!--Start Pinterest Icon-->
<a title="Follow Our Pins" rel="nofollow" href="YOUR-PINTEREST-URL-HERE" target="_blank"><img style="margin-right:1px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdKibzhi6WpLLLB5h6xVj5RyEcWxW3DmAxJatYTcduhnHKTpGow-d5pAcQveBTWZnFMfB62ZaSsVab2ehCjH0JwUa00mbeTfYXYudoYkypSNbLSvkZlxJPetqUovh74Az_y-IVCbb9R4by/s1600/PINTEREST-48x48.png" alt="Follow Me on Pinterest" /></a>
<!--End Pinterest Icon-->
</div>
</center>