teknoloji haberleri - internet haberleri: Blogger Eklenti

Blogger Eklenti etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

19 Şubat 2013 Salı

Blogger dinamik resim eklentisi

Unknown 12:30 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , Diğer , dinamik , resim Hiç yorum yok :

BU EKLENTİNİN ÖN İZLEMESİ İÇİN TIKLAYINIZ

Blogunuza dinamik bir resim eklentisi istermisiniz ?

Bu eklentimiz , fare ile resim üzerine gelindiğinde resmi bir miktar yatırır , oldukça güzel bir eklenti olduğunu düşündümüz dinamik resim efektini sizde blogunuzda kullanabilirsiniz..

öncelikle blogunuzda aşağıda kodu buluyorsunuz.

yukarıdaki kodun hemen üstüne bu kodu yapıştırıyoruz

kaydedip çıkıyoruz...

15 Şubat 2013 Cuma

Facebook , Twitter Yalancı Takipci Sayısı Eklentisi

Unknown 15:30 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , Facebook , facebook eklenti , Twitter , twitter eklenti Hiç yorum yok :

Bu eklentimiz resimde gördüğünüz gibi, rss , twitter ve facebook takip sayısı göstergesi şeklindedir..

Tabi burda yazan rakamlar , tamamen hayal ürünü olup , size kalmıştır...

Adı üstünde Yalancı Takipci Sayısı Eklentisi !

<style> 
.rss-mbt { 
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEin5Qj5sQn75IaROANykGFilGtiXYowW3ZVbNR70yaMR6EOWXtcDgUyPk0Lm6_LTOOQ6BSlqOVAWcqBb0mLiDCVfTsIVYw1EBuRtoQ4mZ4WC4GgdiH2DzzqKPNlRC2SxC3LzILJ89efekA/s800/RSS1.png) no-repeat; 
    height: 64px; 
    padding: 0px 20px 0px 80px; 
    margin-top: 20px; 
}
.twitter-mbt { 
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcPHgktxTn9DXzYLy5sszkB4bA81iiRkN8AFYgOBRMvf1jj6zLuMNfN3QfM_Lp7GK490RcD7pkIpNp0zIs_FOQyoh6lT4CNo9n7qLugGqU9fmg5vg8kr15exLloZdgnT0cGrlyY8Uj5Qw/s800/TWITTER1.png) no-repeat; 
    height: 64px; 
    padding: 0px 20px 0px 80px; 
    margin-top: 20px; 
}
.facebook-mbt { 
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2twLsf_TU0VK1C9S1euW7ZUKF-QsbzRTIQcpAOsKr7EVBRypiCq09saC8lk3LOebaHN1gO50wZ3DxQ0yBvoILFpUsCwHMoEWhtdlqOmxGd0ar4NxeQuI99JqaWzYsWVS79-G26pTOxRs/s800/FACEBOOK1.png) no-repeat; 
    height: 64px; 
    padding: 0px 20px 0px 80px; 
    margin-top: 20px; 
}
.follower-rss, .follower-twitter, .follower-facebook { 
    font-family: Georgia,  sans-serif, Times; 
    font-size: 1.1em; 
        font-style:italic; 
        color:#289728; 
}
.follower-rss span { 
    font-size: 1.9em; 
    font-weight: bold; 
        font-style:italic; 
        color:#FFB93C;     
}
.follower-twitter span { 
    font-size: 1.9em; 
    font-weight: bold; 
        font-style:italic; 
        color:#6DB6E6;     
}
.follower-facebook span { 
    font-size: 1.9em; 
    font-weight: bold; 
        font-style:italic; 
        color:#3889BA;     
}
</style>
<div class="rss-mbt"> 
<div class="follower-rss"> <span>78</span> Okuyucu 
</div> 
<a href="Rss adresiniz" rel="nofollow">RSS feed</a> 
| <a href="E-mail adresiniz" target="_blank" rel="nofollow">E-mail</a> 
</div>
<div class="twitter-mbt"><div class="follower-twitter"><span>138</span> Takipçi</div>                            
<a href="Twitter Adresiniz" target="_blank" rel="nofollow" title="I definitely follow you back">Bizi Twitter'da Takip et</a> 
</div>                       
<div class="facebook-mbt">                        
<div class="follower-facebook"><span>403</span> Takipçi                           </div>                            
<a href="Facebook Adresiniz" target="_blank" rel="nofollow">Bizi Facebook'da takip et</a> 
</div>

Yukarıdaki kodu blogunuza gadget şeklinde istediğiniz yere , yerleşim'den ekleyiniz..Kod içinde kırmızı olan yerlere, kendi twitter , facebook , rss ve mail adresinizi yazınız..Mavi olan yerler ise , takipçi sayısı kısmı, buralara istediğiniz rakamı yazabilirsiniz..

11 Şubat 2013 Pazartesi

Blogger Sabit Açılır Yan Menü Eklentisi

Unknown 15:30 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , menü Hiç yorum yok :

Blogger Sabit Açılır Yan Menü Eklentisi

Bu eklentimizde , blogunuzun sol ortasında resimde gördüğünüz gibi bir menü yaratıyoruz.

