Baca dan Tampilkan Feed RSS Blogger - Indeks Total Tanpa Batasan

Belum lama ini Google Blogger telah mengurangi kapasitas membaca feed-nya menggunakan JSON, dari 500 permintaan hanya menjadi 150 entri per permintaan dan itu telah menyebabkan beberapa ketidaknyamanan dengan gadget yang mengandalkan membaca feed untuk menampilkan konten blog.

Misalnya, kebijakan ini telah menyebabkan masalah dimana mereka digunakan untuk membuat indeks entri yang dipublikasikan, karena jika permintaan diprogram atau disetel untuk ditarik dari 500 ke 500 atau, dalam hal apa pun, dalam batch lebih dari 150, tidak semua entri akan diekstraksi dengan benar oleh Google.

Peta situs yang dapat anda tambahkan ke Alat Google WebMasters Tools dengan jenis umpan ini juga akan ikut terpengaruh. Tetapi untuk kedua kasus, karena input dapat dimuat dengan mengulangi permintaan menggunakan start-index dan max-results, solusi sederhananya adalah memuat 150 sekaligus (maksimum), alih-alih melakukannya dalam blok 500, seperti contoh di bawah ini.

https://www.inchimediatama.org/feeds/posts/default?alt=json-in-script&start-index=1&max-results=150&callback=funcion
https://www.inchimediatama.org/feeds/posts/default?alt=json-in-script&start-index=151&max-results=150&callback=funcion
https://www.inchimediatama.org/feeds/posts/default?alt=json-in-script&start-index=301&max-results=150&callback=funcion

Namun, metode ini tidak cukup untuk gadget lain yang perlu memuat semua entri (atau lebih dari 150) sebelumnya, dan kemudian membuat pilihan yang disaring dan / atau diurutkan, seperti halnya dengan indeks berdasarkan tag. Untuk kasus-kasus tertentu, dan untuk hampir semuanya, skrip di bawah ini dapat membaca semua entri yang kita butuhkan sekaligus, terlepas dari batas per Feed yang saat ini ada atau yang mungkin ada di masa depan.

Hasil dari tampilan Feed RSS Blogger
(Warna Kuning)

Algoritma dasarnya adalah untuk mengetahui jumlah total postingan artikel yang diterbitkan dan kemudian dengan angka itu secara otomatis membuat permintaan sebanyak yang diperlukan, tergantung pada permintaan maksimum yang diizinkan.

Permintaan yang berbeda ini akan dikelola dengan menunjukkan titik awal yang berbeda-beda. Setiap kali (start-index) dan hasil pembacaan setiap "subfeed" akan ditambahkan ke array feed. Maka hanya masalah melalui array itu untuk mengekstrak apa yang kita butuhkan dalam setiap kasus.

Pada postingan yang sedang anda baca ini kami akan memberikan kasus umum feed, sehingga setiap orang dapat menyesuaikannya dengan kebutuhan mereka, kode berikut membaca semua data di umpan feed Blogger (termasuk thumbnail yang sesuai dengan avatar penulis setiap postingan).

Tetapi agar tidak menampilkan semuanya jika anda tidak perlu, saya juga menyertakan beberapa variabel yang dapat dikonfigurasi yang dapat anda lihat di awal dan di mana Anda dapat memilih elemen mana yang akan ditampilkan (benar) dan mana yang tidak (salah).

Script di bawah ini menjadi bagian yang harus anda sisipkan dalam template Blogger, letakkan script di bawah ini diantara kode  ]]></b:skin> dan </head> sehingga kita tidak perlu mengulanginya jika kita akan menggunakannya untuk beberapa utilitas. Anda dapat menghapus pustaka JQuery, jika anda telah menyematkannya di template Blogger anda.

Letakkan di atas kode </head>

