Blogger tarafından desteklenmektedir.

Kişisel Blog

sosyal eklenti etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
sosyal eklenti etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

7 Şubat 2013 Perşembe

Sayfada Aşağı inince Açılan Paylaş Eklentisi

Hiç yorum yok :

Sayfada Aşağı inince Açılan Paylaş Eklentisi

Blogger için , ziyaretçileriniz sayfada biraz aşağı inince açılan paylaş eklentisi istermisiniz ?

Bu eklentimizde , Twitter paylaş butonu , facebook paylaş butonu vb.. butonlar yer alacak , böylelikle ziyaretçileriniz yazlarınızı rahatlıkla paylaşabilecek..

Resimden ön izlemesini yapabilir Yada BU SAYFAdan demosunu görebilirsiniz ( Sayfa açılınca biraz aşağı inin  )

Anlatıma geçelim..

Aşağıdaki kodumuzu bulalım..
</head>
Bu kodumuzun üstüne , aşağıdaki kodlarımızı ekleyelim..
<script type="text/javascript">
var addthis_config = {
bar_show_below : 150
}
</script>
<script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js"></script>
Şimdide bu kodumuzu bulalım..
</body>
Bu kodumuzun da üstüne , aşağıdaki kodlarımızı ekleyelim..
<div class="addthis_bar addthis_bar_medium">
<label>Share This Page:</label>
<div class="addthis_toolbox addthis_default_style addthis_32x32_style">
<span><a class="addthis_button_preferred_1"></a></span>
<span><a class="addthis_button_preferred_2"></a></span>
<span><a class="addthis_button_preferred_3"></a></span>
<span><a class="addthis_button_preferred_4"></a></span>
<span><a class="addthis_button_compact"></a></span>
<span><a class="addthis_counter addthis_bubble_style"></a></span>
</div>
</div>
Artık Sayfada Aşağı inince Açılan Paylaş Eklentisine sahipsiniz, güle güle kullanın..


<<< Bu Yazı için Arama Sonuçları  >>>

Sayfada Aşağı inince Açılan Paylaş Eklentisi , blogger paylaş eklentisi, blogger paylaş butonları , facebook paylaş butonu , twitter paylaş butonu , Blogger paylaş butonları ekleme , blogger paylaş butonları eklentisi


21 Ocak 2013 Pazartesi

Retro Tazı Blogger Sosyal Paylaşım Eklentisi

Hiç yorum yok :

Retro Tazı Blogger Sosyal Paylaşım Widget


Altta yer alan kodlarımızı , Yerleşim >> Gadget Ekle >> HTML/JavaScript yardımı ile ekleyiniz..
<style>
/* Retro tarzı blogger sosyal paylasim eklentisi eklentileri.blogspot.com */
.bubblewrap{
list-style-type:none;
margin:0;
padding:0;
}
.bubblewrap li{
display:inline;
width: 60px;
height:60px;
}
.bubblewrap li img{
width: 50px; /* width of each image.*/
height: 50px; /* height of each image.*/
border:0;
margin-right: 4px; /*spacing between each image*/
-webkit-transition:-webkit-transform 0.1s ease-in; /*animate transform property */
-o-transition:-o-transform 0.1s ease-in; /*animate transform property in Opera */
}
.bubblewrap li img:hover{
-moz-transform:scale(1.8); /*scale up image 1.8x*/
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}</style>

<br />
<center>
<br />
<ul class="bubblewrap">
<li><a href="http://www.plus.google.com/XXXXX"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLuWTju3KjxS3vUB_Y3nUmecgVG8OYTDpwsMSa5Gy8WoTM4PShhz0VBIkqlol55fxmolV4wvZI5c7vOa1RmGmspJhq9EdXrN8wNUNQ5NTA8cOUz5T0lz4dpRFOTO3cWsZi7d43pdwIc0w/s1600/bloggertrix-google-icon.png" title="Add to Facebook" /></a></li>

<li><a href="http://www.facebook.com/XXXXX"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWE-aiYJKSuLG3uZMqinyBLdHK7CFZmwHHsO5PnCxWixdfqRBHVJRL5tfzu2zDB5CveY2fxUHBlB6hyphenhyphenxUY4tVBLNviFXz9zXHn9fA7pzAJHjZitcwWOjUWnvy6bKsQbJKjNAI_rLxAam0/s1600/bloggertrix-facebook-icon.png" title="Add to Facebook" /></a></li>

<li><a href="http://www.pinterest.com/XXXXX"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-XjHtcb6enMI6P0BxvnguLxeIm0Ed0fbg1TshUWCi_HRpU7B4Ug-QdZMYP0Ic4k6FJ1OMZES3M4-ju1RLZ2xhx38AEmhMKtNLS2ko9U-kGhFgpTilJ_VtnuYzckVgwVaiW34zyDvbENg/s1600/bloggertrix-pinterest-icon.png" title="Add to Digg" /></a></li>

<li><a href="http://www.twitter/XXXXX"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYW97zI1kXRXg1MnhtaMr9Z5BFtCukRxlmtxxaG3lgdtg-v0yDE7W62U4w77EGH3BBrxUmU4L9iN1V8Rql3Kxiw0rj3thF2d1n_CABXXsY8d4NfuirzYk9PoxHb2z9GgYl-wbdCDBhWXk/s1600/bloggertrix-twitter-icon.png" title="Add to Twitter" /></a></li>

<li><a href="http://feeds2.feedburner.com/XXXXX"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQkShRNfVZaFLCyO7CY5MbZt55jscQVEf7fw0XCIGUv8-CB9vgwKWiHImgRf02L-UgjNOjTubuT7LmocqK7Zb9BHaQ04sI3NGI0QpVkoF7BuHGkay-yjLuDSZNQwCgHT-yVFZuMaM1TIs/s1600/bloggertrix-rss-feed-icon.png" title="Add RSS Feed" /></a></li>
</ul>
Yukarıdaki kod içinde geçen XXXXX yazısı yerlerine kendi asreslerinizi yazmayı unutmayınız..

12 Ocak 2013 Cumartesi

Yazı Altına Sosyal Paylaşım Kutucukları

Hiç yorum yok :

Blogger Yazı Altı Sosyal Paylaşım Kutucukları Eklentisi..

Bu eklentimiz ile, yazılarınızın altına , twitter , facebook ve google+ kutucukları eklenecektir , ziyaretçileriniz böylelikle yazılarınızı twitter , facebook ve google+ da paylaşabilecekler..


Aşağıdaki kodlardan birini bulunuz , ilk denediğiniz olmazsa diğerini deneyiniz , bazı bloglarda bu kodlardan bir kaç tane olabilir , üşenmeyin deneyin..
<data:post.body/>


YADA


<div class='post-footer-line post-footer-line-1'/>
Bir satır altına aşağıdaki kodları ekleyelim..
<b:if cond="data:blog.pageType == &quot;item&quot;">
<style>
.promote_post_bg {
height: 103px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjya_n5wpJnrH26SlKFjhE9b-tBVR_PtW7E5fTbsUuFt3j4jDW0eh_j7s7clLTmc7NiaQBXjmLTlYXkij7iMieI2XGCT9fh2_33UbjZ9Qd3BlFIxwbSq94YGg3ajncyy5mWEe2TzlClqErv/s1600/social-kutucuk.png) 0 -7px no-repeat;
width: 500px;
margin-left: 65px;}
.promote_twitter {
width: 130px;
height: 38px;
float: left;
margin: 0 39px 0 0;
padding: 65px 0 0 13px;
text-align: center;}
.promote_facebook {
width: 115px;
height: 40px;
float: left;
margin: 0 39px 0 0;
padding: 63px 0 0 28px;
text-align: center;}
.promote_google {
width: 65px;
height: 40px;
float: left;
margin: 0 39px 0 0;
padding: 65px 0 0 28px;
text-align: center;
}
</style>
<div class="promote_post_bg">
<div class="promote_twitter">
<a class="twitter-share-button" data-via="BloggerEklenti" href="https://twitter.com/share">Tweet</a>
<script>
!
function (d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (!d.getElementById(id)) {
js = d.createElement(s);
js.id = id;
js.src = "//platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
}
}(document, "script", "twitter-wjs");