Oldukça şık bir görüntüye sahip olan Sabit Açılır Yan Menü Eklentisini blogger blogunuzda kullanmak isterseniz aşağıdaki adımları izlemeniz yeterli..

Aşağıdaki kodumuzu bulalım..

]]></b:skin>

Hemen üstüne aşağıdaki kodlarımızı ekleyelim..


/* CSS Style for Horizontal Menu - info @ http://eklentileri.blogspot.com*/
#hor {
list-style:none;
padding:0;
margin:0; 
}

#hor li {
float:left;
padding:5px;
}

#hor a {
display:block;
height: 12px;
text-indent:-999em;
}

#hor a.home {
width:46px;
background:url(vHome.gif) no-repeat 0 0; 
}

#hor a.download {
width:94px;
background:url(vDownload.gif) no-repeat 0 0; 
}

#hor a.contact {
width:74px;
background:url(vContact.gif) no-repeat 0 0;
}


/* CSS Style for Vertical Menu */ 

#ver {
list-style:none;
padding:0;
margin:0; 
}

#ver li {
padding:2px; 
}

#ver li a {
display:block;
height:12px;
text-indent:-999em;
} 

#ver a.home {
width:47px;
background:url(hHome.gif) no-repeat 0 0; 
}

#ver a.download {
width:95px;
background:url(hDownload.gif) no-repeat 0 0; 
}

#ver a.contact {
width:74px;
background:url(hContact.gif) no-repeat 0 0;
}


.clear {
clear:both;
} 


*{
/* A universal CSS reset */
margin:0;
padding:0;
}


#navigationMenu body{
font-size:14px;
color:#666;
background:#111 no-repeat;


/* CSS3 Radial Gradients */
background-image:-moz-radial-gradient(center -100px 45deg, circle farthest-corner, #444 150px, #111 300px);
background-image:-webkit-gradient(radial, 50% 0, 150, 50% 0, 300, from(#444), to(#111));

font-family:Arial, Helvetica, sans-serif;
}

#navigationMenu li{
list-style:none;
height:39px;
padding:2px;
width:40px;
}

#navigationMenu span{
/* Container properties */
width:0;
left:38px;
padding:0;
position:absolute;
overflow:hidden;

/* Text properties */
font-family:'Myriad Pro',Arial, Helvetica, sans-serif;
font-size:18px;
font-weight:bold;
letter-spacing:0.6px;
white-space:nowrap;
line-height:39px;

/* CSS3 Transition: */
-webkit-transition: 0.25s;

/* Future proofing (these do not work yet): */
-moz-transition: 0.25s;
transition: 0.25s;
}

#navigationMenu a{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW7fLuZ_0hpKI0smmsy_yi84yuA_RzISI1xD7tw8u-N5cy6aVmN00xqc_TidLz0ywvQ4JXYuOFtM-cacpGYJbjQXiMWpPWgMzhBx1dKEPkBONTt_B52oVTwhx9CiaenIDV2BrKKIAyMAE/s1600/navigation.jpg') no-repeat;

height:39px;
width:38px;
display:block;
position:relative;
}

/* General hover styles */

#navigationMenu a:hover span{ width:auto; padding:0 20px;overflow:visible; }
#navigationMenu a:hover{
text-decoration:none;

/* CSS outer glow with the box-shadow property */
-moz-box-shadow:0 0 5px #9ddff5;
-webkit-box-shadow:0 0 5px #9ddff5;
box-shadow:0 0 5px #9ddff5;
}

/* Green Button */

#navigationMenu .home { background-position:0 0;}
#navigationMenu .home:hover { background-position:0 -39px;}
#navigationMenu .home span{
background-color:#7da315;
color:#3d4f0c;
text-shadow:1px 1px 0 #99bf31;
}

/* Blue Button */

#navigationMenu .about { background-position:-38px 0;}
#navigationMenu .about:hover { background-position:-38px -39px;}
#navigationMenu .about span{
background-color:#1e8bb4;
color:#223a44;
text-shadow:1px 1px 0 #44a8d0;
}

/* Orange Button */

#navigationMenu .services { background-position:-76px 0;}
#navigationMenu .services:hover { background-position:-76px -39px;}
#navigationMenu .services span{
background-color:#c86c1f;
color:#5a3517;
text-shadow:1px 1px 0 #d28344;
}

/* Yellow Button */

#navigationMenu .portfolio { background-position:-114px 0;}
#navigationMenu .portfolio:hover{ background-position:-114px -39px;}
#navigationMenu .portfolio span{
background-color:#d0a525;
color:#604e18;
text-shadow:1px 1px 0 #d8b54b;
}

/* Purple Button */

#navigationMenu .contact { background-position:-152px 0;}
#navigationMenu .contact:hover { background-position:-152px -39px;}
#navigationMenu .contact span{
background-color:#af1e83;
color:#460f35;
text-shadow:1px 1px 0 #d244a6;
}

/*End menu css - info @ http://eklentileri.blogspot.com */

Yukarıdaki işlemi yaptıysanız kaydedin ve yerleşim >> gadget ekle >> HTML/JavaScript seçeneği ile açılan yere aşağıdaki kodlarımızı yapıştıralım..

