Demo ve İndir Butonları Yapımı

30 Ocak 2014 Perşembe, 17:15
Demo ve İndir Butonları Yapımı

Blogger alt yapısına sahip blogların büyük bir kısımı blogger tema ve eklentiler paylaşmakta.Bu paylaşımlar için blog sahiplerinin en çok aradıkları eklentilerden biride demo ve indir butonları oluyor.Bloggerlara yardımcı olacağını düşündüğümüz  bu butonların yapımını blog kullanıcıları ile  paylaşmak istedik..

Blogger kumanda panelinize giriş yaptıktan sonra Şablon > HTML’yi düzenle yolunu takip edin ve Ctrl + F tuş kombinasyonunun yardımıyla arama kutusunu açarak ]]></b:skin>  kodunu bulun üzerine aşağıdaki kodları yapıştırın.  

 /* -- biribiziokuyor.com --*/  
.button{float:left;list-style:none;text-align:center;width: 100%;margin:5px 0;padding:0;font-size:14px;clear:both;}
.button ul {margin:0;padding:0}
.button li{display:inline;margin:0;padding:0}
.demo {border: none; -moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;padding: 8px 80px !important; background: #E55E48; color: #fff !important;text-align: center; text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -webkit-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -moz-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -ms-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); transition: background-color 1s ease-out 0s; -moz-transition:background-color 1s ease-out 0s; -webkit-transition:background-color 1s ease-out 0s; -o-transition:background-color 1s ease-out 0s;letter-spacing:1px; }
.İndir {border: none; -moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;padding: 8px 80px !important; background: #5FAAE3; color: #fff !important;text-align: center; text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -webkit-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -moz-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -ms-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); transition: background-color 1s ease-out 0s; -moz-transition:background-color 1s ease-out 0s; -webkit-transition:background-color 1s ease-out 0s; -o-transition:background-color 1s ease-out 0s; letter-spacing:1px;}
.demo:hover { background: #454242; text-shadow: 0 0 1px #222; -moz-text-shadow: 0 0 1px #222; -webkit-text-shadow: 0 0 1px #222; -ms-text-shadow: 0 0 1px #222 }
.İndir:hover { background: #454242; text-shadow: 0 0 1px #222; -moz-text-shadow: 0 0 1px #222; -webkit-text-shadow: 0 0 1px #222; -ms-text-shadow: 0 0 1px #222 }

Aşağadaki kodları Demo ve İndir Butonları Yapmak istediğinizde Yazılarınızda Kullanın ( HTML Modu İle )

 <div style="text-align: center;">  
<ul class="button">
<li><a class="demo" href="http://biribiziokuyor.com" target="_blank">Demo</a></li>
<li><a class="İndir" href="http://biribiziokuyor.com" target="_blank">İndir</a></li>
</ul>
</div>
<div class="clear"></div>

Demo butonu Tek kullanmak istediğinizde aşağıdaki kodu kullanmayın

 <li><a class="İndir" href="http://biribiziokuyor.com" target="_blank">İndir</a></li>   

İndir butonu Tek kullanmak istediğinizde aşağıdaki kodu kullanmayın..

  <li><a class="demo" href="http://biribiziokuyor.com" target="_blank">Demo</a></li>   

Bu çalışma DMCA ve Creative Commons Attribution-Gayriticari-NoDerivs 3.0 Unported Lisansı ile lisanslanmıştır.KAYNAK GÖSTERİLMEDEN çoğaltılamaz ve paylaşılamaz

Yorum yazın...

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

porno porno izle porno