Cara Membuat Page Ongoing List

March 29, 2015

Hai Minna-san, Ya Jelas Admin Terkece Selalu Memberikan Tutorial baru B)
Langsung saja yah, Tutorial Kali ini adalah
CARA MEMBUAT PAGE ONGOING LIST
Silahkan Liat DEMOnya Dibawah

DEMO



Ongoing List

69857

Ansatsu Kyoushitsu (TV)

, , , ,
Total Episode:
Cerita aksi dibalut komedi segar yang bercerita tentang kelas yang diberi misi khusu untuk membunuh more details…
70709

Dog Days 3

, , ,
Total Episode:
Musim ketiga dari serial Dog Days. Masih menceritakan Shinku Izumi, seorang atlit berkebangsaan Inggris yang more details…
67743

Durarara!!x2 Shou

, ,
Total Episode:
Musim kedua dari Durarara!!. Masih menceritakan Ryugamine Mikado, dan tokoh utama lain di kota Ikebukuro. more details…
tartarus arc

Fairy Tail (2014)

, , , , ,
Total Episode:
Seorang penyihir muda, Lucy Heartfilia, berkelana ke negara Fiore untuk bergabung dengan Guild Fairy Tail. more details…
67511 (1)

Gundam Build Fighters Try

Total Episode:
Dengan setting cerita 7 tahun setelah GBF pertama, kini kejuaraan Gunpla Battle dijalankan oleh Yajima more details…

Yosh, Langsung saja Ikuti Cara Dibawahnya, xD
Pertama, Silahkan Masukkan Kode CSS Dibawah Diatas </style / </b:skin>

 #animelist {
  width: 723px;
  float: left;
}
.ongoinginfo {
  overflow: hidden;
  float: left;
  width: 346px;
  height: 139px;
  margin-right: 15px;
  margin-bottom: 15px;
}
.ongoinginfo img {
  width: 105px;
  padding: 2px;
  border: 1px solid #DDD;
  height: 133px;
  margin-right: 5px;
  float: left;
}
.onleft {
  overflow: hidden;
  position: relative;
  margin: -22px 0px;
}
#animelist .onleft h2 {
  text-transform: none;
  font-size: 13px;
  margin: 0;
  font-family: helvetica;
  border-bottom: 0;
  padding: 0;
}
#animelist .onleft h2 a {
  color: #1A3E74;
}
.onleft .kiri {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 11px;
  color: #696969;
}
.onleft .kiri span a {
  color: #696969;
}
.onleft .kiri a {
  color: #696969;
}
.cuplik {
  color: #696969;
  font-size: 11px;
}
.cuplik p {
  margin: 0;
}
.cuplik a {
  color: #696969;
  background: #FAFAFA;
  padding: 0 3px;
}