<div style='position: fixed; top: 40%; left: 0%;'/>
<ul id="navigationMenu">
<li>
<a class="Ana Sayfa" href="http://eklentileri.blogspot.com">
<span>ANA SAYFA</span>
</a>
</li>

<li>

<a class="about" href="LİNK">
<span>About</span>
</a>
</li>

<li>
<a class="services" href="LİNK">
<span>Services</span>
</a>

</li>

<li>
<a class="portfolio" href="LİNK">
<span>Portfolio</span>
</a>
</li>

<li>
<a class="contact" href="LİNK">

<span>Contact us</span>
</a>
</li>
</ul>
</div>

Burada dikkat etmemiz gereken yerler , kırmızı ile yazılmış olan yerleri kendinize göre düzenlemeniz, eklentinin ön izlemesi için TIKLAYIN

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

Blogger Sabit Açılır Yan Menü Eklentisi , Blogger Sabit Menü , Blogger Menü Eklentisi , Blogger Menü Ekleme , Blogger Nasıl Menü Eklenir , Blogger Renkli Menü Yapımı

8 Şubat 2013 Cuma

En Çok Yorum Yapılan Yazılar / Konular Eklentisi

Unknown 15:19 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , konular , yayınlar , yazı , yorum Hiç yorum yok :

En Çok Yorum Yapılan Yazılar / Konular Eklentisi Widget

Blogger blogunuzda , en çok yorum yapılan yazılarınızı göstermek istermisiniz ?

DEMO

Lafı uzatmadan hemen anlatıma geçelim..

Blogunuzun Yerleşim kısmına girerek Gadget Ekle >> HTML/JavaScript seçeneği ile açılan panele aşağıdaki kodları ekleyin..

<!-- Popular posts with comment eklentileri.blogspot.com -->
<script type="text/javascript">
function getYpipePP(feed) {
 document.write('<ol style="">');
 var i;
 for (i = 0; i < feed.count ; i++)
 {
var href = "'" + feed.value.items[i].link + "'";
var pTitle = feed.value.items[i].title;
var pComment = " \(" + feed.value.items[i].commentcount + "\)";
var pList = "<li>" + "<a href="+ href + '" target="_blank">' + pTitle;
 document.write(pList);
 document.write(pComment); //to remove comment count delete this line
 document.write('</a></li>');
 }
 document.write('</ol>');
 }
 </script>
 <script src="http://pipes.yahoo.com/pipes/pipe.run?
 YourBlogUrl=http://eklentileri.blogspot.com
 &ShowHowMany=10
 &_id=390e906036f48772b2ed4b5d837af4cd
 &_callback=getYpipePP
 &_render=json" 
type="text/javascript"></script>

<!-- Popular posts with comment eklentileri.blogspot.com -->

Yukarıdaki kodları eklediyseniz , kod içinde geçen ; eklentileri.blogspot.com adresi yerine , kendi blog adresinizi , mavi ile yazılmış olan 10 rakamını değiştirerek göstermek istediğiniz yazı sayısını ayarlayabilirsiniz..

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

En Çok Yorum Yapılan Yazılar , En Çok Yorum Yapılan Yazılar eklentisi , Blogger En Çok Yorum Yapılan Yazılar , En Çok Yorum Yapılan Konular ,En Çok Yorum Yapılan konular eklentisi , Blogger En Çok Yorum Yapılan Konular , Blogger yorum yapılan knouları gösterme , en çok yorum

7 Şubat 2013 Perşembe

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

Unknown 15:08 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , bookmark , Facebook , facebook eklenti , sosyal eklenti , Twitter , twitter eklenti 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

29 Ocak 2013 Salı

Blogger Yandan Açılır Menü Eklentisi

Unknown 13:34 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , Css3 , menü Hiç yorum yok :

Blogger blogunuzda , Yandan açılır menü eklentisi isterseniz , bu eklenti çok hoşunuza gidecek..

Fare ile üzerine gelindiğinde açılan menümüz , blogunuza hoş bir görsellik katabilir..

DEMO

Altta yer alan kodumuzu buluyoruz

]]></b:skin>

Bir satır üstüne altta yer alan kodları ekliyoruz..

/* Blogger Yandan Açılır Menü Eklentisi eklentileri.blogspot.com */

ul.nav8 {
    list-style:none;
    height:120px;
    margin:0;
    padding:0;
}

ul.nav8 table {
    border-collapse:collapse;
    width:0;
    height:0;
    margin:-1px 0 -5px -1px;
}

ul.nav8 > li {
    float:right;
    height:120px;
    width:40px;
    position:relative;
    overflow:hidden;
    -webkit-transition-duration:.5s;
    -moz-transition-duration:.5s;
    -o-transition-duration:.5s;
}

* html ul.nav8 > li {
    width:auto;
}

ul.nav8 > li a.ie6 {
    float:left;
    height:120px;
    width:39px;
    position:relative;
    overflow:hidden;
}