<!-- Pembaca Umpan Total https://jetjp.blogspot.com -->
<script crossorigin='anonymous' integrity='sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4=' src='https://code.jquery.com/jquery-3.7.1.js'/>
<script type='text/javascript'>//<![CDATA[
// Parameter yang dapat dikonfigurasi
var web = 'https://www.inchimediatama.org'; 
var vertotal = true; 
var total = $('#total'); 
var cajasalida = $('#feed'); 
var postsxfeed = 150; 
var leermaximo = 1; 
var verimagen = true; 
var anchoimagen = 100; 
var sinimagen = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgerbNvRWZUneYI3TxMRiuFkvftKZO_NNckQif1hiWwMRJNE-sMxfQORcgK7abf8Sq1y-dxJKTMrIX6bOgKYUTrIZrEP7bWYyRNhw_bZrp03ESoMt63AF-Dkjpd4hrLa1eJFbcwsjXAO6Hn/s400/cooltext90744301.jpg'; 
var vercontador = true; 
var verfecha = true; 
var veretiquetas = true; 
var separadoreti = '- '; 
var verautor = true; 
var vernumcom = true 
var vertitulo = true; 
var vertexto = true; 
var maxcaracteres = 200;
// Bagian eksekusi
var feed=web+'/feeds/posts/default';var contposts=-1;var reimg=/[\/=][sw][0123456789].+[\/o]/g;var reimg2=/\/s[012345679].+\/$/g;$.getJSON(feed+'?alt=json&callback=?').done(function(data){var longfeed=data.feed.openSearch$totalResults.$t;if(vertotal){$(total).append('Total postingan yang diterbitkan: '+longfeed)}if(longfeed>leermaximo){longfeed=leermaximo;$(total).append('. Menampilkan '+leermaximo)}else{$(total).append('. Menampilkan '+longfeed)}var peticiones=Math.ceil(longfeed/postsxfeed);var ajax=[];for(i=0;i<peticiones;i++){if(peticiones===1){ajax.push(leerfeeds(i),'');ajax.push('')}else{ajax.push(leerfeeds(i))}}function leerfeeds(id){var startindex=(i*postsxfeed)+1;var maxresults=postsxfeed;if(i==(peticiones-1)){maxresults=leermaximo-(postsxfeed*i)}var url=feed+'?orderby=published&start-index='+startindex+'&max-results='+maxresults+'&alt=json&callback=?';return $.getJSON(url)}$.when.apply($,ajax).done(function(data){var obj=[];for(var i=0;i<arguments.length;i++){obj.push(arguments[i][0])}for(i=0;i<arguments.length;i++){contposts++;$.each(obj[i].feed.entry||[],function(i,e){var salida='<div class="itempost">';var url=(e.link||[]).pop().href;if(verimagen){var thumbnail;if(e.media$thumbnail){thumbnail=(e.media$thumbnail.url||'')}else{thumbnail=sinimagen}thumbnail=thumbnail.replace(reimg,'/s'+anchoimagen+'-c/');thumbnail=thumbnail.replace(reimg2,'=s'+anchoimagen);salida+='<a class="itemimagen" href="'+url+'"><img src="'+thumbnail+'"/></a>'}if(vercontador){salida+='<div class="itemcontador">'+((contposts*postsxfeed)+i+1)+'</div>'}if(verfecha){var fecha=new Date(e.published.$t||Date.now());fecha=(new Date(fecha)).toLocaleDateString('es-es',{month:'2-digit',day:'2-digit',year:'2-digit'});salida+='<div class="itemfecha">'+fecha+'</div>'}if(verautor){var autor=(e.author[0].name.$t||'');salida+='<div class="itemautor"><a href="'+e.author[0].uri.$t+'">'+autor+'</a><div class="itemautorimg"><a href="'+e.author[0].uri.$t+'"><img src="'+e.author[0].gd$image.src+'"/></a></div></div>'}if(vernumcom){var numcom=(e.thr$total.$t||'');salida+='<div class="itemnumcom"><a href="'+url+'#comments">'+numcom+' comentarios</a></div>'}if(veretiquetas){var etiquetas=[];if(e.category){for(var k=0;k<e.category.length;k++){etiquetas+='<a href="'+web+'/search/?q=label:'+e.category[k].term+'">'+e.category[k].term+'</a>';if(k<e.category.length-1){etiquetas+=separadoreti}}}else{etiquetas+='Sin etiquetas'}salida+='<div class="itemetiquetas">'+etiquetas+'</div>'}if(vertitulo){var titulo=(e.title.$t||'');salida+='<div class="itemtitulo"><a href="'+url+'">'+titulo+'</a></div>'}if(vertexto){var sumario;if('content'in e){sumario=e.content.$t;var reghtml=/<\S[^>]*>/g;sumario=sumario.replace(reghtml,'');if(sumario.length>maxcaracteres){sumario=sumario.substring(0,maxcaracteres)+'...'}}else if('summary'in e){sumario=e.summary.$t+'...'}salida+='<div class="itemsumario">'+sumario+'</div>'}salida+='</div>';$('.loading').remove();cajasalida.append(salida)})}})});//]]></script>

Selanjutnya, agar entri dapat dibaca dan sudah ada di entri atau dashboar halaman Blogger, anda harus menambahkan script berikut ini. Letakkan script di bawah ini dimana saja sesuai dengan tampilan Blogger anda (anda bisa menempatkannya di sidebar, header ataupun footer).

Letakkan di atas kode </header>

<div id='total'/>
<div class='loading'/>
<div id='feed'/>
<script type='text/javascript'>//<![CDATA[
// Parameter yang dapat dikonfigurasi
var web = 'https://www.inchimediatama.org';
var vertotal = true; 
var total = $('#total'); 
var cajasalida = $('#feed'); 
var postsxfeed = 150; 
var leermaximo = 1; 
var verimagen = true; 
var anchoimagen = 100; 
var sinimagen = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIVkevWKVuMxVmXz_bPoGmz7V8O34VjK42Z8wBrG8FT6xyfXAxrUvrQCDJZQ1bgoxWu0HZ738lteaaKdX0wBJKDkCCMdF4iY33k2h7RKxPmLLX_INCbwoGUVJ9kIsX37Y_YJu9Auifjo1fKQh_rMrVqwJ-a8esv0dmtPp_DXax4DSbLga7hMHpSEWHfonj/s320/unixwinbsd.jpg'; 
var vercontador = true; 
var verfecha = true; 
var veretiquetas = true; 
var separadoreti = '- '; 
var verautor = true; 
var vernumcom = true 
var vertitulo = true; 
var vertexto = true; 
var maxcaracteres = 200; 
//]]></script>

