SafelinkU | Shorten your link and earn money

Spoiler Post Seperti Post Lirik Lagu Achnime


Apa kabar semuanya? kali ini saya akan membagikan tutorial yang hampir sama seperti post saya sebelumnya yaitu Cara Membuat Spoiler Di Post Blog, tutorial kali ini mungkin bermanfaat buat kalian yang mempunyai blog dengan niche seperti Achnime, kegunaannya untuk membuat post lirik lebih nyaman dilihat jadi tanpa harus scroll kebawah karena banyaknya kalimat lirik tersebut. Ok kita mulai saja tutorial kali ini.

Cara Membuat Spoiler Post Seperti Post Lirik Lagu Achnime


1. Buka Blogger, Edit Template > HTML, Simpan markup Javascript & Link CSS berikut ke bawah <head>, atau di atas </head>, Lalu Save Template.
<script src='https://cdn.rawgit.com/Arleth98/Javascript/c5fb7f93/tab.js'/>
<script src='https://cdn.rawgit.com/Arleth98/Javascript/c5fb7f93/transition.js'/>
<link type='text/css' rel='stylesheet' href='https://cdn.rawgit.com/Arleth98/Css/1adcd20a/tab.css'/>

2. Langkah selanjutnya yaitu buatlah post dengan Markup HTML berikut ini, jangan lupa isi konten di tempat yang sudah saya tandai
<div class="xa-default" role="tabpanel" data-example-id="togglable-tabs">
<ul id="myTab-1" class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#xt-tab-1" id="home-tab" role="tab" data-toggle="tab" aria-controls="home" aria-expanded="true">Romaji</a></li>
<li role="presentation" class=" "><a href="#xt-tab-2" id="home-tab" role="tab" data-toggle="tab" aria-controls="home" aria-expanded="true">Japanese</a></li>
<li role="presentation" class=" "><a href="#xt-tab-3" id="home-tab" role="tab" data-toggle="tab" aria-controls="home" aria-expanded="true">English</a></li>
<li role="presentation" class=" "><a href="#xt-tab-4" id="home-tab" role="tab" data-toggle="tab" aria-controls="home" aria-expanded="true">Indonesia</a></li>
</ul>
<div id="myTabContent-1" class="tab-content">
<div role="tabpanel" class="tab-pane fade in active" id="xt-tab-1" aria-labelledby="home-tab">
<p>Content</p>
</div>
<div role="tabpanel" class="tab-pane fade in" id="xt-tab-2" aria-labelledby="home-tab">
<p>Content</p>
</div>
<div role="tabpanel" class="tab-pane fade in " id="xt-tab-3" aria-labelledby="home-tab">
<p>Content</p>
</div>
<div role="tabpanel" class="tab-pane fade in " id="xt-tab-4" aria-labelledby="home-tab">
<p>Content</p>
</div>
</div>
</div>

Demo

Sekian Dulu tutorial Cara Membuat Spoiler Post Seperti Post Lirik Lagu Achnime, semoga bermanfaat.
SafelinkU | Shorten your link and earn money
Updated at:
1 Komentar untuk "Cara Membuat Spoiler Post Seperti Post Lirik Lagu Achnime Di Blogger"

mantap gan, makasih..
berhasil ku coba di blog ku.
silahkan berkunjung ke blog ku gan frostnime.blogspot.com

~ Peraturan Fcips ~

=> Bebas Link Hidup Hapus , Kalau mau pakai , pakai link mati Gunakan Dgn ,[ [dot] dll
=> Spam Komentar Komentar Akan dihapus permanen
=> Gunakan Kata Sopan
=> Harigailah Kami Punya Blog Ini

~ Terimahkasih ~

× Danger! Silahkan Chat Di Pada Komentar Kamu Baca Link Rusak Silahkan Lapor Pada Artikel TSB

Popular Posts