ul.sub {
    list-style:none;
    height:120px;
    width:600px;
    background:url(http://www.script-tutorials.com/demos/107/images/panel.png) no-repeat right top;
    position:absolute;
    left:0;
    top:0;
    margin:0;
    padding:0;
}

ul.sub li {
    float:left;
}

ul.sub li:first-child {
    margin-left:45px;
}

ul.sub li a {
    display:block;
    width:110px;
    height:120px;
    float:left;
    overflow:hidden;
    position:relative;
    text-decoration:none;
    color:#000;
}

ul.sub li a b {
    font-size:14px;
    display:block;
    padding:15px 15px 5px;
}
ul.sub li a b:hover {
    font-size:16px;
    color:#FF0000;
    display:block;
    padding:15px 15px 5px;
}
ul.sub li a p {
    font-size:12px;
    display:block;
    margin:0;
    padding:0 10px;
}

ul.sub li a p:hover {
    font-size:13px;
    display:block;
    margin:0;
    padding:0 10px;
}

ul.nav8 > li:hover {
    width:600px;
}

ul.nav8 > li a.ie6:hover {
    direction:ltr;
    width:600px;
}

ul.sub li a:hover i {
    opacity:1.0;
}

Şablonumuzu kaydediyoruz ve Yerleşim >> Gadget Ekle >> HTML/JavaScript yolu ile açılan panele altta yer alan kodlarımızı ekliyoruz

<ul class="nav8">
<li>
        <!--[if lte IE 6]><a class="ie6" href="#url"><table>
<tr><td><![endif]-->
            <ul class="sub">
<li><a href="http://eklentileri.blogspot.com/"><b>Ana Sayfa</b>Bu alana bilgi yazısı<br />
<i></i></a></li>
<li><a href="http://eklentileri.blogspot.com/"><b>Link 1</b>Bu alana bilgi yazısı<br />
<i></i></a></li>
<li><a href="http://eklentileri.blogspot.com/"><b>Link 2</b>Bu alana bilgi yazısı<br />
<i></i></a></li>
<li><a href="http://eklentileri.blogspot.com/"><b>Link 3</b>Bu alana bilgi yazısı<br />
<i></i></a></li>
<li><a href="http://eklentileri.blogspot.com/"><b>Link 4</b>Bu alana bilgi yazısı<br />
<i></i></a></li>
</ul>
<!--[if lte IE 6]></td></tr>
</table>
</a><![endif]-->
        </li>
</ul>

Yukarıdaki işlemleri yaptıysanız Blogger Yandan Açılır Menü Eklentisi hazır , yukarıdaki kodları kendinize göre düzenleyiniz..

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

Blogger Yandan Açılır Menü Eklentisi , Blogger Menü Eklentisi , Blogger Açılır Menü , Menü Eklentileri , Blogger Yana Açılan Menü , Menü , Slideout Menu Bar For Blogger , Blogger Menu Widget

21 Ocak 2013 Pazartesi

Retro Tazı Blogger Sosyal Paylaşım Eklentisi

Unknown 06:20 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , Facebook , facebook eklenti , sosyal eklenti , Twitter , twitter eklenti Hiç yorum yok :

Retro Tazı Blogger Sosyal Paylaşım Widget

DEMO

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..

15 Ocak 2013 Salı

Alternatif Facebook Beğeni Kutusu

Unknown 16:20 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , Facebook , facebook eklenti , kutu Hiç yorum yok :

DEMO

Blogger paneline girin ve Yerleşim >> Gadget Ekle >> HTML/JavaScript yolu ile aşağıdaki kodlarımızı açılan panele ekleyelim..

 <style>.blogtrixfb {
width: 280px;
height: 150px;
border-radius: 3px;
position: relative;
background-color:#f4f4f4;
padding:5px 10px 15px 0;
}
.blogtrixfb, .blogtrixfb:before, .blogtrixfb:after {
background: #f4f4f4;
border: 1px solid #ccc;
}
.blogtrixfb:before, .blogtrixfb:after {
content: "";
position: absolute;
bottom: -3px;
left: 2px;
right: 2px;
height: 1px;
border-top: none;
}
.blogtrixfb:after {
left: 4px;
right: 4px;
bottom: -5px;
box-shadow: 0 0 2px #ccc;
}
</style>
<div class="blogtrixfb">
<div style="height:155px;overflow:hidden">
<fb:like-box href="http://www.facebook.com/pages/Blogger-Eklentileri/126895440798640" data-width="300" data-height="250" data-show-faces="true" data-border-color="#f4f4f4" data-stream="false" data-header="false" class=" fb_iframe_widget "><span><iframe id="f5741c08" name="fdd6ca2ec" scrolling="no" style="border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; border-image: initial; overflow-x: hidden; overflow-y: hidden; height: 250px; width: 300px; " class="fb_ltr" src="http://www.facebook.com/plugins/likebox.php?border_color=%23f4f4f4&amp;channel=https%3A%2F%2Fs-static.ak.fbcdn.net%2Fconnect%2Fxd_proxy.php%23cb%3Df2babfba84%26origin%3Dhttp%253A%252F%252Feklentileri.blogspot.com%252Ff1ae6f85bc%26relation%3Dparent.parent%26transport%3Dpostmessage&amp;colorscheme=light&amp;header=false&amp;height=300&amp;href=http://www.facebook.com/pages/Blogger-Eklentileri/126895440798640&amp;locale=tr_TR&amp;sdk=joey&amp;show_faces=true&amp;stream=false&amp;width=300"></iframe></span></fb:like-box>
</div>
</div>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/tr_TR/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

Yukarıdaki kod içinde kırmızı olan yerlere , kendi facebook sayfasınızın adresini yazmayı unutmayınız..

12 Ocak 2013 Cumartesi

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

Unknown 15:26 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , Facebook , facebook eklenti , sosyal eklenti , Twitter , twitter eklenti 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..

DEMO

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>

8 Ocak 2013 Salı

Klavye Tarzı Yazı Yazma Eklentisi

Unknown 13:34 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , yazı Hiç yorum yok :

Blogger blogunuzda , yazılarınızı klavye tarzı şeklinde yazmak istermisiniz ?

Klavye Tarzı Yazı Yazma Eklentisi ile , vurgulamak istediğiniz cümleleri kelimeleri yada harfleri ön plana çıkarabilirsiniz..

DEMO

Alttaki kodu buluyoruz

]]></b:skin>

