Postingan

Browsing Artikel: Blogger v3
Tunjukkan semua
Cara Memasang Breadcrumb pada Blogger Terbaru Versi 3

Cara Memasang Breadcrumb pada Blogger Terbaru Versi 3

Salah satu fitur yang hilang dari update HTML Blogger ialah breadcrumb. Lalu bagaimana cara memasang kembali fitur breadcrumbs tersebut? Lebih baik menggunakan breadcrumb atau tidak perlu lagi? Sejauh ini, itu pertanyaan yang masih menghantui saya. Mengapa Blogger Developers kok tega menghilangkannya? Apa memang breadcrumb udah gak guna lagi? Yang pakar SEO mudah-mudahan bisa jawab pertanyaan ini di kolom komentar. Nah, bagi yang terpaksa mengabaikan pertanyaan-pertanyaan tersebut, penuh keyakinan untuk nekat pasang breadcrumb di sintaks Blogger versi terbaru, berikut caranya! Tips: Dalam hal ini, kita tetap menggunakan parameter dan kode pemanggil parameternya. Sehingga output breadcrumb bisa diletakkan dan ditampilkan dimana saja. Alias bisa diletakkan di dalam dan d luar post page . Langkah 1: cari kode ini <b:defaultmarkup type='Common'> Langkah 2: letakkan kode parameter berikut di bawah kode tadi:         <b:includable id='breadcrumb' var='
Membuat 3 Iklan yang Tampil Sesuai Paragraf dan Bisa Diedit pada Layout, untuk Blogger Layout v3

Membuat 3 Iklan yang Tampil Sesuai Paragraf dan Bisa Diedit pada Layout, untuk Blogger Layout v3

Trik kali ini terkait slot iklan yang letaknya khusus di tengah postingan/artikel (post page), namun bisa di edit melalui menu Layout atau Tata Letak Blogger. Keunggulan dari widget slot iklan ini dapat di setting ingin ditampilkan pada paragraph tertentu. Cara penerapannya masih mirip-mirip dengan tutorial yang telah saya bagikan sebelumnya, yaitu Trik Agar Bisa Edit Kode Iklan dibagian Postingan pada Menu Layout/Tata Letak . Hanya saja bedanya, kali ini saya menerapkannya pada Blogger yang layout versi 3 ( b:defaultwidgetversion='2' b:layoutsVersion='3' ). Jadi, cara ini tidak akan berhasil diterapkan begitu saja pada HTML yang biasanya. Namun kalau Anda sudah mengerti sedikit kode HTML, maka akan sangat mudah bagi Anda untuk utak-atik ini dan menerapkannya pada jenis html yang lama. Karena sebetulnya hanya butuh sedikit perubahan pada bagian html pemanggil widgetnya saja, yang bisa dikonfigurasi pada layout. Mengapa saya pilih menerapkannya di Blogger layout ve
Solusi Snippet Untuk Homepage yang Muncul Link dan Tampilan Error pada Blogger Terbaru

Solusi Snippet Untuk Homepage yang Muncul Link dan Tampilan Error pada Blogger Terbaru

Pada template Blogger terbaru layout versi 3, dalam sintaks snippet untuk membuat ringkasan postingan pada halaman utama (homepage), sudah tersedia secara default. Parameternya dipanggil dengan kode <b:include cond='data:post' data='post' name='postSnippet'/> . Masalahnya ialah, jika pada paragraf awal postingan terdapat elemen tag a (link), maka link tersebut muncul juga di snippet/description postingan homepage. Tidak hanya itu, tag elemen lainnya juga ikut muncul. Seperti tag bold , italic , underline dan lainnya. Dan eksistensinya sangat amat mengganggu tampilan blog. Ditambah lagi jika snippet ke- crop dan terdapat tag div atau tag lainnya, maka akan membuat berantakan tampilan selanjutnya. Kadang tampilan selanjutnya jadi bold semua, letaknya jadi gak karuan dan lainnya, pokoknya berantakan! Nah, bagaimana menanggulangi masalah-masalah krusial tersebut, tanpa harus mengubah kode pemanggil parameternya yang seperti di bawah ini? <b:inc
Custom Structured Metadata JSON Blogger Versi Terbaru (Blogger Layout Versi 3)