</script></div>
<div class="promote_facebook">
<fb:like action="like" colorscheme="light" expr:href="data:post.canonicalUrl" font="verdana" layout="button_count" send="false" show_faces="false"></fb:like>
<div>
<b:if cond="data:post.isFirstPost">
<script>
(function (d) {
var js, id = 'facebook-jssdk';
if (d.getElementById(id)) {
return;
}
js = d.createElement('script');
js.id = id;
js.async = true;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));

</script>
</b:if></div>
</div>
<div class="promote_google">
<g:plusone annotation="none" size="medium"></g:plusone>
<script type="text/javascript">
(function () {
var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);
})();

</script></div>
</div>
</b:if>



5 Ocak 2013 Cumartesi

Döner Sosyal Butonlar Eklentisi

Hiç yorum yok :

Blogger blogunuz için , Döner Sosyal Butonlar Eklentisi ile , ziyaretçiniz fare ile ikonların üzerine geldiğinde , ikonumuz dönme efekti gösterir..


Altta yer alan kodlarımızı , Yerleşim >> Gadget Ekle >> HTML/JavaScript yardımı ile ekleyiniz..
<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 href="http://draft.blogger.com/YOUR-FEED-URL-HERE" target="_blank" title="Grab Our Rss Feed"><img alt="Icon" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjf5KORU4WO4Rn1xcxtNF3vb1bJGtv08ljUhboXabzgWgxEbjMGw3XKX_osg3UilStnxK7cw7ldKDPLQkjnJrzrYoRp_0JwSvaR77Q87lei7rmavniFSPPvRTQpTYkZ-2PEA1IEnFQGYq2r/s1600/RSS-48x48.png" style="margin-right: 1px;" /></a>
<!--End Rss Icon-->
<!--Start Email Rss Icon-->
<a href="http://draft.blogger.com/YOUR-EMAIL-RSS-URL-HERE" rel="nofollow" target="_blank" title="Get Free Updates Via Email"><img alt="Icon" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiUp-jFwzSHxDdyLnXIZm1qut4dK5-MRqUds9IEC4HB6gfNGmLokg3oqDQQN0aiT7km5mGrcpQwoDDw7-8AxcRNrTFlr7Vh43I5l-xantbgpssufAOZATKd3CLYSIBRLtN8-WkkcZNEOqB/s1600/RSS-EMAIL-48x48.png" style="margin-right: 1px;" /></a>
<!--End Email Rss Icon-->
<!--Start Facebook Icon-->
<a href="http://draft.blogger.com/YOUR-FACEBOOK-PAGE-URL-HERE" rel="nofollow" target="_blank" title="Like Our Facebook Page"><img alt="Icon" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxsAowFVfZwF9Wy6xH2-fYWEx1edTM4weiN7ZK3R7j9SudLnaH8S1pZm_LQbfr1heUn3VtI7KqnwDKeZpVgUpHsuxjd9oPhTR31SvxOpvZiY5-g_M1ePb7EFGOq2C-euhEReTGc4pg0UKN/s1600/FACEBOOK-48x48.png" style="margin-right: 1px;" /></a>
<!--End Facebook Icon-->
<!--Start Twitter Icon-->
<a href="http://draft.blogger.com/YOUR-TWITTER-URL-HERE" rel="nofollow" target="_blank" title="Follow Our Updates On Twitter"><img alt="Icon" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKBjoEtJi11wxLssAK1WO1pegEBw_WtS-mtuJXpNRldHDcpMGdP9Hq0CXJmNRd19hIId9IKtN35q5Yr0QSQ05LT8Oa2XfLCK1tO5nnMYEWv9TV-nWKHeyI_EfZPvHKfe1SONmM3hgkgJWe/s1600/TWITTER-48x48.png" style="margin-right: 1px;" /></a>
<!--End Twitter Icon-->
<!--Start Google+ Icon-->
<a href="http://draft.blogger.com/YOUR-GOOGLE-PLUS-URL-HERE" rel="nofollow" target="_blank" title="Follow Us On Google+"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbfxTMygX-T2mgr4nQ5wr9jneDSaJ7tUih5Prl7budrljY05o1Lx1-0yooMBW1VmCSFJWt4Ryq5Llkhk0UJNW9wgVo5FOlrfCgEMqGZ1CH-ATspIP5ZUk4NzhQDbzY2GaaKfttBJqfaMJ2/s1600/GOOGLE-PLUS-48x48.png" style="margin-right: 1px;" /></a>
<!--End Google+ Icon-->
<!--Start Pinterest Icon-->
<a href="http://draft.blogger.com/YOUR-PINTEREST-URL-HERE" rel="nofollow" target="_blank" title="Follow Our Pins"><img alt="Follow Me on Pinterest" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTvCHYHCdAFooEqmfLE38eHZaUOUgk3wWtRSROc1cps6S44jrR-jWs1OhIGXi8-UYIlRP1PImu0Yf0TUwcJGr3-VPggLpN2IIJTVghkFTGLd2huHRDRWr2-4nlKX_cUv-ZsJ70l7njerYX/s1600/PINTEREST-48x48.png" style="margin-right: 1px;" /></a>
<!--End Pinterest Icon-->
</div>
</center>



18 Aralık 2012 Salı

Siyah Zoom Efektli Sosyal Butonlar Eklentisi

Hiç yorum yok :


Blogger blogunuz için, siyah ağırlıklı , google+ , facebook , twitter , digg ve rss butonları istermisiniz ? 

Siyah Zoom Efektli Sosyal Butonlar Eklentisi ile , sosyal sayfalarınızı blogger blogunuzda ziyaretçilerinize gösterebilirsiniz , ziyaretçi fare ile üstüne geldiğinde , zoom özelliği gösterir..


Aşağıdaki kodu bulunuz..
]]></b:skin>
Hemen üstüne alttaki kodları ekleyelim.
/* Siyah Zoom Efektli Sosyal Butonlar Eklentisi baslangici eklentileri.blogspot.com */
.bubblewrap{
list-style-type:none;
margin:0;
padding:0;
}
.bubblewrap li{
display:inline;
width: 60px;
height:60px;
}
.bubblewrap li img{
width: 50px; /* width of each image.*/
height: 50px; /* height of each image.*/
border:0;
margin-right: 4px; /*spacing between each image*/
-webkit-transition:-webkit-transform 0.1s ease-in; /*animate transform property */
-o-transition:-o-transform 0.1s ease-in; /*animate transform property in Opera */
}
.bubblewrap li img:hover{
-moz-transform:scale(1.8); /*scale up image 1.8x*/
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}
Şablonumuzu kaydediyoruz ve Yerleşim >> Gadget Ekle >> HTML/JavaScript yolu ile açılan panele alttaki kodları ekliyoruz..
<ul class="bubblewrap">

<li><a href="http://www.plus.google.com/xxxxx"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiHsfDV3b0YKaeEQZZH3axiPnxX71l0JobqRSJsZbW2C4bIvj-As3qpnt61Sm6q15WbKJLsIG2Hd4OrYrxZ_-auFE3NmU0YBs96Cs4ZGAu9iOn3Fmha7YiuoMaPefgZuwRsf8XSdwLFg8/s1600/bloggertrix-google-icon.png" title="Add to Google+" /></a></li>

<li><a href="http://www.facebook.com/xxxxx"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtUmUO3T67bE3eIPw5bqMArKmIjkTkzSqXX_fDm9bvthYpjTSP6R90GW3wFiSJ5R94qVxC3CyV-tyVh5KFMwIaZ8FXdCCUy3GLLsrZTtCOM_YY3pJZHIQnIjR134KLsOaBGharCF1Jw64/s1600/bloggertrix-facebook-icon.png" title="Add to Facebook" /></a></li>