Hemen üstüne aşağıdaki kodları ekliyoruz

/*****************************************
Klavye Tarzı Yazı Yazma Eklentisi kod baslangıcı eklentileri.blogspot.com
******************************************/
klavye{
border:1px solid gray;
font-size:1.2em;
box-shadow:1px 0 1px 0 #eee, 0 2px 0 2px #ccc, 0 2px 0 3px #444;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
margin:2px 3px;
padding:1px 5px;
}

Şablonumuzu kaydediyoruz.......Blogumuzda klavye tarzı yazı yazmak istediğimizde aşağıdaki kodu kullanıyoruz.

<klavye>Yazı Alanı</klavye>

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

Klavye Tarzı Yazı Yazma Eklentisi , Klavye Tarzı Yazı Yazma , Klavye Tarzı Yazı , Klavye yazı Blogger , Blogger Yazı Eklentisi , keyboard like text effect , Blogger keyboard like text effect widget

6 Ocak 2013 Pazar

CSS3 multi blogger menü çubuğu eklentisi

Unknown 15:42 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , Css3 , menü Hiç yorum yok :

CSS3 Multi Blogger Menü Çubuğu Widget

Blogger blogunuzda şık ve kullanışlı bir üst menü çubuğu arıyorsanız bu eklenti size yarayabilir..

DEMO

alttaki kodu bulunuz

]]></b:skin>

Bir satır üstüne altta yer alan kodları ekleyiniz..

/* CSS3 multi blogger menü çubuğu eklentisi eklentileri.blogspot.com*/

ul#navbt {
    display:block;
    float:left;
    font-family:Trebuchet MS,sans-serif;
    font-size:0;
    padding:5px 5px 5px 0;

    background: -moz-linear-gradient(#f5f5f5, #c4c4c4); /* FF 3.6+ */  
    background: -ms-linear-gradient(#f5f5f5, #c4c4c4); /* IE10 */  
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f5f5f5), color-stop(100%, #c4c4c4)); /* Safari 4+, Chrome 2+ */  
    background: -webkit-linear-gradient(#f5f5f5, #c4c4c4); /* Safari 5.1+, Chrome 10+ */  
    background: -o-linear-gradient(#f5f5f5, #c4c4c4); /* Opera 11.10 */  
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5f5f5', endColorstr='#c4c4c4'); /* IE6 & IE7 */  
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5f5f5', endColorstr='#c4c4c4')"; /* IE8+ */  
    background: linear-gradient(#f5f5f5, #c4c4c4); /* the standard */ 
}
ul#navbt,ul#navbt ul {
    list-style:none;
    margin:0;
}
ul#navbt,ul#navbt .subs {
    background-color:#444;
    border:1px solid #454545;

    border-radius:9px;
    -moz-border-radius:9px;
    -webkit-border-radius:9px;
}
ul#navbt .subs {
    background-color:#fff;
    border:2px solid #222;
    display:none;
    float:left;
    left:0;
    padding:0 6px 6px;
    position:absolute;
    top:100%;
    width:300px;

    border-radius:7px;
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
}
ul#navbt li:hover>* {
    display:block;
}
ul#navbt li:hover {
    position:relative;
}
ul#navbt ul .subs {
    left:100%;
    position:absolute;
    top:0;
}
ul#navbt ul {
    padding:0 5px 5px;
}
ul#navbt .col {
    float:left;
    width:50%;
}
ul#navbt li {
    display:block;
    float:left;
    font-size:0;
    white-space:nowrap;
}
ul#navbt>li,ul#navbt li {
    margin:0 0 0 5px;
}
ul#navbt ul>li {
    margin:5px 0 0;
}
ul#navbt a:active,ul#navbt a:focus {
    outline-style:none;
}
ul#navbt a {
    border-style:none;
    border-width:0;
    color:#181818;
    cursor:pointer;
    display:block;
    font-size:13px;
    font-weight:bold;
    padding:8px 18px;
    text-align:left;
    text-decoration:none;
    text-shadow:#fff 0 1px 1px;
    vertical-align:middle;
}
ul#navbt ul li {
    float:none;
    margin:6px 0 0;
}
ul#navbt ul a {
    background-color:#fff;
    border-color:#efefef;
    border-style:solid;
    border-width:0 0 1px;
    color:#000;
    font-size:11px;
    padding:4px;
    text-align:left;
    text-decoration:none;
    text-shadow:#fff 0 0 0;

    border-radius:0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
}
ul#navbt li:hover>a {
    border-style:none;
    color:#fff;
    font-size:13px;
    font-weight:bold;
    text-decoration:none;
    text-shadow:#181818 0 1px 1px;
}
ul#navbt img {
    border:none;
    margin-right:8px;
    vertical-align:middle;
}
ul#navbt span {
    background-position:right center;
    background-repeat:no-repeat;
    display:block;
    overflow:visible;
    padding-right:0;
}
ul#navbt ul span {
    background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5nt491Fwg837GymN8cAGBPX-4Fvle8AmaAuFKwfcgU7ELGDgULog4Jv9omt3CJMJvlGi5z08kSaCV9nSj0AiKBn4eKZySSeL6UiyQJGMhXA37cXqRU0TnW7nnxe0u1JH-u8MoL_UaRZQ/s1600/bloggetrix-arrow.png");
    padding-right:20px;
}
ul#navbt ul li:hover>a {
    border-color:#444;
    border-style:solid;
    color:#444;
    font-size:11px;
    text-decoration:none;
    text-shadow:#fff 0 0 0;
}
ul#navbt > li >a {
    background-color:transpa;
    height:25px;
    line-height:25px;

    border-radius:11px;
    -moz-border-radius:11px;
    -webkit-border-radius:11px;
}
ul#navbt > li:hover > a {
    background-color:#313638;
    line-height:25px;
}

