Posting Auto Read-More Tanpa Javascript

Posting ini sekaligus sebagai sanggahan dari pernyataan Saya tentang tidak adanya tag khusus dari Blogger untuk memproduksi ringkasan artikel pada Optimasi Thumbnail pada Auto Read-More Link dan Widget Blogger

Versi posting auto read-more link yang satu ini yakni murni memakai tag data dari Blogger untuk mengambil ringkasan postingan dan thumbnail posting. Kita akan menggunakan ke dua elemen ini untuk menyisipkan ringkasan dan gambar:

Mengambil Ringkasan Posting

Mengambil Thumbnail Posting

Selama ini Saya tidak menyadarinya, tetapi kalau kita melihat isi dari widget Posting Populer, maka kita akan menemukan kedua data tersebut di dalamnya (sedikit berlainan pada data:post.thumbnailUrl). Mereka berdua dipakai untuk memperlihatkan ringkasan postingan sebanyak 100 aksara dan thumbnail berskala 72 × 72 piksel ibarat yang biasanya kita lihat pada widget Posting Populer bawaan dari Blogger - Referensi

Jika Anda dikala ini sudah memakai model auto read-more link script, Anda mampu dengan gampang memodifikasinya. Pada formulir HTML Temlpate, dapatkan isyarat ini:

Ganti menjadi menyerupai ini:

Dengan cara di atas, maka deskripsi posting akan tersimpan di dalam atribut data-snippet. Dan untuk memperlihatkan nilai atribut tersebut selaku teks, kita mampu menggunakan CSS Pseudo-Element :before atau :after menyerupai ini:

.post-snippet:before    content:attr(data-snippet);

Sumber https://www.dte.web.id/

Posted by : Admin