Anime List Auto Index Responsive Blogger
Anime list Auto Index Responsive Blogger - Anime list biasanya diharapkan untuk blog dengan niche Download anime, anime list sering kita jumpai di web atau blog-blog anime, namun kali ini aku akan membahas Bagaimana Cara Membuat Anime list Auto Index Responsive Untuk Blogger.
Pasti kau pernah merasa malas & lelah mengurus Anime list/ Daftar Isi blog kalian dikarenakan konten atau postingan blog tersebut terlalu banyak, makanya dari itu aku disini akan membagikannya tips semoga kalian tidak perlu mengedit atau mengisi Anime Listnya lagi, jadi kalian tidak kerepotan mengisi daftar isi setiap kali posting. Ok kita mulai saja tutorial kali ini
Cara Membuat Anime list Auto Index Responsive Blogger
- Buka Blogger > Buat Postingan Berlabel dari A hingga Z menurut Huruf Awal Judul Postingan Tersebut
- Buat Halaman baru, kemudian Salin CSS dibawah kedalam halaman tersebut
- Kemudian Salin HTML & Javascript ini dan simpan dibawah CSS yang barusan
- Publikasikan dan lihat hasilnya
<style> /* CSS By Arleth98 */ .listanim-wrapper{max-width:1060px;margin:auto} .abjad{padding:1px 0;text-align:center;margin:0 0 5px 0} .abjad a{display:block;padding:5px 0;width:26.7px;float:left;background:#424242;font-weight:500;color:#FFFFFF;text-decoration:none;} .abjad a:hover{background: #2977BE;text-decoration: none;} .clear{clear:both} .grup-judul{font-family:segoe ui;font-weight:bold;color:#333;font-size:13px;border-bottom:2px solid #2977BE;margin-bottom:5px;background:none;padding:5px;text-transform:uppercase;position:relative;clear: both;} .grup ul li{width:50%;float:left;} @media screen and (max-width:900px){.grup ul li{width:100%;float:none;clear:both;}.abjad a{}} </style><div class='listanim-wrapper'> <script type="text/javascript"> var numposts = 999; var standardstyling = true; function showrecentposts(json) { for (var i = 0; i < numposts; i++) { var entry = json.feed.entry[i]; var posttitle = entry.title.$t; var posturl; if (i == json.feed.entry.length) break; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') { posturl = entry.link[k].href; break; }} posttitle = posttitle.link(posturl); if (standardstyling) document.write('<li>'); document.write(posttitle);} if (standardstyling) document.write('</li>'); } </script> <div class='abjad'><a href="#0">0</a> <a href="#A">A</a> <a href="#B">B</a> <a href="#C">C</a> <a href="#D">D</a> <a href="#E">E</a> <a href="#F">F</a> <a href="#G">G</a> <a href="#H">H</a> <a href="#I">I</a> <a href="#J">J</a> <a href="#K">K</a> <a href="#L">L</a> <a href="#M">M</a> <a href="#N">N</a> <a href="#O">O</a> <a href="#P">P</a> <a href="#Q">Q</a> <a href="#R">R</a> <a href="#S">S</a> <a href="#T">T</a> <a href="#U">U</a> <a href="#V">V</a> <a href="#W">W</a> <a href="#X">X</a> <a href="#Y">Y</a> <a href="#Z">Z</a><div class="clear"></div> </div> <div class='content-list'> <div class='grup'><div class='grup-judul'><a name="0">0</a></div> <ul> <script src="/feeds/posts/default/-/0?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="A">A</a></div> <ul> <script src="/feeds/posts/default/-/A?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="B">B</a></div> <ul> <script src="/feeds/posts/default/-/B?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="C">C</a></div> <ul> <script src="/feeds/posts/default/-/C?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="D">D</a></div> <ul> <script src="/feeds/posts/default/-/D?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="E">E</a></div> <ul> <script src="/feeds/posts/default/-/E?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="F">F</a></div> <ul> <script src="/feeds/posts/default/-/F?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="G">G</a></div> <ul> <script src="/feeds/posts/default/-/G?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="H">H</a></div> <ul> <script src="/feeds/posts/default/-/H?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="I">I</a></div> <ul> <script src="/feeds/posts/default/-/I?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="J">J</a></div> <ul> <script src="/feeds/posts/default/-/J?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="K">K</a></div> <ul> <script src="/feeds/posts/default/-/K?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="L">L</a></div> <ul> <script src="/feeds/posts/default/-/L?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="M">M</a></div> <ul> <script src="/feeds/posts/default/-/M?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="N">N</a></div> <ul> <script src="/feeds/posts/default/-/N?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="O">O</a></div> <ul> <script src="/feeds/posts/default/-/O?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="P">P</a></div> <ul> <script src="/feeds/posts/default/-/P?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="Q">Q</a></div> <ul> <script src="/feeds/posts/default/-/Q?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="R">R</a></div> <ul> <script src="/feeds/posts/default/-/R?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="S">S</a></div> <ul> <script src="/feeds/posts/default/-/S?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="T">T</a></div> <ul> <script src="/feeds/posts/default/-/T?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="U">U</a></div> <ul> <script src="/feeds/posts/default/-/U?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="V">V</a></div> <ul> <script src="/feeds/posts/default/-/V?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="W">W</a></div> <ul> <script src="/feeds/posts/default/-/W?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="X">X</a></div> <ul> <script src="/feeds/posts/default/-/X?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="Y">Y</a></div> <ul> <script src="/feeds/posts/default/-/Y?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> <div class='grup'><div class='grup-judul'><a name="Z">Z</a></div> <ul> <script src="/feeds/posts/default/-/Z?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=999"></script> </ul> </div> </div> </div>Beri Label di Post dengan Huruf Kapital (Sesuai Abjad dari Huruf depan judul post)
Contoh : Death Note > Label nya D