Blogger sosyal Paylaşım Abonelik Eklentisi
6 saat önce Onur BATUR tarafından yazılmıstır.
 |
| Sosyal Paylaşım abonelik eklentisi |
Blogger eklentilerinden sosyal medya butonları , rss feed gibi eklentileri demirbaş olarak nitelendirebiliriz.Yani bir blogda mutlaka olması gereklidir. Bu eklentiler ayrı ayrı eklenerek bloglara uygulanabilmekte ama ben bu yazımda tüm bu eklentilerin tek bir kutu içerisinde hazırlanmış halini sizlerle paylaşacağım. Yandaki resimden eklentinin nasıl bir görünüme sahip olduğunu görebilirsiniz. Bu eklenti Ayrıca sitenize gelen ziyaretçilerin e-mail adreslerini girerek yazılarınıza abone olabilme imkanı da sunmakta. Eklentiyi blogunuzun yerleşim kısmında sağ veya sol tarafa arama kutusundan sonra yerleştirmeniz hem göz önünde olup ziyaretçilerin sosyal medya hesaplarınıza kolayca ulaşabilmelerini sağlayacak hem de güzel bir görünüme sahip olacaktır. Blogger sosyal paylaşım ve abonelik kutusu Eklentisini blogunuza uygulamak için aşağıdaki adımları takip ediniz.
- Blogger a giriş yaptıktan sonra şablon sekmesine tıklayın.
- Html'yi düzenle butonuna tıklayın.
- Aşağıda yer alan kodu ctrl+f yardımı ile aratarak bulunuz.
- ]]></b:skin>
<script src='http://apis.google.com/js/plusone.js' type='text/javascript'/>Şablonu kaydedin ve Blogger panelin'den Yerleşim ardından gadget ekle ve html javascript'i seçiniz.Açılan sayfaya aşağıdaki kodları yapıştırın.
- Kodlar içerisinde ugurturkoglu olarak yazan yere kendi adreslerinizi yazınız.
- Googleplus id yerinede google plus adresinizi yazınız.
Blogger sosyal paylaşım ve abonelik kutusu eklentisi blogunuza uygulanmış durumda.<style> mbgadget-bar { border: 0; margin-bottom: 10px; margin: 0 auto; width:300px; } .fb-likebox { background: #fff; padding: 10px 13px 0 10px; border-right: 1px solid #D8E6EB; border-left: 1px solid #D8E6EB; border-bottom: 1px solid #D8E6EB; margin:0px; height:45px; } .googleplus { background: #F5FCFE; border-top: 1px solid #FFF; border-bottom: 1px solid #ebebeb; border-right: 1px solid #D8E6EB; border-left: 1px solid #D8E6EB; border-image: initial; font-size: .90em; font-family: "Arial","Helvetica",sans-serif; color: #000; padding: 9px 11px; line-height: 1px;} .googleplus span { color: #000; font-size: 11px; position: absolute; display:inline-block; margin: 9px 70px;} .g-plusone { float: left;} .gplus { background: #fff; padding: 0px; border: 0px solid #C7DBE2; margin-bottom:-13px;} .twitter { background: #EEF9FD; padding: 10px; border: 1px solid #C7DBE2; border-top: 0;} #mashable { background: #EBEBEB; border: 1px solid #CCC; border-top: 1px solid white; padding: 2px 8px 2px 3px; text-align: right; border-image: initial;} #mashable .author-credit {} #mashable .author-credit a { font-size: 10px; font-weight: bold; text-shadow: 1px 1px white; color: #1E598E; text-decoration:none;} #email-news-subscribe .email-box{ padding: 5px 10px; font-family: "Arial","Helvetica",sans-serif; border-top: 0; border-right: 1px solid #C7DBE2; border-left: 1px solid #C7DBE2; border-image: initial; height:35px;} #email-news-subscribe .email-box input.email{ background:#FFFFFF; border: 1px solid #dedede; color: #999; padding: 7px 10px 8px 10px; -moz-border-radius: 3px; -webkit-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; border-image: initial; font-family: "Arial","Helvetica",sans-serif;} #email-news-subscribe .email-box input.email:focus{color:#333} #email-news-subscribe .email-box input.subscribe{ background: -moz-linear-gradient(center top,#FFCA00 0,#FF9B00 100%); background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#FFCA00),color-stop(1,#FF9B00)); background: -moz-linear-gradient(center top,#FFCA00 0,#FF9B00 100%); -pie-background: linear-gradient(270deg,#ffca00,#ff9b00); font-family: "Arial","Helvetica",sans-serif; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; border:1px solid #cc7c00; color:white; text-shadow:#d08d00 1px 1px 0; padding:7px 14px; margin-left:3px; font-weight:bold; font-size:12px; cursor:pointer; border-image: initial;} #email-news-subscribe .email-box input.subscribe:hover{ background: #ff9b00; background-image:-moz-linear-gradient(top,#ffda4d,#ff9b00); background-image:-webkit-gradient(linear,left top,left bottom,from(#ffda4d),to(#ff9b00)); filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#ffffff,endColorStr=#ebebeb); outline:0;-moz-box-shadow:0 0 3px #999; -webkit-box-shadow:0 0 3px #999; box-shadow:0 0 3px #999 background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#ffda4d),color-stop(1,#ff9b00)); background:-moz-linear-gradient(center top,#ffda4d 0,#ff9b00 100%); -pie-background:linear-gradient(270deg,#ffda4d,#ff9b00); border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; border:1px solid #cc7c00; color:#FFFFFF; text-shadow:#d08d00 1px 1px 0} #other-social-bar { background-color: #D8E6EB; box-shadow: 0 1px 1px #FFFFFF inset; padding: 0px; font-family: "Arial","Helvetica",sans-serif; font-weight:bold; overflow: hidden; border: 1px solid #B6D0DA; height:37px; } #other-social-bar ul {list-style: none outside none; padding-left: 4px;} #other-social-bar .other-follow { float: left; color:#1E598E; overflow: hidden; height:20px; padding:5px; width: 270px;} #other-social-bar .other-follow ul { list-style: none outside none; padding-left: 4px;} #other-social-bar .other-follow ul li { font-size: 12px; font-weight: bold; display:inline; border:0; text-shadow: 1px 1px white;} #other-social-bar .other-follow ul li a { font-size: 12px; color:#1E598E; font-weight: bold; display:inline; text-shadow: 1px 1px white;} #other-social-bar .other-follow li { font-size: 12px; font-weight: bold; display:inline; border:0; text-shadow: 1px 1px white;} #other-social-bar .other-follow li a { font-size: 12px; color:#1E598E; font-weight: bold; display:inline; text-shadow: 1px 1px white;} #other-social-bar .other-follow li.my-rss { background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtiGOLEGsBPv1GmkLNglfAZQ4k9BzAPxTzxgt6PnKknIrVTBIPJfCJI_suZPWnSRT0qij3I8OKEhHH4LdHSJDr6-xeIqfefp2ApYCcAgV6BOJE1frRcKHsSQN9mcuqSHj82TP9tlbUe98/s400/rss-16x16.png') no-repeat transparent; line-height: 1; padding: 0px 3px 1px 20px; width: 60px; margin-bottom:0px; margin-left:5px;} #other-social-bar .other-follow li.my-rss a, #other-social-bar .other-follow li.my-twitter a, #other-social-bar .other-follow li.my-gplus a{ text-decoration:none; } #other-social-bar .other-follow li.my-rss a:hover, #other-social-bar .other-follow li.my-twitter a:hover, #other-social-bar .other-follow li.my-gplus a:hover{ text-decoration:underline; } #other-social-bar .other-follow li.my-twitter { background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjA4QRF8WgMfiququinUnK9czK8VAR-IVMYjmDLa2YKCDgwD-pKEg58FxDcS1PvQxbAxRau8-UT5ppYthlUg8PSmXlIHRLy8yt08wa7y9GbXhz738eGhd5v5vRMQbdv2KGfD9y1qNa8vlg/s400/twitter%2527.png') no-repeat transparent; line-height: 1; padding: 0px 3px 1px 20px; width: 60px; margin-bottom:0px;} #other-social-bar .other-follow li.my-gplus { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4w3Xj6dxEpLhXpxlHiOdCIlX48bjGQ1cKMiownX-cC4MTfD6cWU5UsOzxXVMcOTznbCrUhVJ_isecxgkhAf_aukoVI_6d3SS0puX5wBpSKZ3JKyUxdxCbIOeNRj56NX4YkI6QT3jiltY/s400/gplus-16x16.png) no-repeat transparent; line-height: 1; width: 60px; padding: 0px 3px 1px 20px; margin-bottom:0px;} </style>
<style> #email-news-subscribe .email-box input.subscribe{ background: #FFCA00; } </style> <div style="margin-bottom:10px;">
<div id="MBT-mashable-bar" >
<div class="gplus">
<link href="https://plus.google.com/GooglePlusAdresiniz" rel="publisher" /><script type="text/javascript"> window.___gcfg = {lang: 'en'}; undefinedfunctionundefined) {var po = document.createElementundefined"script"); po.type = "text/javascript"; po.async = true;po.src = "https://apis.google.com/js/plusone.js"; var s = document.getElementsByTagNameundefined"script")[0]; s.parentNode.insertBeforeundefinedpo, s); })undefined);</script> <script type="text/javascript"> var _gaq = _gaq || []; _gaq.pushundefined['_setAccount', 'UA-29131740-1']); _gaq.pushundefined['_trackPageview']); undefinedfunctionundefined) { var ga = document.createElementundefined'script'); ga.type = 'text/javascript'; ga.async = true; ga.src = undefined'https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagNameundefined'script')[0]; s.parentNode.insertBeforeundefinedga, s); })undefined); </script> <g:plus href="https://plus.google.com/googleplusadresiniz" width="300" height="131" margin="0px" theme="light"></g:plus> </div>
<div class="fb-likebox">
<iframe src="//www.facebook.com/plugins/like.php?href=http://facebook.com/letdldfb&send=false&layout=standard& width=200px&show_faces=false&action=like&colorscheme=light& font&height=100px&" scrolling="no" frameborder="0" style="border:none; overflow:hidden; "></iframe> </div>
<div class="googleplus">
<span>Google +</span><div class="g-plusone" data-size="medium">
</div>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> </div>
<div class="twitter">
<iframe title="" style="width: 300px; height: 20px;" class="twitter-follow-button" src="http://platform.twitter.com/widgets/follow_button.html#_=1319978796351& align=&button=blue&id=twitter_tweet_button_0& lang=en&link_color=&screen_name=ugurturkoglu&show_count=& show_screen_name=&text_color=" frameborder="0" scrolling="no"></iframe> </div>
<div id="email-news-subscribe">
<div class="email-box">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=feedburnerid', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input class="email" type="text" style="width: 150px; font-size: 12px;" id="email" name="email" value="E-mail adresinizi giriniz.." onfocus="ifundefinedthis.value==this.defaultValue)this.value='';" onblur="ifundefinedthis.value=='')this.value=this.defaultValue;" /> <input type="hidden" value="feedburnerid" name="uri" /> <input type="hidden" name="loc" value="en_US" /> <input class="subscribe" name="commit" type="submit" value="Subscribe" /> </form>
</div>
</div>
<div id="other-social-bar">
<ul class="other-follow">
<li class="my-rss"> <a rel="nofollow" title="RSS" href="http://feeds.feedburner.com/ugurturkoglu" target="_blank">RSS Feed</a> </li>
<li class="my-twitter"> <a rel="nofollow" title="twitter" rel="author" href=http://twitter.com/ugurturkoglu target="_blank">Twitter</a> </li>
<li class="my-gplus"> <a rel="nofollow" title="Google Plus" rel="author" href=https://plus.google.com/googleplusid target="_blank">Google Plus</a> </li>
</ul>
</div>
</div></div>
Sayfayla birlikte hareket eden sosyal paylaşım butonları
6 saat önce Onur BATUR tarafından yazılmıstır.
 |