Şablonunuzu kaydedin ve Yerleşim >> Gadget Ekle >> HTML/JavaScript ile alttaki kodları ekleyiniz..

<ul id="navbt">
<li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDtWH-tBDMVQMtzEODwPNByrW-RqRgWZrMS6TFcvdtURDyxNqVEfjSlwVh8Pnbhgb49_7DAydjpMV8bKrhqN7i-nmPGQKkT16afBAabtZXihF6rjx-K97qdK3dcGneiA8n89hTK7P7LIM/s1600/bloggetrix-home.png" /> Home</a></li>
                <li><a href="#"><span><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsh2OtXtID_f8qas_KS2imBfrEhEvPTv8pKbnpXiW7UsMaztOnuoYw-bDYfR9YmBcXp3epR7XrfkBBceEHBx6GdyWithPFxKtpxXvpZWXWTZd1aalLH0Dw8jl5PX4y6Q4oxLF5vNbD3bw/s1600/bloggetrix-top1.png" /> HTML/CSS</span></a>
                    <div class="subs">
                        <div class="col">
                            <ul>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 1</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 2</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 3</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 4</a></li>
                                <li><a href="#"><span><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Sublinks</span></a>
                                    <div class="subs">
                                        <div class="col">
                                            <ul>
                                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 41</a></li>
                                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 42</a></li>
                                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 43</a></li>
                                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 44</a></li>
                                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 45</a></li>
                                            </ul>
                                        </div>
                                        <div class="col">
                                            <ul>
                                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 46</a></li>
                                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 47</a></li>
                                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 48</a></li>
                                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 49</a></li>
                                            </ul>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <div class="col">
                            <ul>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 6</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 7</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 8</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 9</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 10</a></li>
                            </ul>
                        </div>
                    </div>
                </li>
                <li><a href="#"><span><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRNIRYXsY5HbnwH7nf9L3m_o6aqAECqRy36vIDYQckAQwrj-EcWXLv5pbE7zpZROsu8nTuggmdghx5xd4JDv-q2Arn2Ppr3BbnnCyhZTW9e0PyiLgZr5SFjBG3mCMJuAHfvD7LwOQ8g2o/s1600/bloggetrix-top2.png" /> jQuery/JS</span></a>
                    <div class="subs">
                        <div class="col">
                            <ul>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 1</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 2</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 3</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 4</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 5</a></li>
                            </ul>
                        </div>
                        <div class="col">
                            <ul>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 6</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 7</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 8</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 9</a></li>
                                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3QSN0ldy2md2bLhnQf6iMS8Z95L_zSiGspmDu3nia1r7SW2eDm3bzrMKWIr8fCcR9ZMN6N3ps1h-9lsZbKPEheD3sFhtqhHSRhwSbl2nm5phQDEZ3ucZbdkOFkv-tD4aQOKZsVC9hgg/s1600/bloggetrix-bub.png" /> Link 10</a></li>
                            </ul>
                        </div>
                    </div>
                </li>
                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhs2B7MLqjWwZ2coUe4tBX8X4TCa-XLlgQvedCEc2mm1lVhnf-FQCETcfigAhU29SDY-QSr3mlynVKQQRCUEoswaxNoOqKbRbj266al1_fEYguTOUUpEtfIIvFTSN5q35yYinGiE-MSye8/s1600/bloggetrix-top3.png" /> PHP</a></li>
                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOtXmHwTlFKH6zwFGpF4WPiY_LCLfBCzojlSuPrhc5AG28MiW9oe0BSosVXfrZyAfyZy2zwMx8DOEnxOtLuwVR7ZeLBiaeHczFkRSqhIWjCcBGJgJGjGacoDCAx3l6svAqt22Nxenk_Aw/s1600/bloggetrix-top4.png" /> MySQL</a></li>
                <li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqEPD8ESLFThLsTOjw92rNvGUP_PvR1Ky49ww7y6wVKNQU6wRqdl4FXXf0mr0aOYvecTawZoQC88ewtuQjbdO7wlxeEW8ZyRmX-gsBvBhY573BRqC8mwU8oRFeJWjzEkXlL_DRvcjcj-A/s1600/bloggetrix-top5.png" /> XSLT</a></li>
            </ul>