Setelah itu, Silahkan Masukkan HTML ya di Page anda :) 
<div id="animelist">
<h2>
Ongoing List</h2>
<div class="ongoinginfo">
<a href="http://wardhanime.net/anime/ansatsu-kyoushitsu-tv/">
<img alt="69857" class="attachment-post-thumbnail wp-post-image" src="http://wardhanime.net/wp-content/uploads/2015/01/69857.jpg" height="317" width="225" /></a>
<br />
<div class="onleft">
<h2>
<a href="http://wardhanime.net/anime/ansatsu-kyoushitsu-tv/">Ansatsu Kyoushitsu (TV)</a></h2>
<div class="kiri">
<a href="http://wardhanime.net/japanese/%e6%9a%97%e6%ae%ba%e6%95%99%e5%ae%a4/" rel="tag">暗殺教室</a></div>
<div class="kiri">
<a href="http://wardhanime.net/type/tv-series/" rel="tag">TV Series</a></div>
<div class="kiri">
<a href="http://wardhanime.net/genre/action/" rel="tag">Action</a>, <a href="http://wardhanime.net/genre/comedy/" rel="tag">Comedy</a>, <a href="http://wardhanime.net/genre/school/" rel="tag">School</a>, <a href="http://wardhanime.net/genre/shounen/" rel="tag">Shounen</a>, <a href="http://wardhanime.net/genre/supernatural/" rel="tag">Supernatural</a></div>
<div class="kiri">
Total Episode: <a href="http://wardhanime.net/episode/22/" rel="tag">22</a></div>
<div class="cuplik">
Cerita aksi dibalut komedi segar yang bercerita tentang kelas yang diberi misi khusu untuk membunuh <a class="read-more" href="http://wardhanime.net/anime/ansatsu-kyoushitsu-tv/">more details…</a></div>
</div>
</div>
<div class="ongoinginfo">
<a href="http://wardhanime.net/anime/dog-days-3/">
<img alt="70709" class="attachment-post-thumbnail wp-post-image" src="http://wardhanime.net/wp-content/uploads/2015/01/70709.jpg" height="350" width="225" /></a>
<br />
<div class="onleft">
<h2>
<a href="http://wardhanime.net/anime/dog-days-3/">Dog Days 3</a></h2>
<div class="kiri">
<a href="http://wardhanime.net/japanese/%e3%83%89%e3%83%83%e3%82%b0%e3%83%87%e3%82%a4%e3%82%ba/" rel="tag">ドッグデイズ''</a></div>
<div class="kiri">
<a href="http://wardhanime.net/type/tv-series/" rel="tag">TV Series</a></div>
<div class="kiri">
<a href="http://wardhanime.net/genre/action/" rel="tag">Action</a>, <a href="http://wardhanime.net/genre/adventure/" rel="tag">Adventure</a>, <a href="http://wardhanime.net/genre/fantasy/" rel="tag">Fantasy</a>, <a href="http://wardhanime.net/genre/magic/" rel="tag">Magic</a></div>
<div class="kiri">
Total Episode: <a href="http://wardhanime.net/episode/12/" rel="tag">12</a></div>
<div class="cuplik">
Musim ketiga dari serial Dog Days. Masih menceritakan Shinku Izumi, seorang atlit berkebangsaan Inggris yang <a class="read-more" href="http://wardhanime.net/anime/dog-days-3/">more details…</a></div>
</div>
</div>
<div class="ongoinginfo">
<a href="http://wardhanime.net/anime/durararax2-shou/">
<img alt="67743" class="attachment-post-thumbnail wp-post-image" src="http://wardhanime.net/wp-content/uploads/2015/01/67743.jpg" height="321" width="225" /></a>
<br />
<div class="onleft">
<h2>
<a href="http://wardhanime.net/anime/durararax2-shou/">Durarara!!x2 Shou</a></h2>
<div class="kiri">
<a href="http://wardhanime.net/japanese/%e3%83%87%e3%83%a5%e3%83%a9%e3%83%a9%e3%83%a9x%ef%bc%92%e3%80%80%e6%89%bf/" rel="tag">デュラララ!!×ï¼’　承</a></div>
<div class="kiri">
<a href="http://wardhanime.net/type/tv-series/" rel="tag">TV Series</a></div>
<div class="kiri">
<a href="http://wardhanime.net/genre/action/" rel="tag">Action</a>, <a href="http://wardhanime.net/genre/mystery/" rel="tag">Mystery</a>, <a href="http://wardhanime.net/genre/supernatural/" rel="tag">Supernatural</a></div>
<div class="kiri">
Total Episode: <a href="http://wardhanime.net/episode/1520/" rel="tag">-</a></div>
<div class="cuplik">
Musim kedua dari Durarara!!. Masih menceritakan Ryugamine Mikado, dan tokoh utama lain di kota Ikebukuro. <a class="read-more" href="http://wardhanime.net/anime/durararax2-shou/">more details…</a></div>
</div>
</div>
<div class="ongoinginfo">
<a href="http://wardhanime.net/anime/fairy-tail-2014/">
<img alt="tartarus arc" class="attachment-post-thumbnail wp-post-image" src="http://wardhanime.net/wp-content/uploads/2014/09/tartarus-arc.jpg" height="801" width="563" /></a>
<br />
<div class="onleft">
<h2>
<a href="http://wardhanime.net/anime/fairy-tail-2014/">Fairy Tail (2014)</a></h2>
<div class="kiri">
<a href="http://wardhanime.net/japanese/%e3%83%95%e3%82%a7%e3%82%a2%e3%83%aa%e3%83%bc%e3%83%86%e3%82%a4%e3%83%ab/" rel="tag">フェアリーテイル</a></div>
<div class="kiri">
<a href="http://wardhanime.net/type/tv-series/" rel="tag">TV Series</a></div>
<div class="kiri">
<a href="http://wardhanime.net/genre/action/" rel="tag">Action</a>, <a href="http://wardhanime.net/genre/adventure/" rel="tag">Adventure</a>, <a href="http://wardhanime.net/genre/comedy/" rel="tag">Comedy</a>, <a href="http://wardhanime.net/genre/fantasy/" rel="tag">Fantasy</a>, <a href="http://wardhanime.net/genre/magic/" rel="tag">Magic</a>, <a href="http://wardhanime.net/genre/shounen/" rel="tag">Shounen</a></div>
<div class="kiri">
Total Episode: <a href="http://wardhanime.net/episode/1577/" rel="tag">-</a></div>
<div class="cuplik">
Seorang penyihir muda, Lucy Heartfilia, berkelana ke negara Fiore untuk bergabung dengan Guild Fairy Tail. <a class="read-more" href="http://wardhanime.net/anime/fairy-tail-2014/">more details…</a></div>
</div>
</div>
<div class="ongoinginfo">
<a href="http://wardhanime.net/anime/gundam-build-fighters-try/">
<img alt="67511 (1)" class="attachment-post-thumbnail wp-post-image" src="http://wardhanime.net/wp-content/uploads/2014/10/67511-1.jpg" height="319" width="225" /></a>
<br />
<div class="onleft">
<h2>
<a href="http://wardhanime.net/anime/gundam-build-fighters-try/">Gundam Build Fighters Try</a></h2>
<div class="kiri">
<a href="http://wardhanime.net/japanese/%e3%82%ac%e3%83%b3%e3%83%80%e3%83%a0%e3%83%93%e3%83%ab%e3%83%89%e3%83%95%e3%82%a1%e3%82%a4%e3%82%bf%e3%83%bc%e3%82%ba%e3%83%88%e3%83%a9%e3%82%a4/" rel="tag">ガンダムビルドファイターズトライ</a></div>
<div class="kiri">
<a href="http://wardhanime.net/type/tv-series/" rel="tag">TV Series</a></div>
<div class="kiri">
<a href="http://wardhanime.net/genre/mecha/" rel="tag">Mecha</a></div>
<div class="kiri">
Total Episode: <a href="http://wardhanime.net/episode/1407/" rel="tag">-</a></div>
<div class="cuplik">
Dengan setting cerita 7 tahun setelah GBF pertama, kini kejuaraan Gunpla Battle dijalankan oleh Yajima <a class="read-more" href="http://wardhanime.net/anime/gundam-build-fighters-try/">more details…</a></div>
</div>
</div>
</div>
</div>

Nah Mudahkan, xD
Jadi Kalau Kalian Ingin Membuka Fansub / Fanshare saya Sarankan Memakai ini yah :3

Pengunjung yang baik pasti akan meninggalkan Komentarnya,
Biarpun itu hanya Pertamax! / Sanykuu

No comments

Subscribe to: Post Comments ( Atom )