| sosyal buton |
Blog yazarları için sosyal medyanın önemi oldukça fazladır. Bu yazımda da blogger sosyal medya butonları eklentilerinden sayfayla birlikte hareket eden sosyal medya butonları eklentisini blogunuza nasıl uygulayacağınızdan bahsedeceğim.Daha önceki yazılarımda da değişik sosyal medya butonları eklentilerine yer vermiştim.
- Blogger sosyal paylaşım butonları
- Sayfa da aşağı inildiğinde çıkan paylaş eklentisi
- Rss Abonelik ve sosyal medya Butonları
- Yazı altına sosyal paylaşım butonları
- Kalp stilli sosyal medya butonları
Bu eklentimiz ise diğer sosyal paylaşım eklentilerinden farklı olarak sayfayla birlikte hareket etmekte. Belki bir kaç haber sitesinde veya başka bloglar da karşılaşmışsınızdır bu eklentiyle. Hoş ve kulllanışlı bir blogger eklentisi.
Bu eklenti yi blogunuza uygulamak için aşağıdaki adımları uygulayın :
- Blogger paneline giriş yapınız.
- Yerleşim sekmesine tıklayınız..
- Gadget ekle butonuna ve
- Html/java script 'i seçerek aşağıdaki kodları yapıştırınız.
- Kaydet butonuna tıklayarak sonlandırın.
<div class="addthis_toolbox addthis_floating_style addthis_counter_style" style="left:200px;top:100px;">
<a class="addthis_button_facebook_like" fb:like:layout="box_count"></a>
<a class="addthis_button_tweet" tw:count="vertical"></a><
<a class="addthis_button_google_plusone" g:plusone:size="tall"></a>
<a class="addthis_counter"></a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script>
Blogger Kalp stilli sosyal paylaşım butonları
6 saat önce Onur BATUR tarafından yazılmıstır.
 |
