Menu

Blogger Hareketli Sosyal Widget Eklenti Kodları

Blogger için tasarlanmış en iyi abonelik widgeti,Blogger için Animasyonlu Sosyal Abonelik Widgetini sunuyoruz.

Eklendiği yere canlılık vermez aynı zamanda herhangi bir açık veya koyu renk web sitesi veya bloklar üzerinde de mükemmel bir şekilde görülen sosyal ağ düğmeleridir.

Blogger Hareketli Sosyal Widget Eklenti Kodları

---internetten Para Kazanma Stratejileri

---Google Kazançları Affiliate Satış Ortaklığı

---Facebooktan Para Kazanma Yöntemleri

Sitenizin footerine veya sidebarına çok rahat birşekilde ekleyebilirsiniz.Eklentilerden fazla gördüklerinizi çıkarabilirsiniz.SEO Mektebi olarak Blogger kullanıcılarına Sosyal Medya eklentileri içinden seçtiğimiz kaliteli eklentileri site ziyaretçilerine sunmaya devam etmektedir.Aşağıda resmi görülen eklentiye aşağıda bulunan Demo butonuna tıklayarak demosunuda inceleyebilirsiniz.


Blogger Hareketli Sosyal Widget Eklenti Kodları
                                                                     
Ayrıca daha önce yayınladığımız aşağıdaki eklentilerde işinize yarayabilir,deneyebilirsiniz.

---Blogger İçin Yüzer Sosyal Medya Widget

---Blogger Sosyal Medya Butonları Ve Abonelik Formu

İlk önce Blogger.com giriş yapınız sonra Yerleşim/Gedget Ekle/ HTML/JavaScript adımlarını takip ediniz.

Blogger Hareketli Sosyal Widget Eklenti Kodları

Blogger Hareketli Sosyal Widget Eklenti Kodları

HTML/JavaScript tıkladıktan sonra aşağıdaki kodu kopyalayarak resimdeki gibi boşluğa yapıştırınız, Blogger Hareketli Sosyal Widget Eklenti Kodlarını  site tasarımınıza uygun olarak istediğiniz yere ekleyebilirsiniz.

