Halaman ongoing dalam blog download anime atau manga sangat identik kaitannya dengan sebuah postingan yang masih berlanjut. Fungsi dari halaman ongoing adalah untuk memberitahukan anime dengan judul apa saja yang sedang dirilis dan digarap oleh web tersebut.
Dalam blog download anime hal ini sebenarnya tidak wajib ada, namun kalian bisa mencobanya jika ingin memasang halaman ongoing anime, mangam dan light novel auto index.
Cara buat halaman ongoing anime di blogger.
- Masuk Blogger.com > Tema > Edit HTML
- Kalian cek apakah template blogger yang kalian pergunakan sudah dipasang Jquery atau belum. Silahkan pergunakan CTRL + F untuk mencari link Jquery di blog kalian.
- Jika belum memasang Jquery diblognya, kalian copy dan pastekan script Jquery berikut ini tepat diatas </head> atau dibawah tag <head>. Rekomendasi kami ya dibawah tag <head>
- Jika sudah memasang Jquery, cari kode </body> dan copas kode berikut tapat diatasnya.
- Lalu cari tag </style> atau </b:skin>, letakkan kode berikut tepat diatasnya.
- Jika setiap step diatas telah dilakukan, selanjutnya save tema.
- kemudian buat halaman baru, klik menu Halaman > Halaman baru.
- Masuk ke mode HTML, copas kode javascript berikut.
- Publish halaman baru tersebut, jangan lupa beri judul ya.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"/>
<b:if cond='data:blog.pageType in {"static_page","item"}'>
<script type="text/javascript">
$(document).ready(function() {$('img.ongoinglist-images').attr('src', function(i, src)
{return src.replace( 's72-c', 'w122-h145-c' );});});
</script>
</b:if>
/* List ongoing auto index By Bloggerxcode
======================================= */
#ongoing-list-post{margin:0 auto;line-height:normal;list-style:none;font-weight:400}
#ongoing-list-post li.list-ongoing{margin:5px 5px;width:46%;padding:5px;float:left;line-height:normal;font-size:13px;position:relative;border:1px solid #ddd;list-style:none}
#ongoing-list-post img.ongoinglist-images{float:left;width:122px;height:145px;margin-right:5px;border:1px solid}
#ongoing-list-post .ongoinglist-judul{margin-bottom:5px;font-weight:600}
#ongoing-list-post .ongoinglist-more{position:absolute;bottom:0;right:5px}
@media screen and (max-width:728px){
#ongoing-list-post li.list-ongoing{width:100%;max-width:95%;float:none;display:block;clear:both;margin:10px auto;overflow:hidden;}
}
<script type="text/javascript">
var jumlah_ongoinglist = 90;
var showongoingimages = true;
var articleongoing = true;
var ongoing_konten = true;
var jumlah_konten = 70;
var showcommentslink = false;var ongoing_release = false; function showongoinglist(C){document.write('<ul id="ongoing-list-post">');for(var P=0;P<jumlah_ongoinglist;P++){var D,H=C.feed.entry[P],L=H.title.$t;if(P==C.feed.entry.length){break}for(var G=0;G<H.link.length;G++){if("replies"==H.link[G].rel&&"text/html"==H.link[G].type){var J=H.link[G].title,I=H.link[G].href}if("alternate"==H.link[G].rel){D=H.link[G].href;break}}var B;try{B=H.media$thumbnail.url}catch(M){s=H.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),B=-1!=a&&-1!=b&&-1!=c&&""!=d?d:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgugj2qbzsTmme6VFUJ-0RH5leJ9JUPBXAYUaJDiPbrEwyd0HckuBSpPhYkFDygAMd2XZZ2mOhNdR3OFYCa9c3ppXwPwX4GD0bUdxm-GvuVdMJnSAyQKwZfIlpC0Zg_1_SywGhnnsOyCjnm/s1600/no-thumb.png"}var F=H.published.$t,O=F.substring(0,4),N=F.substring(5,7),z=F.substring(8,10),x=new Array;if(x[1]="Jan",x[2]="Feb",x[3]="Mar",x[4]="Apr",x[5]="May",x[6]="Jun",x[7]="Jul",x[8]="Aug",x[9]="Sep",x[10]="Oct",x[11]="Nov",x[12]="Dec",document.write('<li class="list-ongoing">'),1==showongoingimages&&document.write('<a href="'+D+'"><img class="ongoinglist-images" src="'+B+'"/></a>'),document.write('<div class="ongoinglist-judul"><a href="'+D+'" target ="_top">'+L+"</a></div>"),"content" in H){var E=H.content.$t}else{if("summary" in H){var E=H.summary.$t}else{var E=""}}var K=/<\S[^>]*>/g;if(E=E.replace(K,""),1==ongoing_konten){if(E.length<jumlah_konten){document.write(E)}else{E=E.substring(0,jumlah_konten);var q=E.lastIndexOf(" ");E=E.substring(0,q),document.write(E+"...")}}var Q="",j=0;document.write('<br><div class="ongoinglist-more">'),1==ongoing_release&&(Q=Q+x[parseInt(N,10)]+" "+z+" "+O,j=1),1==articleongoing&&(1==j&&(Q+=" | "),Q=Q+'<a href="'+D+'" class="url" target ="_top">Read more</a>',j=1),1==showcommentslink&&(1==j&&(Q+=" <br> "),"1 Comments"==J&&(J="1 Comment"),"0 Comments"==J&&(J="No Comments"),J='<a href="'+I+'" target ="_top">'+J+"</a>",Q+=J,j=1),document.write(Q),document.write("</div>"),document.write("</li>")}document.write("</ul>")};
</script>
<script src="/feeds/posts/default/-/Fall%202021?orderby=published&alt=json-in-script&callback=showongoinglist"></script>
<noscript>Your browser does not support JavaScript!</noscript>
Keterangan
Tag | Keterangan |
var jumlah_ongoinglist = 90; | Silahkan ganti nomor 90-nya dengan angka yang lain. Angka 90 ini menunjukkan jumlah post yang di tampilkan |
var jumlah_konten = 70; | Ganti angka 70 untuk menentukan jumlah kontennya. |
Fall%202021 | Ganti dengan lebel musim anime ongoingnya. |
Cara menggunakan dan menampilkan ongoing list anime di blogger.
Disini aku coba beri step-step kalian membuat halaman ongoing anime. Langsung aja ya.
- Buat postingan baru.
- Jika sudah selesai kalian tambahkan label sesuai dengan kapan animenya dirilis. Misal, fall 2022, summer 2021, dsb.
- Setelah postingan terpublish, kalian buat halaman list ongoingnya dengan cara diatas ya.
- Ganti tag yang kami tandai agar anime ongoingnya bekerja. Di kode diatas yang perlu kalian ganti adalah Fall%202021 dengan label yang tadi dibuat.
- Done
Kalian bisa juga membuat halaman ongoingnya dulu, baru posting anime ongoingnya.
Penutup.
Begitulah cara membuat halaman ongoing anime di blogger. Cara ini dan demonya aku lakukan melalui blogger dengan tema viomagz sebagai demo jadi sangat mungkin tampilannya akan tidak sesuai dengan yang didemo. Jika ada kendala silahkan komentar atau kirim email.
Sekian dari kami.
Source kode : https://arlethdesign.blogspot.com/2017/10/ongoing-list-anime-auto-index.html