| Kalp stilli sosyal paylaşım butonları |
Blogunuza uğrayan ziyaretçilerin yazılarınızı sosyal paylaşım sitelerinde paylaşmalarını sağlamak blogunuz için önemli bir noktadır.Daha önceki konularda da sosyal paylaşım butonları kullanmanın blogunuza etkisinden bahsetmiştim. Bir kaç konu ile :
Blogger blogunuza Kalp görünümlü sosyal paylaşım butonlarını eklemek isterseniz aşağıdaki adımları blogunuza uygulayınız.- Blogger paneline giriş yapınız.
- Şablon / Html'yi düzenle' ye tıklayınız.
- ]]></b:skin> kodunu ctrl+f yardımı ile aratarak bulunuz ve bu kodun hemen bir üst satırına aşağıdaki kodları yapıştırınız.
/* ugurturkoglu.blogspot.com */
.bubblewrap{
list-style-type:none;
margin:0;
padding:0;
}
.bubblewrap li{
display:inline;
width: 60px;
height:60px;
}
.bubblewrap li img{
width: 50px;
height: 50px;
border:0;
margin-right: 4px;
-webkit-transition:-webkit-transform 0.1s ease-in;
-o-transition:-o-transform 0.1s ease-in;
}
.bubblewrap li img:hover{
-moz-transform:scale(1.8);
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}
- Yukarıda bulunan kodları ekledikten sonra tekrar blogger paneline dönün.
- Yerleşim sekmesinden gadget ekleye daha sonra da Html javascripte tıklayın.
- Açılan sayfaya aşağıdaki kodları yapıştırın.
<ul class="bubblewrap">
<li><a href="Google plus adresiniz"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCX7qcqRbtu2-IxLR_bjGPrWsK3v01s02Px7KWA2PKu5o6s56ESNFfC-lE7rWgaIZ-fgasGpWLvXZ_jey8gtYY3GPqCUvvlMO4Tki1zEYE5nxUvfy3Qup7DL5EIAciGH1h6p2UEIZek_I/s1600/bloggertrix-google.png" title="Google" /></a></li>
<li><a href="Facebook adresiniz"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVR3UpTKxN1pHqUKix3XHdS5sIAA-rkDRz7hAhkvBjvZFcdtl8gKDn9tab97imJSetMmWO3NyD4l2S9a1vRI7rd2S6SwrCfGvHW_n8WspkKTkhSy-jy56PQYarrcrkTqqts4B8r8FSbbA/s1600/bloggertrix-facebook.png" title="Facebook" /></a></li>
<li><a href="http://www.Stumbleupon.com/Username"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0ZPo-TVW0ZXdgVU89IeQTJPtp7t4akCL6Ajz2V5t8HYIPAYZx0jqfPbjApxsxmxniueFhxrYTh-eVgmfHWevfXXvPFSdyiwSw2qv-P0mS6el6WniTbU6DcjijiSLHv169BCLvvXMdLHk/s1600/bloggertrix-stumble.png" title="Digg" /></a></li>
<li><a href="http://www.twitter/ugurturkoglu"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgV07xgtyuLTOIkwieXnCvjW2zzMHeO6IinE_1cBQYpsANAL6fweUqEyGUnivHxU4aHus7ScN-P-zC08MEzQ4MBCvLRIiAlMSKzeGH_qz7wuETUjDTSkblRvSltBJp1PnX-Pb8Xp58FkmE/s1600/bloggertrix-twitter.png" title="Twitter" /></a></li>
<li><a href="http://feeds2.feedburner.com/ugurturkoglu"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiorHQxpvj0HB5jpl8nCCHGwnWa_LO9BkzLD4SBTCA1eddfTLhF6s3RUW1vA6J6pnr3qWRLiUbeXN1bGa2OlSB_tBddcuBdDdxj62UVLJ13x7SPyFLoSFJCJAIJlR3hX6UkEoeG82wC18k/s1600/bloggertrix-rss.png" title="RSS Feed" /></a></li>
</ul>
Blogger RSS abonelik kutusu ve Sosyal paylaşım butonları
6 saat önce Onur BATUR tarafından yazılmıstır.
 |