/*-----Blogger Sosyal Widget Eklentisi SEO Mektebi----*/
<style>
.social-wrap {
margin:0 auto;
padding:0px;
text-decoration: none;
}
.social-wrap ul li {
list-style-type: none;
border-bottom:none;
margin:0 auto;
background: none;
padding:0px;
line-height: 0!important;
}
 .social-wrap li a {
margin:5px 3px 0px 0px !important;
padding:0px;
width:50px;
height:50px;
text-indent:-99999px;
float:left;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
}
.social-wrap li a.facebook1 {
background: #314d91 url(http://2.bp.blogspot.com/-3Kl6YIoUZ5I/Unc-6CPuOvI/AAAAAAAAD4E/1NQL7KBkueI/s1600/social_sprites.png) no-repeat 0px 0px;
-webkit-transition:All 0.3s ease-out;
-moz-transition:All 0.3s ease-out;
-o-transition:All 0.3s ease-out;
}
.social-wrap li a.facebook1:hover {
background: #314d91 url(http://2.bp.blogspot.com/-3Kl6YIoUZ5I/Unc-6CPuOvI/AAAAAAAAD4E/1NQL7KBkueI/s1600/social_sprites.png) no-repeat 0px -73px;
}
.social-wrap li a.twitter1 {
background: #07beed url(http://2.bp.blogspot.com/-3Kl6YIoUZ5I/Unc-6CPuOvI/AAAAAAAAD4E/1NQL7KBkueI/s1600/social_sprites.png) no-repeat 0px -127px;
-webkit-transition:All 0.3s ease-out;
-moz-transition:All 0.3s ease-out;
-o-transition:All 0.3s ease-out;
}
.social-wrap li a.twitter1:hover {
background: #07beed url(http://2.bp.blogspot.com/-3Kl6YIoUZ5I/Unc-6CPuOvI/AAAAAAAAD4E/1NQL7KBkueI/s1600/social_sprites.png) no-repeat 0px -204px;
}
.social-wrap li a.google-p1 {
background:#a7291b url(http://2.bp.blogspot.com/-3Kl6YIoUZ5I/Unc-6CPuOvI/AAAAAAAAD4E/1NQL7KBkueI/s1600/social_sprites.png) no-repeat 0px -254px;
-webkit-transition:All 0.3s ease-out;
-moz-transition:All 0.3s ease-out;
-o-transition:All 0.3s ease-out;
}
.social-wrap li a.google-p1:hover {
background: #a7291b url(http://2.bp.blogspot.com/-3Kl6YIoUZ5I/Unc-6CPuOvI/AAAAAAAAD4E/1NQL7KBkueI/s1600/social_sprites.png) no-repeat 0px -330px;
}
.social-wrap li a.rss1 {
background:#ffaa31 url(http://2.bp.blogspot.com/-3Kl6YIoUZ5I/Unc-6CPuOvI/AAAAAAAAD4E/1NQL7KBkueI/s1600/social_sprites.png) no-repeat 0px -381px;
-webkit-transition:All 0.3s ease-out;
-moz-transition:All 0.3s ease-out;
-o-transition:All 0.3s ease-out;
}
.social-wrap li a.rss1:hover {
background: #ffaa31 url(http://2.bp.blogspot.com/-3Kl6YIoUZ5I/Unc-6CPuOvI/AAAAAAAAD4E/1NQL7KBkueI/s1600/social_sprites.png) no-repeat 0px -454px;
}
.social-wrap li a.pinit1 {
background:#cb2027 url(http://2.bp.blogspot.com/-3Kl6YIoUZ5I/Unc-6CPuOvI/AAAAAAAAD4E/1NQL7KBkueI/s1600/social_sprites.png) no-repeat 0px -508px;
-webkit-transition:All 0.3s ease-out;
-moz-transition:All 0.3s ease-out;
-o-transition:All 0.3s ease-out;
}
.social-wrap li a.pinit1:hover {
background: #cb2027 url(http://2.bp.blogspot.com/-3Kl6YIoUZ5I/Unc-6CPuOvI/AAAAAAAAD4E/1NQL7KBkueI/s1600/social_sprites.png) no-repeat 0px -580px;
}
.social-wrap li a.linkdin1 {
background:#1698E3 url(http://2.bp.blogspot.com/-3Kl6YIoUZ5I/Unc-6CPuOvI/AAAAAAAAD4E/1NQL7KBkueI/s1600/social_sprites.png) no-repeat 0px -635px;
-webkit-transition:All 0.3s ease-out;
-moz-transition:All 0.3s ease-out;
-o-transition:All 0.3s ease-out;
}
.social-wrap li a.linkdin1:hover {
background: #1698e3 url(http://2.bp.blogspot.com/-3Kl6YIoUZ5I/Unc-6CPuOvI/AAAAAAAAD4E/1NQL7KBkueI/s1600/social_sprites.png) no-repeat 0px -711px;
}
</style>
 <div class='social-wrap'>
<ul>
<li><a class='facebook1' href='http://www.facebook.com/mybloggerstricks' target='_blank' title='Facebook' rel='nofollow'></a></li>
 <li><a class='twitter1' href='http://twitter.com/mybloggertriks' target='_blank' title='Twitter' rel='nofollow'></a></li>
 <li><a class='google-p1' href='https://plus.google.com/b/103598710564060829080' target='_blank' title='Google Plus' rel='nofollow'></a></li>
 <li><a class='rss1' href='http://feeds.feedburner.com/mybloggerstrick' target='_blaank' title='RSS Feed' rel='nofollow'></a></li>
 <li><a class='pinit1' href='http://www.pinterest.com/mybloggertrickx' target='_blank' title='Pinterest' rel='nofollow'></a></li>
 <li><a class='linkdin1' href='http://www.linkedin.com/in/mybloggertricks' target='_blank' title='Linkedin' rel='nofollow'></a></li>
</ul>
</div>


Düzenleme:
Yayınladığımız bu eklentiler içinde ki renk kodları #XXXX şeklinde olan kodlardır bunları aşağıdaki SEO Mektebi renk kodları sayfasından istediğiniz renkleri seçerek ekleyebilirsiniz.

SEO Mektebi CSS Renk Kodlarına Buradan Ulaşabilirsiniz

Ayrıca eklentiler içindeki sayısal değerlerle oynayarak site tasarımına uygun olan ölçüleri sağlayabilirsiniz.

Kodların içerisinde işaretlediğim linklerin yerine kendi profil adreslerinizi yazmanız yeterli olacaktır.Zaten o kısımları SARI ile gösterdim.Ayrıca resmin yerine istediğiniz bir resmi ekleyebilirsiniz.


Sonraki Yazılar
« Prev Post
Önceki Yazılar
Next Post »

Henüz Yorum Yapılmamış " Blogger Hareketli Sosyal Widget Eklenti Kodları "

Önerilen Yazı
×