Skip to main content

Cara membuat widget jadwal rilis anime di blogger

Setelah sebelumnya saya sudah membagikan tips Cara membuat Menu Multi Dropdown Di blog, dan untuk postingan saya kali ini akan menshare tentang Cara membuat widget jadwal rilis anime di blogger untuk kawan blogger yang sudah lama pastinya sudah tidak asing lagi mengenai widget seperti ini. Tapi untuk sebagian kawan blogger khususnya pemula seperti saya ini masih terbilang awam ya hehe. 
Ok sobat kita kepokok judul dari postingan diatas, disini saya akan membagikan tips Cara membuat widget jadwal rilis anime di blogger untuk kalian yang baru saja membuat blog tentang anime mungkin widget seperti ini bisa kalian terapkan atau pasang di blognya.

Jika berminat untuk menggunakannya bisa langsung di praktekan di blog dengan cara berikut ini: Silahkan kalian buka Blogger > PILIH TEMA > EDIT HTML > Letakan codenya tepat sebelum </style>

/* Jadwal Rilis Anime */
.gunawan-fix{width:25%;float:left}
.gunawan-wrap{padding:10px 4px 10px}
.gunawan-title{color:#fff;font-family:sans-serif;text-align:center;padding:20px 10px;text-transform:uppercase;font-size:22px;font-weight:bold}
.gunawan-fix:nth-child(1) .gunawan-title{background:#000;border-bottom:5px solid #007dd0}
.gunawan-fix:nth-child(2) .gunawan-title{background:#ff0000;border-bottom:5px solid #308e00}
.gunawan-fix:nth-child(3) .gunawan-title{background:#c1004f;border-bottom:5px solid #9e0041}
.gunawan-fix:nth-child(4) .gunawan-title{background:#ff5722;border-bottom:5px solid #ce4115}
.gunawan-fix:nth-child(5) .gunawan-title{background:#008287;border-bottom:5px solid #00696d}
.gunawan-fix:nth-child(6) .gunawan-title{background:#7200ac;border-bottom:5px solid #5d008c}
.gunawan-fix:nth-child(7) .gunawan-title{background:#f58500;border-bottom:5px solid #bd6700}
.gunawan-fix:nth-child(8) .gunawan-title{background:#8c0000;border-bottom:5px solid #610000}
.gunawan-wrap ul{margin:0!important;padding:0!important;color:#333;background:#ebebeb}
.gunawan-wrap ul li{list-style:none;padding:7px 12px!important;transition:all 0.3s;margin:0!important}
.gunawan-wrap ul li:hover{background:#ddd}
.gunawan-wrap ul li a{color:#333}
.gunawan-wrap ul li a:hover{color:#333}

Jika CSS diatas sudah kalian pasang, selanjutnya kalian simpan kembali template yang sudah di edit tadi. Langkah selanjutnya untuk menampilkan widgetnya kalian bisa menggunakan code dibawah ini

<div class='gunawan'>
   <div class='gunawan-fix'>
      <div class='gunawan-wrap'>
         <div class='gunawan-title'>Senin</div>
         <ul>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
         </ul>
      </div>
   </div>
   <div class='gunawan-fix'>
      <div class='gunawan-wrap'>
         <div class='gunawan-title'>Selasa</div>
         <ul>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
         </ul>
      </div>
   </div>
   <div class='gunawan-fix'>
      <div class='gunawan-wrap'>
         <div class='gunawan-title'>Rabu</div>
         <ul>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
         </ul>
      </div>
   </div>
   <div class='gunawan-fix'>
      <div class='gunawan-wrap'>
         <div class='gunawan-title'>Kamis</div>
         <ul>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
         </ul>
      </div>
   </div>
   <div class='gunawan-fix'>
      <div class='gunawan-wrap'>
         <div class='gunawan-title'>Jumat</div>
         <ul>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
         </ul>
      </div>
   </div>
   <div class='gunawan-fix'>
      <div class='gunawan-wrap'>
         <div class='gunawan-title'>Sabtu</div>
         <ul>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
         </ul>
      </div>
   </div>
   <div class='gunawan-fix'>
      <div class='gunawan-wrap'>
         <div class='gunawan-title'>Minggu</div>
         <ul>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
         </ul>
      </div>
   </div>
   <div class='gunawan-fix'>
      <div class='gunawan-wrap'>
         <div class='gunawan-title'>Random</div>
         <ul>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
            <li><a href='#'>Nama Anime</a></li>
         </ul>
      </div>
   </div>
</div>

LIVE DEMO

Silahkan di edit dan bisa disesuaikan code diatas menurut kalian semua, mungkin dari saya cukup segitu dulu aja ya, selamat mencoba dan semoga bisa bermanfaat.
Labels:

Comments

Post a Comment

Popular posts from this blog

Kumpulan Dompet / Wallet Bitcoin Terbaik Gratis dan Terpercaya

Bitcoin merupakan uang digital yang lahir pada tahun 2009, pencipta bitcoin bernama satoshi nakmura dengan total penyebaran atau supply nya terbatas hanya sekitar 21 juta btc saja. Dari tahun ke tahun penggunaan bitcoin semakin banyak dan semakin luas, sehingga membuat harga bitcoin melonjak tajam pada tahun pertamanya yang mencapat sekitar $800 USD lebih kala itu pada tahun 2010. BitcoinQ Pada tahun 2016 ini bertepatan pada bulan maret harganya sekitar $449 USD atau sekitar Rp.6.000.000. Harga bitcoin yang fluktuatif ini membuat  para investos mulai menanamkan dana nya untuk sekedar membeli bitcoin atau trading. Namun saat akan membeli bitcoin atau menambang bitcoin ini kita membutuhkan suatu wadah untuk menyimpannya yang disebut wallet bitcoin. Wallet bitcoin bisa dibuat dengan menginstal aplikasi wallet di komputer atau bisa juga dengan menggunakan jasa wallet secara online agar bisa di tukar dengan uang rupiah maupun uang lainnya. Saya pribadi akan membagikan daftar pemb...
Post a Comment
Read more

Shadow Brokers, Kelompok Hacker Yang Buat Pusing NSA

Pada tahun ini agensi milik Amerika Serikat, National Security Agency (NSA) mendapat pukulan berat setelah sejumlah data dan aplikasi penting mereka berhasil dibongkar oleh kelompok hacker bernama Shadow Brokers. Melalui Shadow Brokers inilah akhirnya kita tahu bahwa NSA sepertinya mempunyai tim hacker yang memiliki sandi 'Equation Group' , sebuah tim yang bekerja dibawah NSA melalui unit kerja Tailor Acess Operations (TAO). TAO ini bertugas mengumpulkan berbagai program untuk membongkar dan meretas beberapa sistem keamanan dari perusahaan software ternama. Sejak akhir 2016 lalu, Shadow Brokers telah berhasil membongkar dan mengungkap salah satu kelemahan dari sistem router Cisco, sebuah server email untuk Windows dan Linux. Lebih parahnya, mereka memberikan celah kelemahan tersebut kepada sang pembuat ransomware 'WannaCry' melalui alat yang di terbitkan hasil yang mereka peroleh dari peretasan NSA tersebut. Tentu saja, pada awalnya NSA hanya ingin menyimpa...
Post a Comment
Read more

Perang Cyber: Perang Modern Yang Tidak Kasat Mata

Seperti dalam film Snowden, apa yang ada pada isi dan yang disampaikan pada film tersebut memang nyata dan sangat mengkhawatirkan. Edward Snowden adalah pembangkang mantan didikan CIA dan Kontraktor NSA (Badan Intelejen Amerika) yang mengungkapkan teknologi mata-mata sangat canggih yang dimiliki negara Amerika. Teknologi canggih Intelejen Amerika yang diungkapkan Edward Snowden ini sendiri berbasis internet dan komunikasi yang sangat canggih, hal ini tidak pernah terbayangkan orang awam seperti kita di negara Indonesia ini, yang umumnya berpikiran intelejen dan mata-mata kelasnya pasti seperti James Bond, atau intel-intel lokal yang sering kita lihat di dalam film atau kita temukan di kampung-kampung dimana ada orang rambut cepak bergaya militer atau rambut gondrong. Dunia intelejen modern yang diungkapkan Edward Snowden ini sama sekali tidak seperti itu. Dunia intelejen modern sendiri pasukanya tidak kasat mata. Pasukan tidak kasat mata yang dimaksud Edward Snowden ini be...
Post a Comment
Read more