Blogger şablonunun sağ üst köşesine sosyal medya butonları eklemek

Bu makalemde blogunuzun sağ üst köşesine nasıl sosyal medya butonları koyabileceğinizi anlatacağım.Bunu eklemenin birden fazla yolu vardır fakat biz Şablona yeni HTML kodları ekleyerek bunu yapacağız.Buraya koyacağınız sosyal medya butonları sayesinde okuyucularınız farklı sosyal medya sitelerinden sizi takip edebilir.Başlığınızın sağ üst tarafına koyacağınız bu butonlar ziyaretçilerinizin gözünden kaçmayacaktır çünkü blogunuzu yeni ziyaret eden bir kişi öncelikle başlığın bulunduğu alana bakar.Aynı şekilde başlığın altına veya blogunuzun üst kısmına koyacağınız reklamlar da size daha çok kazandırabilir.


                    



Eğer blogunuzun sağ üst tarafına sosyal medya butonları eklemek istiyorsanız alttaki adımları takip edin:

Adım 1 :Öncellikle blogger hesabınıza giriş yapınız ve Şablon>HTML'yi düzenleye tıklayın.

Adım 2:HTML kodu içinde herhangi bir alana tıklayın ve CTRL+F kombinasyonu yardımıyla alttaki kodu bulun:

]]></b:skin>

Adım 3:Yukarıda bulduğunuz kodun hemen üstüne alttaki kodu yapıştırın:

#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 0list-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 {-moz-transform: rotate(360deg);-webkit-transform: rotate(360deg);-o-transform: rotate(360deg);transform: rotate(-360deg);-moz-transition: all 0.5s ease-in-out;-webkit-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out;-ms-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;}

Adım 4:Şimdi CTRL+F kombinasyonu yardımıyla alttaki kodu bulun:

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

Adım 5:Adım 4'te bulduğunuz kodun hemen üstüne alttaki kodu kopyalayıp yapıştırın.

<div class='social-media-icons' id='social-icons'><ul>
<li class='media_icon'><a href='http://facebook.com/kullanıcıadı'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnQE9tsV2hy3MJ5-ZKLi1fULLieAvSzCzZCcr6wy1CZO2lzSoQx8T8d0iLaucNbFd50rUpG38mS8sKlxZTrgSmtopDNjvAlfzYtBQX3b74KJ30iEgIF4g6ND1lKZN3DaWr9o__WrwRR8Q/s1600/Facebook.png'/></a></li>

<li class='media_icon'><a href='http://twitter.com/#!/
<li class='media_icon'><a href='http://twitter.com/#!/kullanıcıadı'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCGhgEUjI53f9EPfXAYvtWY8YsLbJmLvbH5x2cahLFacKcSVnaOitH_UaXCf4jqgOda_0RpvIE42wEqTLu9xA9ATWKpHTduAiHivfcpWvbbzNSf6xucAhmt7sg5LrUnFOUKnTT6BE9yzs/s1600/Twitter.png'/></a></li>

<li class='media_icon'><a href='https://plus.google.com/
<li class='media_icon'><a href='https://plus.google.com/XXXXXXXXXXXXXXXXXX/about'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0RZlFtFjIOYyHGltS26tnetAizrLdl_Jq6LyV84aI7qNALLW7f4UvOQoFjEl-lgeg_nvnC2VW_7nO3ilGVyoymi_Ki7UlYNmZJwJzJlUYFuRo4Ec8Mg57M7SUWrd0bK9BBr6RbjqpB30/s1600/googleplus.png'/></a></li>

<li class='media_icon'><a href='http://
<li class='media_icon'><a href='http://blog-adı.com/feeds/posts/default'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuR1kZnjG3xOUUfZwkqV7Z_VzplJea5mJkJBKu_M2_zhK-iTM9N9JwC7OJeRSnKqYyoWgDQEu7fajEJn-engsaDq-LQJnZ81iPCFf1Lpp-H6GQPEoOC0IAFLLEcSBKBwyQjFyRxFJfhlo/s1600/RSS.png'/></a></li>

</ul></div>
</ul></div>

Gerekli özelleştirmeler


-Kırmızı renkle belirtilen yerlere birincisine Facebook ikincisine Twitter kullanıcı adınızı yazın.X'lerle belirtilen yerlere Google + profilinizin İD'sini yazın.Blog adı yazılan yere blogunuzun ismini yazın.

-Yeşil  renkle belirtilen url'ler simgeleri belirtiyor bunu başka resim url'si ile değiştirebilirsiniz.


Yukarıdaki adımları kontrol ettikten sonra Şablonunuzu kaydedebilirsiniz.