| Rss abonelik kutusu |
Sosyal medyanın şu anki internet kullanımındaki gücünü hepimiz biliyoruz. Keza sosyal paylaşım butonları ve RSS abonelik'inde etkisi aynı şekilde. Blogunuzda yazdığınız bir yazının sosyal medya da paylaşılması daha çok kitleye ulaşılması demektir .Haliyle Bu da blogunuzun daha çok trafik alması demektir. Blogunuzun sosyal medya da daha etkin olmasını sağlamak da siz blog yazarlarının elinde. Blogunuzda yer vereceğiniz facebook, twitter, pinterest vs gibi sosyal medya araçlarını kullanarak daha etkin bir blog oluşturabilirsiniz. Bu sosyal medya araçları dışında farklı etkili bir yöntem de yazılarınıza abone okuyucu sağlamaktır. Blogunuza RSS kutusu ekleyerek bunu sağlamak mümkün.Bir çok blog da haber sitelerinde vs başka internet platformlarından da bültenimize abone olun, yazılarımıza abone olun tarzı bir kutucuk ve butonla karşılaşmışsınızdır. Feedburner yani RSS okuyucusunu kullanarak bir yazı yazdığınız da , RSS abonesi olan okuyuculara yeni yazınız gönderilecektir.Kısacası e-mail yoluyla yazınız kayıtlı okuyuculara ulaşacaktır.
Blogger RSS abonelik kutusu ve Sosyal paylaşım butonları eklentisini , TEST butonuna tıklayarak görebilirsiniz.Blogger RSS abonelik kutusu ve Sosyal paylaşım butonları eklentisini blogunuza uygulamak için :
- Blogger paneline giriş yapınız.
- Yerleşim sekmesine tıklayınız.
- Gadget Ekle / Html javascript'e tıklayınız.
- Açılan penceredeki kutucuğa aşağıdaki kodları yapıştırınız.
<style>
. social_box-email{
background:Fff no-repeat 0px 12px ; width:270px;float:center;font-size:1.4em;font-weight:bold;margin:2px 20px 0px 10px;color:#686B6C;
}
. social_box-emailsubmit{
background:#0084CE;cursor:pointer; color:#fff; border:none;padding:3px;margin:0 0 0px 0;text-shadow:0 -1px 1px rgbaundefined0,0,0,0.25);
-moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; font:12px sans-serif;
}
. social_box-emailsubmit:hover{
background:#E98313;
}
.textarea{
padding:2px; margin:0px 2px 0px 2px; background:#f9f9f9; border:1px solid #ccc; resize:none; box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1);
-moz-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1); -webkit-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1); font-size:13px; width:200px; height:20px;color:#666;}
#socialbox
{
text-align:center;font-weight:bold;padding:5px;border:1px solid black;width:300px;
-moz-box-shadow: 0px 0px 8px #000000;-webkit-box-shadow: 0px 0px 8px #000000;box-shadow: 0px 0px 8px #000000;}
</style>
<br />
<div id="socialbox">
<a href="http://feeds.feedburner.com/ugurturkoglu" imageanchor="1" rel="nofollow" style="float: center; margin-left: .5em; margin-right: 1em;" target="blank"></a>
<br />
<div class="social_box-email">
<form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=ugurturkoglu', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input class="textarea" gtbfieldid="3" name="email" onblur="if undefinedthis.value == "") {this.value = "E-mail adresinizi yazınız";}" onfocus="if undefinedthis.value == "E-mail adresinizi yazınız") {this.value = "";}" type="text" value="E-mail adresinizi yazınız..." />
<input name="uri" type="hidden" value="ugurturkoglu" /><input name="loc" type="hidden" value="en_US" />
<input class="social_box-emailsubmit" type="submit" value="Kaydol" />
</form>
</div>
<style class="text/css">
table
{border-bottom: 0px solid #E6E6E6;float: center;width: 300px;margin:-8px 0 0 0px;}
.subicons
{border-right: 0px solid #E6E6E6;}
.Fadeout {filter:alphaundefinedopacity=100);opacity: 1.0;border:0;
}
.Fadeout:hover{filter:alphaundefinedopacity=80);opacity: 0.8;border:0;
}
</style>
<br /><div class="table"><table>
<tbody><tr>
<td><div class="subicons">
<a class="Fadeout" href="http://www.facebook.com/ugurturkoglu" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlMidOh2pC63xFgoc-M8IDCAAvTJG9rTjrTJVx65gbWj6ejkb2tOyd-xtEbMAnhFJ0W6DhJc9-gCOBlDV2gOTAf7zjQke9yN23E8CjO4fJ5yZbH61zn-COpqxg624V6mcmUFvHUTi9dKg/s1600/btrix-facebook-icon.png" /></a></div>
</td><td><div class="subicons">
<a class="Fadeout" href="http://twitter.com/ugurturkoglu" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIsvKtpNDqvrAIQxjUkV-YF8DWISIdd_kn-XvpaeN-DYgfsvpte5d4M5V4TTcM3WKQqdXDBt86hGTG_wmpLBayj_0yjCCzV9_JDBjyNN9hWHQvof0cy369eI-xmn7tiSg0eB_E0yG34Rw/s1600/btrix-twitter-icon.png" /></a></div>
</td>
<td><div class="subicons">
<a class="Fadeout" href="http://feeds.feedburner.com/ugurturkoglu" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwBxmG_erYAswLJuhdDugxOKku_Egf-BPXpW_497uvNDaGb3sRa9td8AKf1kaFJTOeoPoBbyCppeacnlyfabquhq3IxRF3tT1e9NFt0-Pa-ooQMBKP3S3ae0ist5bufT4oju6hIZsMK5c/s1600/btrix-rss-icon.png" /></a></div>
</td>
<td><a class="Fadeout" href="https://pinterest.com/ugurturkogluu" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJPjsJ4wwZ2scipN1TzDlGf-VcwdQXoM9McuJjk8ISI2rrw2vb8f2uvj4WeEmAso-UCRJ6dBJLsQ0mbKa4jNR0AOSgqQ8RsewNZV0PtF44NZgLPfXMQKmKidO6AXqhRYYy0pWoEgm5Wmc/s1600/btrix-Pinterest-icon.png" /></a></td>
</tr></tbody></table></div></div>
- Mavi ile yazılan yerlerdeki adresleri kendinize göre düzenleyiniz.
- Kaydet butonuna tıklayınız.
Bir önceki yazımda Blogger da css ile dropdown menü yapımı hakkında bilgiler verilmektedir.
Yazı Altına Sosyal Paylaşım Butonları
6 saat önce Onur BATUR tarafından yazılmıstır.
 |
| Blogger yazi altına sosyal paylaşım butonları |
Blogger da yazı altına sosyal paylaşım butonları ekleyerek , blogunuza uğrayan ziyaretçilerin yazılarınızı sosyal paylaşım sitelerinde paylaşmalarını sağlayabilirsiniz.Daha önceleri de bu sosyal paylaşım butonlarının blogunuza yararları hakkında bir yazı yazmıştım ve bir kaç sosyal paylaşma butonları eklentileri de eklemiştim.
- Bloggerda sosyal medya butonlarının kullanımın önemi
- Blogger sosyal paylaşım butonları
- Sayfa da aşağı inildiğinde çıkan paylaş eklentisi
Bu widgeti blogunuza ekleyerek Facebook , twitter , google plus , pinterest ve linkedin gibi sosyal paylaşım sitelerinde yazılarınız paylaşılabilir.Bu sayede sosyal medya dan alacağınız trafik artacaktır.
Gelelim yazı altına sosyal paylaşım butonlarının nasıl ekleneceğine :
Öncelikle her ihtimale karşı blog şablonunuzun bir yedeğini alınız.
- Blogger paneline giriş yapınız.
- Şablon html'yi düzenle butonuna tıklayınız.
- ]]></b:skin> kodunu Ctrl+F yöntemi ile aratarak bulunuz.
- Bulduğunuz kodun hemen bir üst satırına aşağıdaki kodları yapıştırınız.
ul.social_btrix {
list-style:none;
display:inline-block;
margin:15px auto;
}
ul.social_btrix li {
display:inline;
float:left;
background-repeat:no-repeat;
}
ul.social_btrix li a {
display:block;
width:50px;
height:50px;
padding-right:10px;
position:relative;
text-decoration:none;
}
ul.social_btrix li a strong {
font-weight:400;
position:absolute;
left:20px;
top:-1px;
color:#fff;
z-index:9999;
text-shadow:1px 1px 0 rgba(0,0,0,0.75);
background-color:rgba(0,0,0,0.7);
-moz-border-radius:3px;
-moz-box-shadow:0 0 5px rgba(0,0,0,0.5);
-webkit-border-radius:3px;
-webkit-box-shadow:0 0 5px rgba(0,0,0,0.5);
border-radius:3px;
box-shadow:0 0 5px rgba(0,0,0,0.5);
padding:3px;
}
ul.social_btrix li.abfacebook {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLjbkobVhjUOJHM4xMgwqUvUQof-7s48nJBPfvz-lYR-UQ1Fh1Qcz0XjHEdDtcsKHMPjSyZVNZOCwjCsPiKUMYbni6wEo724kGP8bQy1rN5e6msEQqkjIrIppVrhKBJ2BbP7x4q2XPV7rO/s1600/btrix-facebook-icon.png);
}
ul.social_btrix li.abtwitter {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHX-BNtgHix4yt5Rmmw8TZ99_XIwlK1aHFtyxq-U9c1BColszUdHVDZWjGzj3CglhJroV6cZTXyBQ4AXRMaFDtUf2xLchsSI7npIBTo-sODL9EQa_U1ApG-PClJjOKKt8LjJvdwKcdFM36/s1600/btrix-twitter-icon.png);
}
ul.social_btrix li.abgoogleplus {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmmSRa4I-RALOVhDx2i1P0l7OIRX9gCY9T5uBpqEND5Srrm0qIzdly7icWWN0aHTisKvIBM1916IQFfPah2mbhyphenhyphenv24MaKpOjzbmZwX31d0qQ96ajBn0QNCDgGMBdpgYAcb7rJg1891I28h/s1600/btrix-google-icon.png);
}
ul li.abpinterest {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXz-pec2ORnzWLZiOQVCpkft40OixbHyGLnfy5z9ybyyrRANegsh6dUBoYxY3y_2Qkzf_IwoY7n5eNzzvhPujyvBhMTeQ1TiI0pSG9sD35oK7d2IyNZQvdBzSWHDKDUQ3orZmCOo_2ta8i/s1600/btrix-Pinterest-icon.png);
}
ul.social_btrix li.ablinkedin {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0hyphenhyphenWP5DLXFaCno0c3k7QOFgRzZoIF2lvgMM5BIr_BWyd6nQvOE28YIaw8BfOEmuR5IYzQ92rqqdCfejuVnLyBJGiDt_6Vsh_pbyN9k_IALZ85pvEPTJgpsVAsJW8AVJO8rU7C5SP0_l75/s1600/btrix-Linkedin-icon.png);
}
#animation_btrix:hover li {
opacity:0.2;
}
#animation_btrix li {
-webkit-transition-property:opacity;
-webkit-transition-duration:500ms;
-moz-transition-property:opacity;
-moz-transition-duration:500ms;
}
#animation_btrix li a strong {
opacity:0;
-webkit-transition-property:opacity, top;
-webkit-transition-duration:300ms;
-moz-transition-property:opacity, top;
-moz-transition-duration:300ms;
}
#animation_btrix li:hover {
opacity:1;
}
#animation_btrix li:hover a strong {
opacity:1;
top:-10px;
}
- Daha sonra <data:post.body/> kodunu aratınız.Bu kodun altına da aşağıda yer alan kodları yapıştırınız.<data:post.body/> kodunu arattığınıza birden fazla sonuç çıkabilir.Genelde ikinci bulduğunuz <data:post.body/> kodunun altına yapıştırın.Yani ben bu eklentiyi bloguma uygularken bu şekilde yaptım.Eğer olmazsa diğer bulduğunuz <data:post.body/> kodunun altına yapıştırın.
- Eğer sosyal paylaşım butonlarının yazınızın en başında görünmesini istiyorsanızda bulmuş olduğunuz <data:post.body/> kodunun hemen bir üst satırına aşağıdaki kodları yapıştırın.
<b:if cond='data:blog.pageType == "item"'>
<div style='font-size: 22px;'><b>Share this article with your friends.</b></div>
<ul class='social_btrix' id='animation_btrix'>
<li class='abfacebook'>
<a expr:href='"http://www.facebook.com/share.php?v=4&src=bm&u=" + data:post.url + "&t=" + data:post.title ' onclick='window.open(this.href,'sharer','toolbar=0,status=0,width=626,height=436'); return false;' rel='nofollow'><strong>Facebook</strong></a>
</li>
<li class='abtwitter'>
<a expr:href='"http://twitter.com/home?status=" + data:post.title + " -- " + data:post.url ' rel='nofollow' target='_blank'><strong>Twitter</strong></a>
</li>
<li class='abgoogleplus'>
<a expr:href='"https://plusone.google.com/_/+1/confirm?hl=en&url=" + data:post.url' onclick='window.open(this.href,'sharer','toolbar=0,status=0,width=626,height=436'); return false;' rel='nofollow' target='_blank'><strong>Google+</strong></a>
</li>
<li class='abpinterest'>
<a href='javascript:void((function()%7Bvar%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);document.body.appendChild(e)%7D)());' rel='nofollow' target='_blank'><strong>Pinterest</strong></a>
</li>
<li class='ablinkedin'>
<a expr:href='"http://www.linkedin.com/shareArticle?mini=true&url=" + data:post.url + "&title=" + data:post.title + "&summary=&source="' rel='nofollow' target='_blank'><strong>LinkedIn</strong></a>
</li>
</ul>
</b:if>
- Kaydet butonuna tıklayarak yazı altına sosyal paylaşım butonları eklemiş olacaksınız.
Bir önceki yazımda Blogger da yazılarınıza ekledğiniz resimlerin SEO için önemi' hakkında bilgiler verilmektedir.
Blogger Yandan Açılan sosyal Paylaşım Butonları
6 saat önce Onur BATUR tarafından yazılmıstır.
 |