Üstte yer alan kodları kendinize göre düzenleyip özelleştiriniz..Ayrıca yerleşim kısmından bu eklentiyi , Blog kayıtları üstüne , yada daha yukarda alanınız varsa oraya taşıyınki , menümüz üstte yer alsın..

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

CSS3 multi blogger menü çubuğu eklentisi , CSS3 Blogger Menu , Menu Eklentisi , Blogger Menü Çubuğu , Blogger Menü Bar ,menü , Multilevel Blogger Menü

5 Ocak 2013 Cumartesi

Döner Sosyal Butonlar Eklentisi

Unknown 13:19 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , Facebook , facebook eklenti , sosyal eklenti , Twitter , twitter eklenti 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..

DEMO

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>

22 Aralık 2012 Cumartesi

Blogunuzun Köşesine Mutlu Yıllar ( Yılbaşı Eklentisi )

Unknown 13:53 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , resim Hiç yorum yok :

Blogger blogunuzun köşesinde , mutlu yıllar resimi içeren bir eklenti istermisiniz ?

Demosunu şuan bulunduğunuz sayfada görebilirsiniz..

Aşağıda yer alan kodları ,Yerleşim >> Gadget Ekle >> HTML/JavaScript yolunu izleyerek blogunuza ekleyiniz

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmWsT6wFExU77GNqt8mYptmmw7iGjxXQV0Ii_-WKOyK4RMjPkImwfO_lhSeG1XndvihyphenhyphenAkhrZWk-d39d7T1YSpu_KE1NnbWyYehCOUajokikxX4xxfVJMqWibqIlcSaEC0gqfWopIiyxKf/s1600/yeniy%C4%B1l.png" style="position:fixed; top: 0px;left:0px;border:none;z-index:5; background-color: transparent;"/>

Yukarıdaki kodu eklediyseniz , yılbaşı resminiz blogunuzun sol üst kısmında çıkacaktır..

Sol alt için , top değerini bottom olarak değiştiriniz

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

Blogunuzun Köşesine Mutlu Yıllar , Blogunuza Mutlu Yıllar Resmi , Yılbaşı eklentisi , Blogger Yeni Yıl Eklentisi , Blogunuzun soluna resim

19 Aralık 2012 Çarşamba

Blogunuza Kar Yağsın ( Yılbaşı Eklentisi )

Unknown 17:10 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget Hiç yorum yok :

Yıl Başı için Blogger Blogunuzda kar yağdırmak istersimisiniz ?

DEMO

Yerleşim >> Gadget Ekle >> HTML/JavaScript yolu ile alttaki kodları ekliyoruz , başka bir şey yapmıyoruz..

<script type="text/javascript">

      
      //Configure below to change URL path to the snow image
      var snowsrc="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0FqASTLQEls9PSCTs5ggkeaeM5hjNB8rPcB6LibnpeHGj84uANV4SdbLL4SWTeSHw7OqYL3_SR4zv4yCkN3NBbSVG627YdSdKCYtZbt-QFKeALfsWwx3g6lWlhyphenhypheni0fv6vReIzCHtYKbI/s400/snow.gif"
      // Configure below to change number of snow to render
      var no = 15;
      // Configure whether snow should disappear after x seconds (0=never):
      var hidesnowtime = 0;
      // Configure how much snow should drop down before fading ("windowheight" or "pageheight")
      var snowdistance = "pageheight";

    ///////////Stop Config//////////////////////////////////

      var ie4up = (document.all) ? 1 : 0;
      var ns6up = (document.getElementById&&!document.all) ? 1 : 0;

        function iecompattest(){
        return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
        }

      var dx, xp, yp;    // coordinate and position variables
      var am, stx, sty;  // amplitude and step variables
      var i, doc_width = 800, doc_height = 600;
     
      if (ns6up) {
        doc_width = self.innerWidth;
        doc_height = self.innerHeight;
      } else if (ie4up) {
        doc_width = iecompattest().clientWidth;
        doc_height = iecompattest().clientHeight;
      }

      dx = new Array();
      xp = new Array();
      yp = new Array();
      am = new Array();
      stx = new Array();
      sty = new Array();
      snowsrc=(snowsrc.indexOf("dynamicdrive.com")!=-1)? "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0FqASTLQEls9PSCTs5ggkeaeM5hjNB8rPcB6LibnpeHGj84uANV4SdbLL4SWTeSHw7OqYL3_SR4zv4yCkN3NBbSVG627YdSdKCYtZbt-QFKeALfsWwx3g6lWlhyphenhypheni0fv6vReIzCHtYKbI/s400/snow.gif" : snowsrc
      for (i = 0; i < no; ++ i) { 
        dx[i] = 0;                        // set coordinate variables
        xp[i] = Math.random()*(doc_width-50);  // set position variables
        yp[i] = Math.random()*doc_height;
        am[i] = Math.random()*20;         // set amplitude variables
        stx[i] = 0.02 + Math.random()/10; // set step variables
        sty[i] = 0.7 + Math.random();     // set step variables
            if (ie4up||ns6up) {
          if (i == 0) {
            document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://dynamicdrive.com\"><img src='"+snowsrc+"' border=\"0\"><\/a><\/div>");
          } else {
            document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src='"+snowsrc+"' border=\"0\"><\/div>");
          }
        }
      }

      function snowIE_NS6() {  // IE and NS6 main animation function
        doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;
            doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")?  iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight;
        for (i = 0; i < no; ++ i) {  // iterate for every dot
          yp[i] += sty[i];
          if (yp[i] > doc_height-50) {
            xp[i] = Math.random()*(doc_width-am[i]-30);
            yp[i] = 0;
            stx[i] = 0.02 + Math.random()/10;
            sty[i] = 0.7 + Math.random();
          }
          dx[i] += stx[i];
          document.getElementById("dot"+i).style.top=yp[i]+"px";
          document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px"; 
        }
        snowtimer=setTimeout("snowIE_NS6()", 10);
      }

        function hidesnow(){
            if (window.snowtimer) clearTimeout(snowtimer)
            for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden"
        }
           

    if (ie4up||ns6up){
        snowIE_NS6();
            if (hidesnowtime>0)
            setTimeout("hidesnow()", hidesnowtime*1000)
            }

    </script>

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