Custom Structured Metadata JSON Blogger Versi Terbaru (Blogger Layout Versi 3)

Setidaknya ada dua cara memasang structured metadata di blog/website yang paling popular digunakan. Yaitu dengan format Microdata dan JSON. Masing-masing cara pemasangan structured metadata keduanya berbeda. Intinya, structured metadata ini ditujukan untuk optimasi Rich Snippet sebuah blog/website untuk hasil penelurusan yang ideal dalam niche atau bahasan blog. Structured data dengan format Microdata lebih sering ditempelkan dan memanfaatkan selector serta markup HTML secara struktur atas HTML itu sendiri. Pokoknya tinggal di tempel-tempel saja pada markup yang ingin disajikan untuk membentuk rich snippet yang ideal (juga memenuhi spesifikasi). Kalau structured data dengan format JSON, itu dihidangkan secara terpisah. Karena sifatnya yang terbungkus menjadi satu script. Structured data dengan format JSON bisa diletakkan dimana saja, baik itu di dalam <head> dan di dalam <body> . Contohnya ini, yang sering kita liat nimbrung bersama meta tag, di bawah kode <head
Format Cara Memasang datePublished dan dateModified pada Template Blogger Terbaru (Layout Versi 3)

Format Cara Memasang datePublished dan dateModified pada Template Blogger Terbaru (Layout Versi 3)

Adapun  datePublished dan dateModified merupakan property yang sangat dibutuhkan dalah penyusunan struktur data sebuah template, dalam hal ini platform Blogger. Baik itu untuk format structured data dalam bentuk Microdata, Json atau lainnya (RFDa, RDFa). Masalahnya, dalam update Blogger terbaru (untuk layout versi 3), terdapat sejumlah tag mengalami perubahan yang cukup ekstrim, beberapa tag ditambahkan dan beberapa tag juga dihilangkan. Pokoknya update-nya fresh, hampir semua baru! Masalah besar sebetulnya ada pada beberapa elemen yang diganti, alias tidak bisa lagi digunakan, harus merujuk dan menggunakan yang baru. Diantaranya ialah penggunaan datePublished dan dateModified, yang sudah tidak bisa lagi menggunakan cara-cara lama. Jika cara lama memasang datePublished dan dateModified biasanya diterapkan seperti ini: <meta expr:content='data:post.timestampISO8601' itemprop='datePublished'/> <meta expr:content='data:post.lastUpdatedISO8601' it
Cara Lain Memasang Thumbnail Post di Homepage tanpa JavaScript

Cara Lain Memasang Thumbnail Post di Homepage tanpa JavaScript

Salah satu item yang memberi sumbangsi vital terhadap loading blog untuk platform Blogger/blogspot ialah pemuatan gambar, tidak terkecuali thumbnail post di homepage. Lebih-lebih jika elemen gambar tersebut tidak di scale dengan benar. Yang mana size atau resolusi gambar yang besar, ditampilkan dengan custom ukuran (lebar dan tinggi) yang lebih kecil. Cara tersebut tidak sepenuhnya mengubah dimensi gambar. Meskipun menggunakan trik resize image dengan JavaScript ataupun manipulasi CSS. Nah, berikut ini ada satu trik lagi untuk menampilkan thumbnail post di homepage (halaman utama). Yaitu menempatkan gambar pertama dari postingan, sebagai background untuk dijadikan thumbnail. Yang akan dipanggil dengan background-image: url(CUSTOM_IMAGE_URL_HERE) . Cek DEMO berikut, lalu IE/buka sourcenya, perhatikan pengkodean pada bidang thumb-wrapper . Demo Cara bikinnya adalah sebagai berikut: Langkah 1: Masuk ke Edit HTML, lalu ganti kode pemanggil thumbnail post (homepage) Anda dengan