Blogger İçin Download Buttonu Yeni

Selam Arkadaşlar Sizlere Güzel Bir Download Buttonu Buldum Ve Blogger'a Uyarladım Umarım Memnun Kalırsınız :)

Demo Görünümü

 1)Blogger hesabımızla giriş yapıyoruz.
2)Her ihtimale karşı blogger şablonlonumuzu yedeğini alıyoruz.
3)Kumanda Paneli>Şablon>Htmlyi Düzenle yolunu takip ediyoruz.
4)Widget Şablonlarını Genişlet Kutucuğunu işaretliyoruz.
5)Ctrl+F yardımı ile kodlar içerisinde </head> kodunu aratıp buluyoruz.
6)Aşağıdaki kodu kopyalayıp bulduğumuz </head> kodunun hemen üst tarafına yapıştırıyoruz.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
 <script language="javascript">
  $(document).ready(function() {
   $('.buttonWrap').click(function() {
    if ($('.toggleSection').is(":hidden")) {
     $('.toggleSection').slideDown("slow");
    } else {
     $('.toggleSection').slideUp("slow");
    }
    return false;
   });
  });
     </script>

7)Ctrl+F yardımı ile kodlar içerisinde </b:skin> kodunu aratıp buluyoruz.
yapıştırıyoruz.

  /*
   URL: http://phtmldrive.blogspot.com/
  */
  
  *{border:0; outline:0; margin:0; padding:0;}
  #container{margin:0 auto; width:500px; padding:20px 0 0 0;}
  .buttonWrap{width:170px; height:80px; display:block;}
 
  .toggleButton{
   display:block;
   width:170px;
   height:30px;
   padding:10px 0 0 0;
   text-size:24px;
   font-family:arial, sans-serif;
   font-weight:bold;
   text-align:center;
   color:#FFF;
   text-decoration:none;
   border-radius:7px; -moz-border-radius:7px;
   cursor:pointer;
   border:1px solid #05ABE0;
   text-shadow:-1px -1px 0px #05ABE0;
   background: #87E0FD;
   background: -moz-linear-gradient(top, #87E0FD 0%, #53CBF1 40%, #05ABE0 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#87E0FD), color-stop(40%,#53CBF1), color-stop(100%,#05ABE0));
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#87E0FD', endColorstr='#05ABE0',GradientType=0 );

  }
  .toggleButton:active{  
   background: #87e0fd;
   background: -moz-linear-gradient(top, #05ABE0 0%, #53CBF1 40%, #87E0FD 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#05ABE0), color-stop(40%,#53CBF1), color-stop(100%,#87E0FD));
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#05ABE0', endColorstr='#87E0FD',GradientType=0 );
  }
  
  a.toggleSection{
   display:none;
   color:#333;
   background:#EEE url(http://k1306.hizliresim.com/1b/u/plwmn.png) no-repeat 5px center;
   border-left:1px solid #DDD; border-right:1px solid #DDD; border-bottom:1px solid #DDD;
   border-radius:0  0 5px 5px; -moz-border-radius:0 0 5px 5px;
   width:60px;
   float:right; 
   padding:5px 5px 5px 40px;
   margin:0 10px 0 0;
   font-family:arial, verdana, sans-serif; 
   font-size:12px;
   text-decoration:none;
  }
  a.toggleSection span{font-weight:bold; display:block;}

Kodları Yapıştırdıktan Sonra...

Buraya Dikkat !

  <div class="buttonWrap">
   <div class="toggleButton">Download Now!</div>
    <a href="Link Buraya Gelicek.." class="toggleSection">
     <span>.Rar</span>
     16.95 MB
   </a>
  </div>

Download Now! Bölümüne Dosya İsmini Yada İndir Yazabilirsiniz.

Link Buraya Gelicek.. Bölümüne Dosyanın İndirme Linkini Ekliceksizin.

.Rar Bölümüne Dosyanın Uzantısını Ekliceksiniz. Ör. .Exe .Swf .rar gibi.

16.95 MB Bölümüne Dosyanın Boyutunu Ekliceksiniz.

İşlem Bu Kadardır Umarım Sizlere Yardımcı Olmuşumdur. Daha Fazlası İçin Lütfen Bizi Takip Etmeye Devam Edin.

Konu Tamamiyle PHtmlDrive.Blogspot.Com'a Aittir.