Blogunuza Kar Yağsın , Blogger Blog Kar Eklentisi , Kar , Kar Yağdırma , Blogger Kar Eklentisi , Blogger Yılbaşı Eklentisi , Blogger Kar Yeni Yıl , Blogger Noel Eklentisi , How To Add Christmas Snow , Blogger Add Snow , Blogger Christmas Widgets

Basit Yeni Yıl Sayaç ( Yılbaşı Eklentisi )

Unknown 16:27 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , saat Hiç yorum yok :

Blogger blogunuz da kullanmak için , yeni yıl sayacı istermisiniz ?

Bu eklentimiz basit bir sayaçtan oluşmaktadır , Yeni yıla kadar geri sayım yapar , süre dolduğunda , "Yeni Yılınız Kutlu Olsun" şeklinde bir mesaj gösterir..

DEMO

Yerleşim >> Gadget Ekle >> HTML/JavaScript yolu ile alttaki kodları ekliyoruz , başka bir şey yapmıyoruz..

<div id="bp_count_down_div"></div>
<script language="JavaScript">
var bp_date_target = new Date("December 31, 2012 00:00:00");
var bp_date_now = new Date();
var bp_count_down_complete_message = "Yeni Yılınız Kutlu Olsun";
if (bp_date_now >= bp_date_target) {
 document.getElementById("bp_count_down_div").innerHTML = bp_count_down_complete_message;
} else {
 bp_time_difference = Math.floor(((bp_date_target - bp_date_now).valueOf()) / 1000);
 display_time_difference(bp_time_difference);
}
function display_time_difference(bp_time_difference) {
 if (bp_time_difference <= 0) {
 document.getElementById("bp_count_down_div").innerHTML = bp_count_down_complete_message;
 return;
 }
    bp_count_down_message = bp_format_seconds  (bp_time_difference, 86400, 100000)  + " Gün " + bp_format_seconds(bp_time_difference, 3600, 24) + " Saat " + bp_format_seconds(bp_time_difference, 60, 60) + " Dakika " + bp_format_seconds(bp_time_difference, 1, 60) + " Saniye Kaldı";
 document.getElementById("bp_count_down_div").innerHTML = bp_count_down_message;
 setTimeout("display_time_difference(" + (bp_time_difference - 1) + ")", 1000);
}
function bp_format_seconds(secs, num1, num2) {
 num = ((Math.floor(secs / num1)) % num2).toString();
 if (num.length < 2) s = "0" + num;
  return "<b>" + num + "</b>";
}
</script>

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

Basit Yeni Yıl Sayaç Eklentisi , Blogger Basit Yeni Yıl Sayaç Eklentisi , Blogger Yeni Yıl ,Blogger Yeniyıl , Blogger Yeni Yıl Sayaç , Blogger Yeni Yıl Eklentisi , Yılbaşı Blogger Noel Eklentisi , Blogger Geri Sayım Eklentisi , Blogger Timer Eklentisi , Add Christmas Countdown , Add Christmas Countdown Widget , Blogger Christmas Widget , Yeni Yıl , Yıl Başı

18 Aralık 2012 Salı

Siyah Zoom Efektli Sosyal Butonlar Eklentisi

Unknown 14:05 Blogger , Blogger Eklenti , Blogger Eklentileri , blogger eklentisi , Blogger Widget , bookmark , Buton , dinamik , efekt , Facebook , facebook eklenti , sosyal eklenti , Twitter , twitter eklenti , zoom 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..

DEMO

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