| Blogger sosyal medya butonları |
Blogger da sosyal medya butonlarının kullanımının blogunuza etkisi trafik açısından oldukça önemlidir. Blogunuza gelen ziyaretçiye ne kadar çok sizi takip etmesi için olanak sağlarsanız , size geri dönüşü daha kolay olacaktır. SEO yani sosyal medya optimizasyonu'nun bir ayağıda bu sosyal paylaşım araçlarıdır. Buradaki sosyal medya kelimesi aslında her şeyi belli ediyor zaten.Örnek vermek gerekirse: En büyük sosyal medya aracı facebook. Facebook sayfasınızı blogunuzda paylaşarak kullanıcılar sizi facebook yolu ile de takip edebilirler.Kitle olarak da daha fazla kişiye ulaşabilrsiniz elbette.
Bu yazımda blogger da sayfada yandan açılan sosyal paylaşım butonları'nın blogunuza nasıl ekleneceğini anlatmaya çalışacağım.Daha önceleri Bloggerda sosyal paylaşım ikonları hakkında da bir yazı yazmış ve blogunuza nasıl ekleyeceğiniz hakkında bilgiler vermiştim.
Bunlara da Bakabilirsiniz:
Bunlara da Bakabilirsiniz:
Öncelikle Sosyal paylaşım butonlarının nasıl sayfada nasıl göründüğünü merak ediyorsanız , TEST butonuna tıklayarak görebilirsiniz.
 |
