içinde , ,

Windows 8 Tarzı Sosyal Paylaşım Blogger Eklentisi

bloggerwindows8metrososyalag28129
bloggerwindows8metrososyalag28129

Evet arkadaşlar hızımızı azaltmadan yeni konumuzla devam ediyoruz. Blogunuzda windows8 tarzı bir sosyal paylaşım barı kutusu eklemek istiyorsanız doğru yerdesiniz

bloggerwindows8metrososyalag28129
ilk olarak aşağıdaki kodu buluyoruz
</b:skin>

kodu bulduktan sonra aşağıdaki kodu hemen üst kısmına yapıştırıyoruz.

#jocial{width: 305px;
float: left;margin-top: 10px;}
#jocial li{position:relative; cursor:pointer; padding: 0 !important;}
#jocial .facebook, .googleplus, .rss, .twitter{
position: relative;
-moz-transition: all 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
z-index: 5;
display: block;
float: left;
margin: 1px;}
#jocial .icon{overflow:hidden;}
#jocial .facebook{width: 150px;
height: 150px;
background: rgba(59,89,152,1) url(“http://1.bp.blogspot.com/-UKryCh_9ofg/UTZhTsKo1JI/AAAAAAAABB8/nZELvc-I_mU/s000/facebook.png”) no-repeat center center;}
#jocial .twitter{width: 150px;
height: 74px;
background: rgba(59,89,152,1) url(“http://3.bp.blogspot.com/-l7ZToPjmMuU/UTZhUBsetSI/AAAAAAAABCE/7mAmFM2I3Vg/s000/twitter.png”) no-repeat center center;}
#jocial .googleplus{width: 150px;
height: 74px;
background: rgba(59,89,152,1) url(“http://2.bp.blogspot.com/-BlNwAezZeJE/UTZhUQqnRiI/AAAAAAAABCM/R_lwCLevtBQ/s000/google%25252Bplus.png”) no-repeat center center;}
#jocial .rss{ width: 302px;
height: 74px;
background: rgba(59,89,152,1) url(“http://4.bp.blogspot.com/-rAtL540hTiU/UTZhUjdTDrI/AAAAAAAABCU/6msqfzMDbG8/s000/rss.png”) no-repeat center center;}
#jocial li:hover .facebook{background-color:#3468B6;-moz-transition: all 0.1s ease-in-out;
-webkit-transition: all 0.1s ease-in-out;}
#jocial li:hover .twitter{background:rgba(64,153,255,1) url(“http://3.bp.blogspot.com/-l7ZToPjmMuU/UTZhUBsetSI/AAAAAAAABCE/7mAmFM2I3Vg/s000/twitter.png”) no-repeat center center;-moz-transition: all 0.1s ease-in-out;
-webkit-transition: all 0.1s ease-in-out;}
#jocial li:hover .googleplus{background:rgba(228,69,36,1) url(“http://2.bp.blogspot.com/-BlNwAezZeJE/UTZhUQqnRiI/AAAAAAAABCM/R_lwCLevtBQ/s000/google%25252Bplus.png”) no-repeat center center;-moz-transition: all 0.1s ease-in-out;
-webkit-transition: all 0.1s ease-in-out;}
#jocial li:hover .rss{background:rgba(255,102,0,1) url(“http://4.bp.blogspot.com/-rAtL540hTiU/UTZhUjdTDrI/AAAAAAAABCU/6msqfzMDbG8/s000/rss.png”) no-repeat center center;-moz-transition: all 0.1s ease-in-out;
-webkit-transition: all 0.1s ease-in-out;}

Şimdi yapmanız gereken tek şey Yerleşim > Gadget ekle > Html/javascript ekle tıklayıp aşağıdaki kodu çıkan html kutusuna yapıştırmak.

<ul id=’jocial’> <li><a class=’icon facebook’ href=’http://www.facebook.com/YOUR_USERNAME/’></a></li> <li><a class=’icon twitter’ href=’http://twitter.com/username/’></a></li> <li><a class=’icon googleplus’ href=’https://plus.google.com/u/0/alamat profil google+/’></a></li> <li><a class=’icon rss’ href=’http://feeds.feedburner.com/YOUR_USERNAME’></a></li> </ul>

Yazar sosyofikir

Doğu Akdeniz Üniversitesi Mimarlık Fakültesi'nden 2018 yılında mezun oldum. Blog serüvenim yaklaşık 8 sene önce başladı. Hala o eski heyecanımı taşımaktayım. Amacım sizler için kaliteli, özgün ve sıkıcı olmayan kullanıcı tabanlı bir site hazırlamaktır. Teşekkür ederim. Bana her türlü konuda ulaşabilirsiniz.

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

kodkutusu

Blogunuza Kod Kutusu Ekleyin !

orgu modelleri

Yaratıcılığın Kullanılabileceği Keyifli Hobiler