Video Of Day

Cara Membuat Ongoing Anime List mirip Animekompi


Masuk ke Template -> Edit HTML
Tambahkan CSS berikut di bawah <style> atau di atas ]]></b:skin> terserah

.lanim {
float: left;
border: 1px solid #DEDEDE;
border-radius: 3px;
height: 200px;
width: 140px;
margin: 0px 4px 8px 3px;
padding: 1px;
}
.lanim img {
height: 200px;
width: 140px;
}
.lanim span {
background: none repeat scroll 0px 0px rgba(11, 117, 138, 0.5);
border-top: 1px solid #CACACA;
color: #FFF;
font-family: tahoma;
margin-top: -30px;
overflow: hidden;
padding: 5px;
position: absolute;
text-overflow: ellipsis;
white-space: nowrap;
width: 130px;
font-size: 12px;
}
.lanim a:hover span {
color: #E6302D;
}

Lanjut...sekarang baru kita buat Anime List nyah. Caranya, tinggal kopikan HTML berikut. Tapi, kamu harus ganti informasi anime nya. Kaya, URL gambar. sama judulnya.

<div class="lanim">
<a href="URL Anime" rel="top" data-title=" Judul Gambar" target="_blank">
<div>
<img src="URL Gambar" class="attachment-thumbnail wp-post-image" alt="3bafba6ac3c358016db5c2ac314db57f" height="200" width="138"> <div><span>Judul Anime </span></div>
</div>
</a>
</div>

Sudah selesai. Tinggal lihat hasilnya! terus kalo mau lebih banyak anime nyah tinggal kopi ulang lagi HTML diatas terus ganti lagi informasinya. Tinggal mengulang langkah nyah. Kalo mau nanya atau ga bisa nanti saya bantu. Komen ajah!

Untuk DEMO nyah bisa di liat di bawah!

See the Pen xbRMXx by hilmanfad (@hilmanfad) on CodePen.
Cara Membuat Ongoing Anime List mirip Animekompi Cara Membuat Ongoing Anime List mirip Animekompi Reviewed by Michael William J on Selasa, Januari 06, 2015 Rating: 5

Tidak ada komentar

Terima Kasih

Blogroll

DMCA.com Protection Status By : Michael William J