Ek dosya indirme stili

[yusufkoc]

Herkese merhabalar, bu yazımda sizlere güzel bir ek dosya stilini paylaşacağım. Aşağıdaki adımları uygulayarak başarıyla kurulumu yapabilirsiniz.

1.Adım: Admin Paneli > Temalar & Şablonlar > Şablonlar > Kullandığınız temanın şablonları > Postbit Şablonları > postbit_attachments_attachment dizinine giriyoruz. Aşağıdaki kodu sayfadaki her şeyi silerek ekliyoruz.

Kod: Tümünü Seç Tümünü Kopyala

<br />
<link href="https://fonts.googleapis.com/css?family=Exo" rel="stylesheet">
<div id="devadam">
   <div class="devadam-icon"><a href="attachment.php?aid={$attachment['aid']}" target="_blank" title="{$attachdate}"><img src="https://i.hizliresim.com/DdBMp6.png" style="position:relative;top:25px;left:25px;" /></a></div>
   <div class="devadam-text"><div class="devadam-textt">{$attachment['filename']}</div></div>
   <div class="devadam-downloadsize"><div style="position:relative;top:10px;">{$attachment['filesize']}</div></div>
   <div class="devadam-downloadclick"><div style="position:relative;top:10px;">{$attachment['downloads']} Kere</div></div>
   <div class="devadam-filetype"><div style="position:relative;top:28px;">{$attachment['filetype']}</div></div>
</div>

2.Adım: Admin Paneli > Temalar > Kullandığınız temanın Global.css isimli stil sayfasına giriyoruz. En aşağıya aşağıda yer alan stil kodunu ekliyoruz.

Kod: Tümünü Seç Tümünü Kopyala

#devadam {
   font-family: 'Exo', sans-serif;
   color:#fff;
   background: transparet;
   width:  420px;
   height: 80px;
}

#devadam :hover {
   background: #1F3A93;
}

.devadam-icon {
   background:#1abc9c;
   width: 80px;
   height: 80px;
}
.devadam-text {
   background: #1abc9c;
   font-size:15px;
   width: 338px;
   height: 40px;
   float:  right;
   position: relative;
   text-align: center;
   top: -80px;
}
.devadam-textt {
   width:330px;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
   position:relative;
   top:10px;
   left:3px;
}
.devadam-downloadsize {
   text-align: center;
   font-size: 15px;
   background: #1abc9c;
   width: 167px;
   height: 38px;
   float:  right;
   position: relative;
   top: -78.5px;
}

.devadam-downloadclick {
   text-align: center;
   font-size: 15px;
   background: #1abc9c;
   width: 169px;
   height: 38px;
   float: left;
   position: relative;
   top: -78.5px;
   left: 82px;
}

.devadam-filetype {
   text-align: center;
   background:#1abc9c;
   width: 80px;
   height: 80px;
   float: right;
   position: relative;
   top:-120px;
   left: 249px;
}

 Ekran Görüntüsü:

Kod yapımcısı: DevAdam