<li><a href="http://www.digg.com/xxxxx"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO2GLuhZQIAkrxeR8MZk7rGlpQJLFofFsTKmudFytpMSy6423kIRSx3WecduW11P3an8OrqcDMiwWvGjrsRXEsnxG78q_7s-yKUokIi9pSETTMIVjP600gdTaK9ox-Bs48rTt7Zcsi-wo/s1600/bloggertrix-digg-icon.png" title="Add to Digg" /></a></li>

<li><a href="http://www.twitter/xxxxx"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVUAv_u1Ts5_Sr7BtZYp89PV6woT2cY0n477bk4galqvUGOTIk3hOeMUFyAC9DG9JLiCDayi_TTyG07vG9j0bhkIUeVrJOMgR0TGR9h_x4KuUDmq2FQF00-8bTvURKNcQ__YqbFyuiTT8/s1600/bloggertrix-twitter-icon.png" title="Add to Twitter" /></a></li>

<li><a href="http://feeds2.feedburner.com/xxxxx"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwDfuRGE59cNeeph9pWOxK0_k4XuYNanjVA55oBKnabKYX3i6Mp2RxzYTg24sy6SNdFpjDPcE7quIoh7XtHsq9juP_uhCPYK2D3sV8wyJ-3F4P3lF1jKdEAHTWsRqLZ6ZbQEN2n422ty8/s1600/bloggertrix-rss-icon.png" title="Add RSS Feed" /></a></li>
</ul>
Kodlar içinde kalın olarak vurgulanmış yerleri kendinize göre düzenleyiniz..


<<< Bu Yazı için Arama Sonuçları  >>> 

Siyah Zoom Efektli Sosyal Butonlar Eklentisi , Blogger Sosyal Butonlar Eklentisi , Blogger Sosyal , Sosyal , Sosyal Paylaşım , Blogger Facebook , Blogger Twitter , Sosyal Share , Social Sharing Buttons For Blogger ,Social Sharing Buttons  


19 Kasım 2012 Pazartesi

Yana Esneyen Sosyal Sayfalar Eklentisi

Hiç yorum yok :

Yana Esneyen Sosyal Sayfalar Eklentisi ile blogunuzda , facebook sayfanız , twitter adresiniz ve google+ sayfanıza bu hoş butonlar yardımı ile link verebilir ve ziyaretçilerinizi bu sayfalara yönlendirebilirsiniz..

Bu eklentimizin demosunu görmek için TIKLAYINIZ..

Blogger blogunuzun yönetim paneline girin ve Yerleşim >> Gadget Ekle >> HTML/JavaScript yolu ile açılan panele aşağıdaki kodları ekleyiniz..
<style type="text/css"> #buttonbg {width: 260px;margin: 10px 20px;padding: 0;} #buttonbg li {cursor: pointer;height: 48px;position: relative;list-style-type: none; } #buttonbg .icon {background: #D91E76 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAg8VULcv0bEIzgCqE8MoVCKKW0N9RgvqNF6QO2fyz1GuKGYo2dz4omQv0pi2ELmB9h6mpPUich54D0quMQai1DVyf6lJzADrZxL28laXgda69Lr1m_2j6iAeLs21Ajgdm2QqdB9QL8Os/s1600/blsocial12.png') 0 0 no-repeat; background-color: rgba(217, 30, 118, .42);border-radius: 30px;display: block; color: #141414;float: none;height: 48px;line-height: 48px; margin: 5px 0;position: relative;text-align: left;text-indent: 90px; text-shadow: #333 0 1px 0;white-space: nowrap;width: 48px;z-index: 5; -webkit-transition: width .25s ease-in-out, background-color .25s ease-in-out; -moz-transition: width .25s ease-in-out, background-color .25s ease-in-out; -o-transition: width .25s ease-in-out, background-color .25s ease-in-out; transition: width .25s ease-in-out, background-color .25s ease-in-out; -webkit-box-shadow: rgba(0, 0, 0, .28) 0 2px 3px; -moz-box-shadow: rgba(0,0,0, .28) 0 2px 3px; -o-box-shadow: rgba(0,0,0, .28) 0 2px 3px; box-shadow: rgba(0, 0, 0, .28) 0 2px 3px; text-decoration: none;} #buttonbg span:hover {visibility: hidden;} #buttonbg span {display: block;top: 15px;position: absolute;left: 90px;} #buttonbg .icon {color: #fafafa;overflow: hidden;} #buttonbg .fb {background-color: rgba(45,118,185, .42); background-position: 0 -382px;} #buttonbg .twit {background-color: rgba(0, 161, 223, .42); background-position: 0 -430px;} #buttonbg .google {background-color: rgba(167, 0, 0, .42); background-position: 0 -478px;} #buttonbg .pint {background-color: rgba(204, 0, 0, .42);background-position: 0 -526px;} #buttonbg .linked {background-color: rgba(0, 87, 114, .42); background-position: 0 -574px;} #buttonbg .deviant {background-color: rgba(76, 122, 74, .42); background-position: 0 -622px;} #buttonbg .ytube {background-color: rgba(170, 0, 0, .42); background-position: 0 -670px;} #buttonbg .rss {background-color: rgba(255,109, 0, .42); background-position: 0 -718px;} #buttonbg li:hover .icon {width: 250px; } #buttonbg li:hover .icon {background-color: #d91e76; } #buttonbg li:hover .fb {background-color: #2d76b9;background-position: 0 2px;} #buttonbg li:hover .twit {background-color: #00A1DF; background-position: 0 -46px; } #buttonbg li:hover .google {background-color: #A70000;background-position: 0 -94px;} #buttonbg li:hover .pint {background-color: #C00;background-position: 0 -142px; } #buttonbg li:hover .linked {background-color: #005772;background-position: 0 -190px;} #buttonbg li:hover .deviant {background-color: #4C7A4A;background-position: 0 -238px;} #buttonbg li:hover .ytube {background-color: #A00;background-position: 0 -286px; } #buttonbg li:hover .rss {background-color: #EC5601;background-position: 0 -334px; } #buttonbg .icon:active {bottom: -2px;-webkit-box-shadow: none;-moz-box-shadow: none;-o-box-shadow: none;} </style> 
<ul id="buttonbg"> <li ><a href="Facebook Adresiniz" class="icon fb">Facebook Takip Et >>></a><span>Facebook Takip Et</span></li> <li ><a href="Twitter Adresiniz" class="icon twit" >Twitter Takip Et >>></a><span>Twitter Takip Et</span></li> <li ><a href="Google+ Adresiniz" class="icon google" >Google+ Takip Et >>></a><span>Google+ Takip Et</span></li>
</ul>
Yukarıda kodları eklediyseniz , Yana Esneyen Sosyal Sayfalar Eklentisi blogunuz için hazır durumda , son olarak kodlar içinde geçen kırmızı ve siyah yerleri düzenleyiniz..



<<< Bu Yazı için Arama Sonuçları  >>> 

Yana Esneyen Sosyal Sayfalar Eklentisi , Sosyal Sayfa , Blogger Sosyal Sayfa eklentisi , Sosyal Sayfa Butonları , Facebook buton ekle , Twitter buton ekle , Google+ buton ekle , Blogger widget



28 Eylül 2012 Cuma

Blogger Renkli Sosyal Medya Eklentisi

Hiç yorum yok :

Blogger Renkli Sosyal Medya Eklentisi

Blogunuzda rengarenk sosyal medya eklentisi kullanmak için , aşağıdaki anlatımları takip ederek , blogger blogunuza ekleyebilirsiniz..