| Resim -1 |
 |
| Resim -2 |
- Blogger paneline giriş yapınız.
- Yerleşim sekmesinden Gadget ekleye tıklayınız.
- Html-javascript ekle'ye tıklayınız.Açılan pencereye aşağıdaki kodları yapıştırınız.
<style>
.fixedmenu{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTONCjsphibB7MT-i7iK_P1BDUFPvh86pbLp_UxSaheDe5PvDaCKU6SI6Ijs8uKculmdxMngBDWzDnWoY3H7emM2x-qWamdEumFDICZ2_-G6h3_pQZBMGU3gP1ZBDTo2Yv7fgodo0m9bU/s1600/facebook.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:160px; z-index:1000;}
.fixedmenu1{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6uhQ_OXH7-LIaWguyVQUJGqXMRQSQRr5eYhIGWnDb5ZkSuLKBt2XhXduBqBU7qsyClS0DFe4hyphenhyphenSlVBlkaWGnD7NaR4nj0_a5lF3OzVlKaaj_Lk6qOVNBIHIIqFCyrkEYosEB4Np0w0zc/s1600/facebook-hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:160px; z-index:1100;}
.fixedmenu_1{margin:0px 0 0 43px}
.fixedmenutw{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWxiZl5-oc_RPLEEBjZP1vUGf708F9fpKxkzb5QdQq8nG_Jk34qpWcE4ODPQkIb5aQy2cu6LsDbfJJ2nhh0ukqlNDPHfDH4i3h7wm8kW2MPEsH3WpLCtUkCgnSOCGgug41UYyS8VNW5dw/s1600/twitter.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:205px;z-index:1000;}
.fixedmenutw1{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXye9N1tnrQ4_D4inc_LNDPsPQB0HTOjGeJRErCD7XsISsQrLzynoU_eNwpc7y_o7IGq3LpVugBd_HXoO1Gt1BW0e6hhaUS3pwjtknhx8BHlSSYzhyphenhyphenqcKg0sNGrLmRQswbHZ2ZeKFrIeo/s1600/twitter_hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:205px; z-index:1100;}
.fixedmenutw_1{margin:0px 0 0 43px}
.fixedmenufb{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgytpmpHrRykc5lIuIwsoLXXEvYryutTMuSm0uFOkUl5pykCoUCF0X4Glxrmwqm_oaHobFCxPaRKoQ-p9iJfSjbZL2pJJf2SBEOmaMUNXdixR5YEbPpLpmcyIVzW1kVP8ArwQWk2-L1B88/s1600/Gplus.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:250px; z-index:1000;}
.fixedmenufb1{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0cjDVpKPgAkz_RdO5NC8gt3YpLK4DMwn-0GcfIfgJwqt3LIjBws2CN5-r2756JAQ1hG6dFSpk5a-F-rAND_u4fl9wI3F_BjFtwd2EhVTtG4qVyzjxF07_ePCBtplV-GEemT_muw6R0Sk/s1600/Gplus_hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:250px; z-index:1100;}
.fixedmenufb_1{margin:0px 0 0 43px}
.fixedmenurss{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKgTEZWaLilqMRPbr19E069IWYcELK8MMcmlDnP4x4mtpdQoe7GYI5EHHP0o-6V7XWCzOKdPoy3P_EBE9sU06k-o5MXevtA-GwUeJpv_6IqV1t0rq17M4gipyNy8ioJcb7_XCD136dpOk/s1600/rss.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:295px; z-index:1000;}
.fixedmenurss1{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIMg92IdZ_eXPk8d7G1TM4BRT-gNYyredYDUD4ugF5Uh7lzZLwBpQu76hI1X9W-EcgpjKO6hyphenhyphenGHaWuNwRVeHv9t5CaiIlN_mD3QSlwQN3mlHfpMElBnnAjKOPcoCJpuTAO3dY_M4xEHKY/s1600/RSS-hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:295px; z-index:1100;}
.fixedmenurss_1{margin:0px 0 0 43px}
</style>
<div class='fixedmenu' onmouseout='this.className='fixedmenu'' onmouseover='this.className='fixedmenu1''><div class='fixedmenu_1'>
<a href='https://www.facebook.com/ugurturkoglu' target='_blank'><img alt='Facebook takip et' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjckMSTY4khsPqWCYECW_WQuABczwUK1TsZUVi0WnQmE67l5PjeSOYg5fnpY2dp8L2YsGk-FZha2zp2_oYLPXLeENqyu-l3yYGTC-PQZh4scxdsX2V3p_fvRkayY05pB2kqh0F7c8awKic/s1600/facebook-hover1.png' title=' Facebook takip et'/></a><br/>
</div></div><div class='fixedmenutw' onmouseout='this.className='fixedmenutw'' onmouseover='this.className='fixedmenutw1''><div class='fixedmenutw_1'>
<a href='https://twitter.com/ugurturkoglu' target='_blank'><img alt='Twitter takip et' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqhm4P-yHK0YqeO0oKo39tzr50ieQ1Zd8__pQTyNK-7RrYtCnJqU4i6c4BObljwUUwqeQ7ygDbIpw-Heif7jaGBKc95_JsNeUFDRl4LrrdK-Jp9fwjw3ChWHXYZiJ50EUrLwUq5pds3io/s1600/twitter_hover1.png' title=' Twitter takip et'/></a><br/>
</div></div><div class='fixedmenufb' onmouseout='this.className='fixedmenufb'' onmouseover='this.className='fixedmenufb1''><div class='fixedmenufb_1'>
<a href='https://plus.google.com/Adresiniz' target='_blank'><img alt='Google Plus takip et' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAY6X4n2N3vr1R7jppbVj9yQteamWYZAiVLUd41Vk1gXFnvePinZti8fASJ_Y3w8B2s0-Xa47mYph5-GuUG_CjBiowywFUDyjTQ7mAcI4boU6qzuv1pbQdiJeyO6UIpnYuqeNVdG-1sVw/s1600/Gplus_hover1.png' title=' Google Plus takip et'/></a><br/>
</div></div><div class='fixedmenurss' onmouseout='this.className='fixedmenurss'' onmouseover='this.className='fixedmenurss1''><div class='fixedmenurss_1'>
<a href='http://feeds.feedburner.com/ugurturkogluu target='_blank'><img alt='Rss kaydol' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj29zzBUmmz0MMv4RQlMVbaWAzqvcowPyNg6PtPLkjKQ-ZqKPEqXDSvSWUsAjlbF7hfkJMl_s1cfNTa_lZFvTMZ1inc81bMORHI-hsD3huYpotVOIi-WTZediXb-kTXfkSWSJoahkiQIZY/s1600/RSS-hover1.png' title='yazıya abone ol'/></a><br/>
</div></div>- Kodlardaki mavi ile bulunan yerlere kendi facebook,twitter,google plus,feeds adreslerinizi yazınız.
- Kaydet'e tıklayıp çıkınız.
Bir önceki yazımda Google sitemap dosyasının nasıl oluşturulacağı ve google webmastera nasıl yükleneceği' hakkında bilgiler verilmektedir.