Jika anda tidak akan mengubah parameter asli, anda tidak dapat mengulanginya di sini. Akan cukup bagi mudah bagi anda untuk menempatkan yang berubah sehubungan dengan yang saya sertakan dalam naskah yang saya katakan untuk dimasukkan ke dalam template untuk ditampilkan dihalaman Blogger.

Penyebutan penting untuk variabel "leermaximo", yang merupakan jumlah maksimum entri yang akan kita baca. Saya menempatkan ini seperti ini karena jika kita tidak benar-benar perlu membaca semua posting yang diterbitkan, kita akan menghindari penundaan yang tidak perlu. Pembacaan umpan lambat, jadi kita hanya perlu melalui jumlah entri yang diperlukan, tidak lebih, tidak kurang.

Dalam template saya meletakkan variabel itu dengan nilai 1 sehingga tidak akan dieksekusi dengan yang lebih tinggi kecuali diurutkan langsung dari gadget atau input. Hasilnya adalah ini dan di dalamnya Anda akan dapat menemukan seberapa lambat pemuatan sekitar 800 entri.

Anda dapat dengan mudah mengubah gaya atau tampilan feed, karena semua elemen keluar dengan kelasnya sendiri oleh CSS. Tetapi agar anda memiliki dasar yang dapat anda modifikasi, ini adalah script CSS yang digunakan dalam artikel ini. Letakkan Script CSS ini tepat di atas kode ]]></b:skin>

Script CSS letakkan di atas kode ]]></b:skin>

#total{display:block;font-size:22px;line-height:24px;margin-bottom:10px;padding:10px;border:2px solid #000;box-sizing:border-box;text-align:center;color:#eee;background:#333}
.itempost{display:block;padding:10px;clear:both;box-sizing:border-box;overflow:hidden}
.itempost:nth-of-type(odd){background:#EFD689}
a.itemimagen{float:left;margin:0 20px 0 0}
.itemimagen img{border:1px solid #999;box-sizing:border-box}
.itemcontador{display:inline;margin:0 10px 0 0;font-size:80%}
.itemfecha{display:inline;margin:0 10px 0 0;font-size:80%}
.itemautor{position:relative;display:inline;margin:0 10px 0 0;font-size:80%}
.itemautorimg{display:none;position:absolute;top:14px;left:0}
.itemautorimg img{width:32px;height:32px}
.itemautor:hover .itemautorimg{display:block}
.itemnumcom{display:inline;margin:0 10px 0 0;font-size:80%}
.itemetiquetas{display:inline;font-size:80%}
.itemetiquetas a{display:inline-block;margin:0 5px 0 0;background:#eee;padding:0 5px;box-sizing:border-box}
.itemautor a,.itemnumcom a,.itemetiquetas a{color:#B38D1C;text-decoration:none}
.itemnumcom a:hover{text-decoration:underline}
.itemtitulo a{display:block;margin:10px 0;font-size:20px;color:#B38D1C;text-decoration:none}
.loading{display:block;width:80px;height:80px;margin:10px auto;border-width:30px;border-radius:50%;-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;border-style:double;border-color:#666 transparent}
.loading:before{content:"LOADING";font-weight:700;line-height:80px;color:#900}
@-webkit-keyframes spin {100%{-webkit-transform:rotate(359deg)}}
@keyframes spin {100%{transform:rotate(359deg)}}

Setelah anda meletakkan script CSS tersebut, sekarang anda refresh halaman Blogger anda dan lihat hasilnya. Hasil seperti tampak pada gambar di atas (berwarna kuning).

Dan yah, dengan semua hal di atas anda dapat mengatur indeks komprehensif yang menunjukkan semua entri yang dipublikasikan di Blogger anda. Jika anda memiliki tampilan blogger yang saat ini berfungsi dengan buruk untuk anda karena masalah ini, komentari dan saya akan mencoba meluangkan waktu untuk membangunnya kembali dengan utilitas ini. Saat ini saya sudah bekerja dengan "indeks berdasarkan tag".

Tentunya, dengan peta situs serial baru kita dapat melakukan sesuatu yang lebih mendasar untuk hanya menampilkan judul setiap postingan dan tautannya, tetapi itu juga akan menjadi waktu lain.

Dan tentu saja, jika anda menemukan sesuatu yang dapat dioptimalkan dalam kode, saya akan dengan senang hati menerima sarann anda.