Blogunuzun yönetim panelinden Yerleşim >> Gadget Ekle >> HTML/JavaScript seçeneğini seçelim ve açılan panele aşağıdaki kodları ekleyelim..
<div class="btnt-chronicl-social">
<ul>
<li><a class="rss" href="http://feeds.feedburner.com/chandeepsBlogTips">Rss ile takip edin</a></li>
<li><a class="twitter" href="https://twitter.com/chandeeban">Twitter ile takip edin</a></li>
<li><a class="facebook" href="https://www.facebook.com/blogtipsntricks">Facebook ile takip edin</a></li>
<li><a class="google" href="https://plus.google.com/u/0/b/101110372634917065358/">Google+ ile takip edin</a></li>
<li><a class="linkedin" href="http://in.linkedin.com/in/blogtipsntricks">LinkedIn ile takip edin</a></li>
<li><a class="youtube" href="http://www.youtube.com/user/chandeep10">YouTube ile takip edin</a></li>
</ul>
</div>
<style type='text/css'>
/*<![CDATA[*/
.btnt-chronicl-social { width: 280px; margin: -10px; }
.btnt-chronicl-social ul { margin: 0; padding: 0; }
.btnt-chronicl-social ul li { list-style:none; padding: 0; text-transform: none; }
.btnt-chronicl-social ul li a { color: #fff; display:block; }
.btnt-chronicl-social ul li a:hover { color: #c9c9c9; background-color: #333; }
.btnt-chronicl-social ul li .rss { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/RSS-1.png") no-repeat scroll 10px center #F87E12; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .twitter { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/Twitter.png") no-repeat scroll 10px center #4CACEE; background-size: 20px; padding: 17.5px 45px;}
.btnt-chronicl-social ul li .facebook { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/Facebook-1.png") no-repeat scroll 10px center #3B5998; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .google { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/google.png") no-repeat scroll 10px center #D44937; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .linkedin { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/LinkedIn-1.png") no-repeat scroll 10px center #3692C3; background-size: 20px; padding: 17.5px 45px; }
.btnt-chronicl-social ul li .youtube { background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/social-icons/Youtube-1.png") no-repeat scroll 10px center #C6312B; background-size: 20px; padding: 17.5px 45px; }
/*]]>*/
</style>
Eklemiş olduğunuz kodlar içindeki , kırmızı ile yazılmış olan adresleri kendi adreslerinizle değiştirin..

DEMO



12 Haziran 2012 Salı

Blogger Hareketli Sosyal Medya Butonlar Eklentisi

Hiç yorum yok :

Blogger Hareketli Sosyal Butonlar Eklentisi Widget..

Bu eklentimizle , blogger blogunuza üzerine gelince renkelenen sosyal butonları ekliyeceğiz...Bu eklentimizle , rss, google , facebook ve twitter sayfalarınızı ziyaretçilerinize oldukça şık bir görünümle sunabilirsiniz..


Blogger Hareketli Sosyal Butonlar Eklentisini blogger'a eklemek için aşağıdaki adımı takip edin..

Blogunuzun yönetim panelinden Yerleşim >> Gadget Ekle >> HTML/JavaScript seçeneğini seçelim ve açılan panele aşağıdaki kodları ekleyelim..
<style> 
/*--------eklentileri.blogspot.com hareketli menu ------*/
.touchme a {
display:block;
height:50px;
width:50px;
padding:0 4px;
float:left;
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeH-SyPaEXtXuX2CJ5069tjZUcF0IV6SM3qOEeXzxZEFkjRr3Sw-NVe-58DPZKcVhzTBSqEnYOzTuweMQSC90PqPgCnkp48gbbyJ8WhhAiLQ7LY-vXruiWCJCyf4GP519sec1UALL6lxlb/s1600/eklentileri.blogspot.com.png) no-repeat;
-webkit-transition: ease-in 0.2s all;
-moz-transition: ease-in 0.2s all;
-o-transition: ease-in 0.2s all;
-ms-transition: ease-in 0.2s all;
transition: ease-in 0.2s all;
cursor:pointer;
}

.touchme a.googleplus {
background-position: 0px -58px;
}
.touchme a.googleplus:hover {
background-position: 0px 0px;
}

.touchme a.twitter {
background-position: 0px -290px;
}
.touchme a.twitter:hover {
background-position: 0px -232px;
}
.touchme a.facebook {
background-position: 0px -406px;
}
.touchme a.facebook:hover {
background-position: 0px -348px;
}

.touchme a.rss {
background-position: 0px -174px;
}
.touchme a.rss:hover {
background-position: 0px -116px;
}

</style>

<div class='touchme'>
<!--RSS-->
<a class='rss' href="RSS ADRESI" rel='external nofollow' target='_blank'></a>
<!--Google Plus-->
<a class='googleplus' href="GOOGLE PROFIL ADRESI" rel='external nofollow' target='_blank'></a>
<!--Facebook-->
<a class='facebook' href="FACEBOOK ADRESI" rel='external nofollow' target='_blank'></a>
<!-- Twitter -->
<a class='twitter' href="TWITTER ADRESI" rel='external nofollow' target='_blank' ></a>

</div>
Yukarıdaki kodlarda kırmızı ile yazılmış olan yerlere , kendi adreslerinizi yazmayı unutmayın...yapmanız gereken sadece bu kadar..


<<< Bu Yazı için Arama Sonuçları  >>>

Blogger Hareketli Sosyal Butonlar Eklentisi , Blogger Hareketli buton , blogger sosyal medya butonları , renk değiştiren butonlar , blogger sosyal ağ butonları , blogger facebook twitter buton


19 Mayıs 2012 Cumartesi

Arama kutusu , Sosyal paylaş ve takip et eklentisi..

Hiç yorum yok :

Arama kutusu , Sosyal paylaş ve takip et eklentisi..

Bu eklentimizde blogunuzda kullanabileceğiniz , arama kutusu , rss , feedburner (mail) , facebook ve twitter adresleriniz ile yazılarınızı paylaşmak için paylaş butonları bir arada..

Kullanışlı bir eklenti olduğunu düşündüğümüz ,Arama kutusu , Sosyal paylaş ve takip et eklentisini blogunuza eklemek isterseniz aşağıdaki anlatımı takip ederek sizde blogger blogunuza ekleyebilirsiniz..

Arama kutusu , Sosyal paylaş ve takip et blogger widget
</head>
yukarıdaki kodu bulunuz ve hemen üstüne aşağıdaki kodları ekleyiniz
<style type='text/css'> 
.subbox{width:305px;border:0 solid #141414;overflow:hidden}
.addthis_toolbox{padding:15px 0 5px 0;text-align:center}
.addthis_toolbox .custom_images a{width:32px;height:32px;margin:0 4px 0 4px;padding:0}
.addthis_toolbox .custom_images a:hover img{opacity:1}
.addthis_toolbox .custom_images a img{opacity:0.85}
.rssbox{background:#f7f6f6;border:1px solid #ccd1d7;padding:5px 10px;margin:10px 0 0 0;-moz-border-radius:10px;-khtml-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;width:125px}
.rssbox:hover{border:1px solid #92aed1}
.rssbox a{color:#7c8a9b;text-transform:uppercase;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif}
.rssbox a:hover{color:#7c8a9b;text-decoration:underline}
.emailsbox{background:#f7f6f6;border:1px solid #ccd1d7;padding:5px 10px;margin:10px 0 0 0;-moz-border-radius:10px;-khtml-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;width:125px}
.emailsbox:hover{border:1px solid #92aed1}
.emailsbox a{color:#7c8a9b;text-transform:uppercase;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif}
.emailsbox a:hover{color:#7c8a9b;text-decoration:underline}
.twitterbox{background:#f7f6f6;border:1px solid #ccd1d7;padding:5px 10px;margin:10px 0 0 0;-moz-border-radius:10px;-khtml-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;width:125px}
.twitterbox:hover{border:1px solid #92aed1}
.twitterbox a{color:#7c8a9b;text-transform:uppercase;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif}&gt;
.twitterbox a:hover{color:#7c8a9b;text-decoration:underline}
.facebookbox{background:#f7f6f6;border:1px solid #ccd1d7;padding:5px 10px;margin:10px 0 0 0;-moz-border-radius:10px;-khtml-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;width:125px}
.facebookbox:hover{border:1px solid #92aed1}
.facebookbox a{color:#7c8a9b;text-transform:uppercase;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif}
.facebookbox a:hover{color:#7c8a9b;text-decoration:underline}
#search{width:290px;padding:2px 2px;background:#f7f6f6;border:1px solid #ccd1d7;height:28px;margin-top:0;margin-left:5px;display:inline;float:left}
#search:hover{border:1px solid #92aed1}
#search form{margin:0;padding:0}
#search fieldset{margin:0;padding:0;border:none}
#search p{margin:0;font-size:85%}
#s{width:200px;margin:0 0 0 0;padding:5px 5px 5px 5px;border:none;font:normal 80% &quot;Tahoma&quot;,Arial,Helvetica,sans-serif;color:#000;float:left;background:#f7f6f6;display:inline}
input#searchsubmit{float:right;display:inline;margin:0 0 0 0;height:28px;background:#b2b2b2;color:#000;border:0 solid #222}
</style>

yukarıdaki işlemi yaptıysanız kaydedip çıkın , ardından yerleşim kısmından eklentimizi eklemek istediğiniz yere gadget olarak aşağıdaki kodları ekleyiniz.


<div class="subbox"> 
<div id='search' style='display:inline;'> 
<form action='/search' id='searchform' method='get'> 
<input id="s" name="q" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Search...&quot;;}" onfocus="if (this.value == &quot;Search...&quot;) {this.value = &quot;&quot;;}" type="text" value="Search..." /> 
<input id="searchsubmit" type="submit" value="Search" /> 
</form> 
</div> 
<table><tr> 
<td><div class="rssbox"> 
<a href="http://feeds.feedburner.com/FEEDBURNER-ID" target="_blank" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5m-32VImxqR4bXPob0G8JUuTgDR6camNFvMk1cAhcQ39roRvICqaD-3VYd46DiZQmv69VfZQZW_IvIOPAv3aIuQrrefEuhj0eSayhzQjTEmxiSVUIwIBFEgqxMwNFBVQao70W3EJc8Esx/"  alt="RSS Feed" title="RSS Feed" style="vertical-align:middle; margin-right: 5px;border:none;"  /></a><a href="http://feeds.feedburner.com/FEEDBURNER-ID" target="_blank" rel="nofollow">RSS Feed</a> 
</div></td> 
<td><div class="emailsbox"> 
<a href="http://feedburner.google.com/fb/a/mailverify?uri=FEEDBURNER-ID" target="_blank" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZ4w-WcslLCgsg448vlNPh1ByQEQ1KSPn1olSgE-TE-EeIB-Kkv3HCCqUgp3NFm9UmcvVUm0PdoDb9Was6zMuOYBrEKAIOkCYi5QA91d0wxI2-QZHzCPCSnTVUScUkMYppPaiu6LeHeLXB/"  alt="EMail Feed" title="EMail Feed" style="vertical-align:middle; margin-right: 5px;border:none;"  /></a><a href="http://feedburner.google.com/fb/a/mailverify?uri=FEEDBURNER-ID" target="_blank" rel="nofollow">EMail Feed</a> 
</div></td> 
</tr><tr> 
<td><div class="twitterbox"> 
<a href="http://twitter.com/TWITTER-USERNAME" target="_blank" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1Du7WpkmDbCR0dvvLDyNtcYz3WCMiUhpXYW02EUezJXugYqa8OK-7f3nZyXSJwZd_Q9sTdF44mFyvHfEpAfQUroMCryr93_rgdET88bPrYa6G7dImkgBdJ-74ijl_yFywoHA-T71AMdaN/"  alt="Twitter" title="Twitter" style="vertical-align:middle; margin-right: 5px;border:none;"  /></a><a href="http://twitter.com/TWITTER-USERNAME" target="_blank" rel="nofollow">Twitter</a> 
</div></td> 
<td><div class="facebookbox"> 
<a href="http://www.facebook.com/FACEBOOK-USERNAME" target="_blank" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOleY1omwaN60kBX2_575wbOt548Pqn8NH0golMXoHKcuNSMJeSd9u3VRORTPklZi_lzpoo9TYCJvnyREdOHOQAO5fOfIR3TAnuRtjBYMF4LNqBeKIQSipmvRaAivfO3m-YEnwUlGlu280/"  alt="Facebook" title="Facebook" style="vertical-align:middle; margin-right: 5px;border:none;"  /></a><a href="http://www.facebook.com/FACEBOOK-USERNAME" target="_blank" rel="nofollow">Facebook</a> 
</div></td> 
</tr></table> 
<p style="display:none;" align="center">Widget by <a href="http://www.ebloggertricks.com/" target="_blank">Eblogger Tricks</a></p> 
<div class='addthis_toolbox'> 
<div class='custom_images'> 
<a class='addthis_button_twitter'><img alt='Twitter' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidp_dIOkmMRPze02P_692SN8QSVNwKX371W0lTrLA7-S0VMo8Se5XM1eLBhZHW-wPzhLen4dpK3Afj8Ag1YMQbVRVfHkaiVb0JcIt3i03acYqCjuAxn28-3UW8XT-A50Wxq3jeB836r5k/' width='32'/></a> 
<a class='addthis_button_delicious'><img alt='Delicious' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzZHF3AN_yWBuUkIia8uR2X2mZ8qciWCeaDeotrEHUvwSL-uWgnWGqfdvrvPzs7HkrNd0NGXNU2sxHu-2yiiKuJ_cxp7YktFMs4iNUN2BZAO5oIP_C0M8nYcWriIIay-sEEqTS-33CBM0/' width='32'/></a> 
<a class='addthis_button_facebook'><img alt='Facebook' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIvVVRYgv61cyy5SeuHf7YAUGveYzwIYlBbF4bwSAIvekkII12zZF9ttZfmqSr9vsRcs0cQmXyB7dFykIOLnkKf4XaeSOoEW68Jxcw22aMST1G-BXBuou_qwuUC69qczB1r6K-0cmNoOw/' width='32'/></a> 
<a class='addthis_button_digg'><img alt='Digg' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhB5uePWW9OPrDCxSBPjfN9oQUWk7KFRaGABSsXwO8CjwCmZ4uKqKjVYp7SnMaCrxbf_oqsOdR5zOlK5QHDEGGGP3gmE-asMfxtc9Fd3zJCnkAeokDjRm8psv3XJgwy1Rmprmtd6jTSDbU/' width='32'/></a> 
<a class='addthis_button_stumbleupon'><img alt='Stumbleupon' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAcgscoAXO3ZKRyoXvZPHySoHM3pYEqT3P13WZMNHfDtDz67UixHQVm1k044G6o7_H67GePVCghoYtp-74BP9rrt4onGr6EonAcoDTuom2k8o4MFz1PgxKqKzfMUqa9Rq1Fj5K9k-oB74/' width='32'/></a> 
<a class='addthis_button_favorites'><img alt='Favorites' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0iQzXsJa-cNNCHPar2ypDrNgoRZ6wDd0kX0W_dkt41_d01CRdnsNxPjBmZdcfRKejLrP6JorhQRm-07pBouze0Mp6MVjmxBfeD0JC_epqdoY-iY6X6qA_dNZTLrAJGcyTZM7fNAWWkes/' width='32'/></a> 
<a class='addthis_button_more'><img alt='More' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYcPDKvqLgwOZICaO7INaUcCqAPiD9Ehe6b0VM_IWFER_7lSyzSFn288_W5zS49ANNwiISh_a_UgDgrfs_RZY4LChmnBnvymQQjG8xTaFqN-EVSbZ8jB3D6s5LaivvZS4yqTl1gHA0feU/' width='32'/></a> 
</div> 
<script src='http://s7.addthis.com/js/250/addthis_widget.js' type='text/javascript'/> 
</div> 
</div>
Eklediğiniz gadget içinde renkli olarak belirtilmiş yerlere kendi feedburner, facebook ve twitter kullanıcı adınızı yazmayı unutmayınız..

12 Nisan 2012 Perşembe

4in1 Yandan Açılan Facebook , Twitter , Google , Email Eklentisi

Hiç yorum yok :

4 in 1 Yandan Açılan Facebook , Twitter , Google , Email Eklentisi

Blogger blogunuzda , yandan açılan facebook takipçi kutusu , Twitter son yazılarınız , Google + butonu ve email takip eklentisi istermisiniz..

Oldukça kullanışlı ve güzel bir eklenti olan 4in1 Yandan Açılan Facebook , Twitter , Google , Email Eklentisini blogger blogunuza eklemek için aşağıdaki yolu izleyin , Aşağıdaki kodu blogunuza Gadget olarak ekleyin..Kod için bulunan Kırmızı yazılmış yerlere , facebook twitter ve feedburner adreslerinizi yazınız , ( https://www.facebook.com/XXXXX , TWİTTERADRES , FEEDBURNERADRES Kısımlarına kendi adreslerinizi yazınız..)   DEMO


<style>img,a{border:0;}#on{visibility:visible;}#off{visibility:hidden;}#facebook_div{width:196px;height:353px;overflow:hidden;}#twitter_div{width:246px;height:353px;overflow:hidden;}#google_plus_div{width:152px;height:97px;overflow:hidden;margin-left:50px;margin-top:10px;}#knfeedburner_div{width:300px;height:97px;margin-top:25px;overflow:hidden;}#kakinetwork_div{width:300px;height:97px;overflow:hidden;}/* right side style */#facebook_right{z-index:10005;border:2px solid #3c95d9;background-color:#fff;width:196px;height:353px;position:fixed;right:-200px;}#facebook_right img{position:absolute;top:-2px;left:-35px;}#facebook_right iframe{border:0px solid #3c95d9;overflow:hidden;position:static;height:360px;left:-2px;top:-3px;}#twitter_right{z-index:10004;border:2px solid #6CC5FF;background-color:#6CC5FF;width:246px;height:353px;position:fixed;right:-250px;}#twitter_right_img{position:absolute;top:-2px;left:-35px;border:0;}#google_plus_right{z-index:10003;background-color:#f2f2f2;border:2px solid #006ec9;border-top:2px solid #0056a0;border-bottom:2px solid #0056a0;border-right:2px solid #0056a0;border-left:hidden;width:152px;height:97px;position:fixed;right:-154px;}#google_plus_right_img{position:absolute;top:-2px;left:-33px;border:0;}#feedburner_right{z-index:10003;background-color:#fefefe;border:2px solid #5b5b5b;border-top:2px solid #5b5b5b;border-bottom:2px solid #5b5b5b;border-right:2px solid #5b5b5b;border-left:hidden;width:300px;height:97px;position:fixed;right:-303px;}#feedburner_right_img{position:absolute;top:-2px;left:-33px;border:0;}#kakinetwork_right{z-index:10003;border:2px solid #303030;background-color:#fff;width:300px;height:97px;position:fixed;}#kakinetwork_right img{position:absolute;top:-2px;left:-101px;}/* left side style */#facebook_left{z-index:10005;border:2px solid #3c95d9;background-color:#fff;width:196px;height:353px;position:fixed;left:-200px;}#facebook_left img{position:absolute;top:-2px;right:-35px;}#facebook_left iframe{border:0px solid #3c95d9;overflow:hidden;position:static;height:360px;right:-2px;top:-3px;}#twitter_left{z-index:10004;border:2px solid #6CC5FF;background-color:#6CC5FF;width:246px;height:353px;position:fixed;left:-250px;}#twitter_left_img{position:absolute;top:-2px;right:-35px;border:0;}#google_plus_left{z-index:10003;background-color:#006ec9;border:2px solid #006ec9;border-top:2px solid #0056a0;border-bottom:2px solid #0056a0;border-left:2px solid #0056a0;border-right:hidden;width:152px;height:97px;position:fixed;left:-154px;}#google_plus_left_img{position:absolute;top:-2px;right:-33px;border:0;}#feedburner_left{z-index:10003;background-color:#fefefe;border:2px solid #5b5b5b;border-top:2px solid #5b5b5b;border-bottom:2px solid #5b5b5b;border-left:2px solid #5b5b5b;border-right:hidden;width:300px;height:97px;position:fixed;left:-303px;}#feedburner_left_img{position:absolute;top:-2px;right:-33px;border:0;}#kakinetwork_left{z-index:10003;border:2px solid #303030;background-color:#fff;width:300px;height:97px;position:fixed;}#kakinetwork_left img{position:absolute;top:-2px;right:-101px;}.box-title1{border:1px solid #ddd;/*border-radius*/-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;/*box-shadow*/-webkit-box-shadow:5px 5px 5px #CCCCCC;-moz-box-shadow:5px 5px 5px #CCCCCC;box-shadow:5px 5px 5px #CCCCCC;padding:10px;margin:10px 0;}.enteryouremail{background:#fff !important;border:1px solid #d2d2d2;padding:0px 8px 0px 8px;color:#a19999;font-size:12px;height:25px;width:165px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;margin:0px;}.submitbutton{background:#f2f2f2;border:1px solid #F66303;/*box-shadow*/-webkit-box-shadow:3px 3px 3px #666;box-shadow:3px 3px 3px #666;font:bold 12px Arial, sans-serif;color:#000000;height:25px;padding:0 12px 0 12px;margin:0 0 0 5px;/*border-radius*/-webkit-border-radius:5px;border-radius:5px;cursor:pointer;}</style><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script><script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script><script type="text/javascript">jQuery(document).ready(function(){ jQuery("#facebook_right").hover(function(){ jQuery(this).stop(true,false).animate({right:  0}, 500); },function(){ jQuery("#facebook_right").stop(true,false).animate({right: -200}, 500); });    jQuery("#twitter_right").hover(function(){ jQuery(this).stop(true,false).animate({right:  0}, 500); },function(){ jQuery("#twitter_right").stop(true,false).animate({right: -250}, 500); });     jQuery("#google_plus_right").hover(function(){ jQuery(this).stop(true,false).animate({right:  0}, 500); },function(){ jQuery("#google_plus_right").stop(true,false).animate({right: -154}, 500); });    jQuery("#feedburner_right").hover(function(){ jQuery(this).stop(true,false).animate({right:  0}, 500); },function(){ jQuery("#feedburner_right").stop(true,false).animate({right: -303}, 500); });    });</script><div id="on"><div id="facebook_right" style="top: 18%;"><div id="facebook_div"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkTgHx3qdSfHqsfnTt6XdST4JtgwqNEL-fI49VqAjqaj6__UpAvwabZhUgbl-Uvn2McpxbvqncH5TVfJzPlUgmgTs_KyHK5iq0CKIgyc1VWbTfRvvZNAiFpSwj_E6zU09YR8obRQI2gKs/s1600/helperblogger.com-facebook-icon.png" alt="" /><iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/XXXXX&amp;locale=en_GB&amp;width=200&amp;connections=9&amp;stream=&amp;header=false&amp;show_faces=0&amp;height=356"   scrolling="no"></iframe></div></div></div><div id="on"><div id="twitter_right" style="top: 35%;"><div id="twitter_div"><img id="twitter_right_img" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhf7jdA3l5_fueTNTgFdEAkYi3qCG6sNvKlxrPVpp4sEeKH6AIl1WsHA8O70dRa_9a3hjOgwvK4rQtYztZCmgEQCYIsBVnW2n9_ZZdRCZPOQfpgWewnZwzIz-Ibj03K4rqIo2yFTWw1XLo/s1600/helperblogger.com-twitter-icon.png" /><script src="http://widgets.twimg.com/j/2/widget.js"></script><script>new TWTR.Widget({version: 2,type: 'profile',rpp: 4,interval: 1000,width: 246,height: 265,theme: {shell: {background: '#63BEFD',color: '#FFFFFF'},tweets: {background: '#FFFFFF',color: '#000000',links: '#47a61e'}},features: { loop: false,live: true,scrollbar: false,hashtags: false,timestamp: true,avatars: true,behavior: 'all' }}).render().setUser('TWİTTERADRES').start();</script></div></div></div><div id="on"><div id="google_plus_right" style="top: 52%;"><div id="google_plus_div"><img id="google_plus_right_img" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBNuUaywqqx2p4FdgvjD7PuPizfA3sPP5UfynXsuU9EG6tYe6d7Fvgrex9RRJaoVjzUCGm9w5TqXLO3bg3ab-bKyC0TNhDKXfsTeE3nvpPpl5O32V_z2SuM0QAxWRPaUbXCWQ5D-jf2fo/s1600/helperblogger.com-google-plus-icon.png" /><div style="float:left;margin:10px 10px 10px 0;"><g:plusone size="tall" expr:href="data:post.url"></g:plusone></div></div></div><div id="on"><div id="feedburner_right" style=" top: 69%;"><div id="knfeedburner_div"><center><h4 style="color:#F66303;">You can also receive Free Email Updates:</h4><form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=FEEDBURNERADRES', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input gtbfieldid="10" class="enteryouremail" name="email" value="Enter your email here..." onblur="if (this.value == &#39;&#39;) {this.value = &#39;Enter your email here...&#39;;}" onfocus="if (this.value == &#39;Enter your email here...&#39;) {this.value = &#39;&#39;;}" type="text" /><input value="FEEDBURNERADRES" name="uri" type="hidden" /><input value="Submit" class="submitbutton" type="submit" /></form></center><img id="feedburner_right_img" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfXKnxCzvQtuYnX26QWxbxphc_Afhh6jgOzKgiGXHcRpApslEU1f18VwFK7VmBhC1Jp8QlIqPEtiCr0_x1SQj-ls_AgfKKsodN91-T3_v2ZvizUpsCcFkV9zn__fCpgPsGVPLckn4kPUI/s1600/helperblogger.com-subscribe-icon.png" /></div></div></div></div>


<<< Bu Yazı için Arama Sonuçları  >>>

4in1 Yandan Açılan Facebook , Twitter , Google , Email Eklentisi , Blogger yandan açılan , Blogger yandan açılan facebook , blogger yandan açılan twitter kutusu 

6 Nisan 2012 Cuma

Yazı Altına Kalpli Paylaş Butonları Eklentisi

Hiç yorum yok :

Yazı Altına Kalpli Paylaş Butonları Eklentisi

Bu eklentimizde, blogger blogunuzda yayınladığınız yazılarınızın/konularınızın altında, kalp şeklinde paylaş butonlarının nasıl ekleneceğini anlatacağız..
Oldukça şık bir görüntüye sahip olan Yazı Altına Kalpli Paylaş Butonları Eklentisini blogger blogunuza eklemek için aşağıdaki adımları takip edin , ön izlemesini aşağıdaki demo linkinden görebilirsiniz..

Aşağıdaki kodumuzu buluyoruz
</head>
Hemen üstüne aşağıdaki kodlarımızı ekliyoruz..

<style type='text/css'>
/* Yazı Altına Kalpli Paylaş Butonları Eklentisi eklentileri.blogspot.com */
ul.bbelog-social { list-style:none; margin:15px auto;display:inline-block; }
ul.bbelog-social li { display:inline; float:left; background-repeat:no-repeat; }
ul.bbelog-social li a { display:block; width:55px; height:55px; padding-right:10px; position:relative; text-decoration:none; }
ul.bbelog-social li a strong { font-weight:normal; position:absolute; left:20px; top:-1px; color:#fff; padding:3px; 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);}
ul.bbelog-social li.bbelog-facebook { background-image:url(&quot;http://tools.adityawebs.com/images/facebook.png&quot;); }
ul.bbelog-social li.bbelog-twitter { background-image:url(&quot;http://tools.adityawebs.com/images/twitter.png&quot;); }
ul.bbelog-social li.bbelog-google { background-image:url(&quot;http://tools.adityawebs.com/images/google.png&quot;); }
ul.bbelog-social li.bbelog-stumbleupon { background-image:url(&quot;http://tools.adityawebs.com/images/stumble.png&quot;); }
ul.bbelog-social li.bbelog-delicious { background-image:url(&quot;http://tools.adityawebs.com/images/delicious.png&quot;); }
ul.bbelog-social li.bbelog-reddit { background-image:url(&quot;http://tools.adityawebs.com/images/reddit.png&quot;); }
ul.bbelog-social li.bbelog-technorati { background-image:url(&quot;http://tools.adityawebs.com/images/technorati.png&quot;); }
/* Yazı Altına Kalpli Paylaş Butonları Eklentisi eklentileri.blogspot.com
</style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
// Yazı Altına Kalpli Paylaş Butonları Eklentisi eklentileri.blogspot.com
$(document).ready(function () {
$(&quot;#bbelog-jqueryanime li&quot;).each(function () {
$(&quot;a strong&quot;, this).css(&quot;opacity&quot;, &quot;0&quot;);
});
$(&quot;#bbelog-jqueryanime li&quot;).hover(function () {
$(this).stop().fadeTo(500, 1).siblings().stop().fadeTo(500, 0.2);
$(&quot;a strong&quot;, this).stop().animate({
opacity: 1,
top: &quot;-10px&quot;
}, 300);
}, function () {
$(this).stop().fadeTo(500, 1).siblings().stop().fadeTo(500, 1);
$(&quot;a strong&quot;, this).stop().animate({
opacity: 0,
top: &quot;-1px&quot;
}, 300);
});
});
// Yazı Altına Kalpli Paylaş Butonları Eklentisi eklentileri.blogspot.com
</script>

Şimdi bu kodumuzu buluyoruz..
<div class='post-footer'>
Bulduğumuz bu kodun altına , altta yer alan kodları ekliyoruz..DEMO

<style type='text/css'>
<!--
.style2 {font-size: smaller}
-->
</style>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<ul class='bbelog-social' id='bbelog-jqueryanime'>
<li class='bbelog-facebook'>
<a expr:href='&quot;http://www.facebook.com/share.php?v=4&amp;src=bm&amp;u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title ' onclick='window.open(this.href,&apos;sharer&apos;,&apos;toolbar=0,status=0,width=626,height=436&apos;); return false;' rel='nofollow' title='Share this on Facebook'><strong>Facebook</strong></a>
</li>
<li class='bbelog-twitter'>
<a expr:href='&quot;http://twitter.com/home?status=&quot; + data:post.title + &quot; -- &quot; + data:post.url ' rel='nofollow' title='Tweet This!'><strong>Twitter</strong></a>
</li>
<li class='bbelog-google'>
<a expr:href='&quot;http://www.google.com/bookmarks/mark?op=add&amp;bkmk=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Add this to Google Bookmarks'><strong>Google Bookmarks</strong></a>
</li>
<li class='bbelog-stumbleupon'>
<a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title ' rel='nofollow' title='Stumble upon something good? Share it on StumbleUpon'><strong>StumbleUpon</strong></a>
</li>
<li class='bbelog-delicious'>
<a expr:href='&quot;http://delicious.com/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title ' rel='nofollow' title='Share this on del.icio.us'><strong>Delicious</strong></a>
</li>
<li class='bbelog-reddit'>
<a expr:href='&quot;http://reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title ' rel='nofollow' title='Share this on Reddit'><strong>Reddit</strong></a>
</li>
<li class='bbelog-technorati'>
<a expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url ' rel='nofollow' title='Share this on Technorati'><strong>Technorati</strong></a></li>
</ul><br/>

</b:if>




<<< Bu Yazı için Arama Sonuçları  >>>

Yazı Altına Kalpli Paylaş Butonları Eklentisi , Paylaş Butonları Eklentisi , Konu altına Paylaş Butonu , Paylaş Butonları Ekle , Konu içene Paylaş Butonları , Facebook Twitter Paylaş Butonu


29 Mart 2012 Perşembe

Renkli Çizim Şeklinde Sosyal Medya Butonları

Hiç yorum yok :

Renkli Çizim Şeklinde Sosyal Medya Butonları Eklentisi..

Blogger blogunuzda El çizimi şeklinde renkli sosyal medya butonları kullanmak istermisiniz , Bu blogger eklentisi ile farklı görünümde olan bu sosyal butonlarını kullanmış olacaksınız..

Sosyal paylaş butonları ile , facebook , twitter , rss ve google + sayfalarınızı ziyaretçilerinize tanıtmış olacaksınız..

Demosunu Görmek için TIKLAYIN

Yerleşim > Gadget ekle "HTML/Java Script" seçelim ve aşağıdaki kodu ekleyelim


<style class="text/css">
table
{
border-bottom: 0px solid #E6E6E6;
float: center;
width: 260px;
margin:10px 0 0 3px;
}
.subicons
{
border-right: 1px solid #E6E6E6;
}
.Fadeout {
filter:alpha(opacity=100);
opacity: 1.0;
border:0;
}
.Fadeout:hover{
filter:alpha(opacity=80);
opacity: 0.8;
border:0;
}
</style>
<div class="table">
<table>
<tr>
<td><div class="subicons"><a class="Fadeout" href="
http://www.facebook.com/XXXXX" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgb14k6PpAqbS4uAgKJAFEsnowC3KU4FJtc90NXfrjWkyGBR0fXM-MJw5qZWzG24nMFZOaiyvV3wLMDEuAO4xVToZU_MfhLEZfL5_Y_oo9orCbDMavfESQCp2V7T17e4N7xlq21kwg1IQp-/s1600/facebook-48.png" /></a></div></td><td><div class="subicons"><a class="Fadeout" href="http://twitter.com/XXXXX" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhealD5XGCg-PRaY6wvW_At-rcc7EyFooaURCyM1LAUEqF8FTjMILRwhy2d3S1j-P3aMUvgV8RF66SmPMs_cwWR0GRjA9Br88ZCfi0dNlGG0byCN4rn2iDplCbFdciQa1T-013wRAjlFUb_/s1600/twitter-48.png" /></a></div></td>
<td><div class="subicons"><a class="Fadeout" href="
http://feeds.feedburner.com/XXXXX" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxRNvVJMGqMN94iUiYc1iAHIcUdHTRC5YHw4rfUVII4w10u_AgOcUsSmQsyYCxXNa1Tg69IyNvIKWmbFu3IA0TZPthXpjEY4khDFVb1QgvPUzlB-jFhlSFjSSAim4Sgi_QPHV82tnUbBDg/s1600/rss-48.png" /></a></div></td>
<td><a class="Fadeout" href="
https://plus.google.com/110875602250977569192/posts" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRufpxsukLVYAoDuSNveF9-7iL_KXFLscEVetcaSQNqbHUR923e7PfJLPDnYbt_6MwNimKxIbFAKIar6vvi5BBcOqSEh0zmuv19YSsvjUZZXr2sORaUt2uYPfNE5hQKBNr-Mp361ydfyGa/s1600/google-48.png" /></a></td>
</tr></table>
</div>
Yukarıdaki kod içinde renkli yazılmış olan yerlere , kendi sayfalarınızın adreslerini yazınız..


<<< Bu Yazı için Arama Sonuçları  >>>

Sosyal medya butonları , Sosyal medya düğmeleri , blogger sosyal buton ekle , blogger için sosyal butonlar , blogger facebook twitter buton , blogger blog sosyal medya eklentisi, Sosyal medya eklentisi

23 Mart 2012 Cuma

Blogger Yaprak Şeklinde Paylaş Butonları

Hiç yorum yok :

Blogger Yaprak Şeklinde Paylaş Butonları

Bu eklentimiz yazılarınızın altına yaprak şeklinde paylaş butonları ekler , böylece ziyaretçileriniz yazılarınızı/konularınızı paylaşabilirler..

Blogger Yaprak Şeklinde Paylaş Butonlarını blogger blogunuza eklemek için aşağıdaki yolu uygulamanız yeterli..

Öncelikle aşağıdaki kodu bulunuz
<data:post.body/>
Hemen altına aşağıdaki kodu ekleyiniz ve kaydediniz..
<div style='clear:both; '>
<div style='width:65px; float:left;'>
<a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Stumble' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXQMCxs1LH3vkLjI96wTTQElTHYHA8UiI1CpRbW75uTn97D9ET7NhjKlF3dWSLzhbG2P3G0s6U32gbBF9XNhFIRXhDM2RCKXQOcUBy4FSng1T2W06gH5orHBOlYV82RqNhV2omPr2iMDs5/' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Delicious' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGB_nAAT79PcnziX7UTKErUJ3OSDadynQL-TeywrpNseELbpYCyyI1JXTCErWTwhIKGVQhVUHyq4LcXVeeobLceW8ffyRN2Ip2KVdimgkHnLtwE50misByOG3R3LBjkVP06wy-6fyggyyK/' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url' rel='external nofollow' target='_blank'><img alt='Technorati' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_93-I8T1DU3N_ydqW4R3FPzHv_ZrpkcinXwWf9A52niO3ENc0aMkTyN-oeb36DB2J8gF3LIBagwEEA9fGoS3v61f8nyinfPxJh-RKV4TwUFBuW0bG0FbK7HpaTKXajAxQr4Os1kTTcK9_/' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='&quot;http://twitthis.com/twit?url=&quot; + data:post.url' rel='external nofollow' target='_blank'><img alt='Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtjQiSssQgvs-1L9bxGwNbz67ua9wzUTT7K_mUt0XRwK3snUubh3h0sEZxuOQ6H9R4l7fdnK2Y1268RtjygKn9CIVzgXz1v_ieCbw0PKyOHnxjcAuIalYICi9jtf0IcwfdVnUtc4-_dREg/' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'><img alt='Digg' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXBQwgN-e5HhGjP8Y6vWdzRuohACE5avhxcyY6IjhB5dTgzJjgSL9ozq_C3uEjv5AFXXB0R_UYeEz3RWZ0q0Xk3U2Mk5FrRSUD7FhV51x4kjkrAv_nVyC-ri-Ui7Sck0KLWMcbI0FPf9QZ/' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4XXh5iXwuWlQ5qgIf_F2md8jRH1bxuNHt-CKKXsEITV8k6Gx5vczBxPBOo35WXjEhFQQ1uUSm5iU5vfhoAmmRApuuBvFpEUXAbR0rPe_lc7pt7kGa_06DDagRFFpZ2xZNBgpDe5dn8DOV/' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='&quot;http://reddit.com/submit?&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'><img alt='Reddit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkdhnCu9K23rFJSZotwLXgiFMnKV8zK7h4SzhDkr1dD4T5LAHcd_wtmG537RPcuTLX_5cDlaa8BIbjbexhJpPtKJC5bC1tpAJpXPwsrsFvkwfJyTdlN5WJvVJn5xu7b2gvyAWDLTaC_f6u/' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' rel='external nofollow' target='_blank'><img alt='Feed' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1Zi4LHmkL4HjzWOjsRy3MJt1ccHEI1kwK_ghWcrXosRGIruEYtePY3PlQJHQv-Z4ISywEeOv7pO4ZsSQUckrFzBPZVckIebVvU5vRTtmrOIPP0fTiaIjdSJ6VgY4lRyNivw3aMIY9Sy12/' style='padding:0;margin:0;border:none;'/></a>
</div>
</div>