Postingan

Browsing Artikel: Tutorial Singkat
Tunjukkan semua
Blogger Conditional Tags URL Contains

Blogger Conditional Tags URL Contains

 Melanjutkan tutorial singkat kemari tentang  Blogger Conditional Tags dengan data:view.pageId dan data:view.postId . Kali ini akan dibahas Blogger conditional tags lainnya, yang sedikit lebih kompleks dan teknis. Blogger conditional tags dengan operator URL contains ini memungkinkan Anda untuk membuat kondisi pada semua URL di blog yang mengandung sebagian atau seluruh dari  slug tertentu, yang dituliskan sebagai string . Menariknya, semua URL blog yang dimaksud adalah meliputi URL di Page (halaman static), Post (postingan), label, search, archive dan lainnya. Penerapan   <b:with value='data:view.url.canonical' var='url'>   <b:if cond='or(contains(data:url, "tutorial-blog"), contains(data:url, "/p/contact"), contains(data:url, "2024/07/cara-"), contains(data:url, "/search/label/Templates"), contains(data:url, "naruto atau boruto"))'>     <!-- your code or content here -->  </b:if> </b
Blogger Conditional Tags dengan data:view.pageId dan data:view.postId

Blogger Conditional Tags dengan data:view.pageId dan data:view.postId

 Bagi yang masih kesulitan dalam penerapan tag kondisional untuk page dan post tertentu yang tidak bekerja atau mengalami error, bisa mencoba cara ini. Yaitu dengan langsung memanfaatkan ID pada masing-masing post dan page, yang biasanya dipanggil menggunakan data global  <data:blog.pageId/> dan <data:blog.postId/> . Masalah dalam Penggunaan Conditional Tags pada Page / Post Tertentu Masalah umum yang sering terjadi saat menerapkan tag kondisional untuk halaman tertentu diantaranya adalah sebagai berikut. Tidak muncul sama sekali. Berhasil pada tampilan desktop tetapi gagal pada tampilan mobile. Masalah error tersebut seringkali terjadi pada kondisi pengecualian, yang biasanya ditulis dengan seperti ini: <b:if cond='data:view.isHomepage or data:view.isPage and data:view.url != data:blog.homepageUrl.canonical path &quot;p/about.html&quot; and data:view.url != data:blog.homepageUrl.canonical path &quot;p/contact.html&quot;'> Atau seperti ini: &l
Cara Membuat Read Time Otomatis di Blogspot atau Blogger

Cara Membuat Read Time Otomatis di Blogspot atau Blogger

Menampilkan perkiraan waktu membaca (reading time) di Blogspot atau Blogger secara otomatis kita bisa lakukan dengan mudah menggunakan JavaScript. Widget ini kurang lebih dapat memberi gambaran kepada pembaca terhadap berapa banyak estimasi waktu yang dibutuhkan untuk membaca konten tersebut. Widget reading time Blogspot ini menjadi semacam hipnosis untuk membuat pembaca bertahan sedikit lebih lama saat sedang membaca sebuah konten blog. Kira-kira begitulah fungsi reading time. Tujuannya, tentu saja fitur ini soal pengurangan poin (persentase) terhadap bounce rate blog. Dalam hal ini, widget read time dapat menjadi teknik terapan tambahan lainnya dalam mengembangkan blog menjadi  user-friendly. Cara Memasang Estimasi Reading Time di Blogger/Blogspot Secara Otomatis Berikut ini cara menerapkan widget auto Reading Time di Blogspot atau Blogger: Perhatikan Struktur PostBody Pertama, silahkan perhatikan terlebih dahulu struktur halaman postingan  PostBody ( <b:includable id='postBo
Mengatasi Thumbnail Homepage Blur di Blogger Versi Terbaru

Mengatasi Thumbnail Homepage Blur di Blogger Versi Terbaru

Akhir-akhir ini saya menerima begitu banyak email/pesan mengenai thumbnail atau gambar di homepage menjadi blur, saat melakukan postingan dengan menggunakan Blogger versi terbaru. Setelah mengamati sebentar, ternyata URL gambar yang diposting pada dashboard Blogger terbaru itu sudah berubah. Maka dengan demikian, penggunaan JavaScript dalam memanggil thumbnail di homepage dengan kode seperti di bawah ini sudah tidak bekerja dengan baik: <script type='text/javascript'> //<![CDATA[ function bung_thumbnail(e,t){var n=400;var r=280;image_tag='<img width="'+n+'" height="'+r+'" src="'+e.replace("/s72-c/","/w"+n+"-h"+r+"-c/")+'" alt="'+t.replace(/"/g,"")+'" title="'+t.replace(/"/g,"")+'"/>';if(t!="")return image_tag;else return""} //]]> </script> Yang dalam HTML, kode pemangg
Cara Menampilkan Teks Keterangan Timestamp (TimestampLabel)

Cara Menampilkan Teks Keterangan Timestamp (TimestampLabel)

Timestamp label atau post date label ini adalah salah satu widget setting yang biasanya dapat diedit melalui form textarea Gadget Posting Blog , yang sejajar dengan format tanggal posting. Yang ditunjukkan oleh gambar ini: Di Edit HTML, kita bisa jumpai kodenya seperti berikut ini: <b:widget-setting name='timestampLabel'>[string]</b:widget-setting> Saya kurang yakin dengan nama yang diberikan oleh developer Blogger untuknya. Namun begitu, tentu Anda sudah mahfum dengan apa yang saya maksud. Melalui gambar dan kode yang saya kasih di atas. Jadi, mari kita sepakati saja memenaggilnya dengan nama teks keterangan timestamp, timestamp label, post date label, atau widget setting timestampLabel. Jika Anda kebetulan mengetahui nama sesungguhnya, tolong bagikan di komentar. Pada kebanyakan template Blogger, widget setting timestampLabel ini sangat jarang digunakan. Para desain template lebih memilih menggantinya dengan icon (Material icon atau Font Awesome). Dibe