Blog iTapuih.com

Kilas Balik Blogger Indonesia Selengkapnya
Home
Tutorial Blog

Cara Menampilkan Widget Hanya di Halaman Tertentu

Tutorial berikut ini tentang Cara Menampilkan Widget Hanya di Halaman Tertentu. Cara ini sangat berguna bagi sobat yang ingin memberikan tampilan terbaik website atau blog kepada pengunjung. Dengan cara ini kita bisa menentukan widget mana yang akan tampil di halaman tertentu. Ikuti langkah-langkah berikut ini:
Tutorial Blogger

Cara Menampilkan Widget Hanya di Halaman Tertentu

Mencari ID Widget

Sebelum lanjut ke langkah berikutnya, sobat harus mengetahui ID widget yang ingin ditampilkan pada halaman tertentu. Cara mencarinya sangat mudah:
    1. Jika sobat dalam kondisi login Blogger, sobat dapat langsung mengakses "quickedit" langsung dari halaman blog, quickedit adalah tool untuk mengedit widget secara langsung, letaknya biasanya adalah di bagian pojok kanan bawah widget, berupa ikon obeng dan kunci (screwdriver and wrench). Klik icon pada widget yang diinginkan dan akan muncul pop-up window dimana anda dapat mengedit konten widget.
    2. Atau akses editor widget melalui halaman "Layout", lalu klik link "edit" di salah satu bagian widget. Kemudian akan muncul pop-up window.
    3. Lihat di bagian URL/address di browser pada halaman pop up window tersebut. Letak ID widget berada di bagian akhir URL (geser URL ke kanan). Perhatikan contoh gambar berikut : 
    Cara Menampilkan Widget Hanya di Halaman Tertentu

    Memberikan Conditional Tags Pada Elemen Widget

    Untuk menampilkan widget di halaman tertentu, SOBAT harus menambahkan conditional tags (b if cond) pada elemen widget yang diinginkan. Berikut langkah menambahkannya sesuai dengan contoh widget yang sudah disampaikan di atas:

    Step 1 Masuk ke halaman template (Dashboard > Template)

    Step 2 Klik "Edit HTML" > Proceed.

    Step 3 Tekan CTRL+F, masukkan ID widget yang diinginkan yang sebelumnya telah dicari dan dipersiapkan.

    Dalam contoh ini saya akan menggunakan id widget "HTML2" sebagai contoh dan berikut kurang lebihnya elemen widget sobat :

    Cara Menampilkan Widget Hanya di Halaman Tertentu

    Step 4 Kemudian tambahkan conditional tag setelah <b:includable id='main'> dan tag penutupnya sebelum </b:includable>. Berikut conditional tags berdasarkan jenis halaman dan cara menambahkannya, perhatikan tag berwarna merah dan itulah yang harus ditambahkan:

    Cara Menampilkan Widget Hanya di Halaman Utama/Indeks (Homepage)
    <b:widget id='HTML2' locked='false' title='' type='HTML'>
    <b:includable id='main'>
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
    </b:if>
    <div class='widget-content'>
        <data:content/>
    </div>
    <b:include name='quickedit'/>
    </b:if>
    </b:includable>
    </b:widget>
    Cara Menampilkan Widget Hanya di Halaman Posting
    <b:widget id='HTML2' locked='false' title='' type='HTML'>
    <b:includable id='main'>
    <b:if cond='data:blog.pageType == "item"'>
    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
    </b:if>
    <div class='widget-content'>
        <data:content/>
    </div>
    <b:include name='quickedit'/>
    </b:if>
    </b:includable>
    </b:widget>
    Cara Menampilkan Widget Hanya di Halaman Statis
    <b:widget id='HTML2' locked='false' title='' type='HTML'>
    <b:includable id='main'>
    <b:if cond='data:blog.pageType != "static_page"'>
    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
    </b:if>
    <div class='widget-content'>
        <data:content/>
    </div>
    <b:include name='quickedit'/>
    </b:if>
    </b:includable>
    </b:widget>
    Cara Menampilkan Widget Hanya di Halaman Arsip (Archive)
    <b:widget id='HTML2' locked='false' title='' type='HTML'>
    <b:includable id='main'>
    <b:if cond='data:blog.pageType == "archive"'>
    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
    </b:if>
    <div class='widget-content'>
        <data:content/>
    </div>
    <b:include name='quickedit'/>
    </b:if>
    </b:includable>
    </b:widget>
    Cara Menampilkan Widget Hanya di Salah Satu Halaman (Berdasarkan URL)
    <b:widget id='HTML2' locked='false' title='' type='HTML'>
    <b:includable id='main'>
    <b:if cond='data:blog.url == "Ganti dengan URL Halaman di sini"'>
    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
    </b:if>
    <div class='widget-content'>
        <data:content/>
    </div>
    <b:include name='quickedit'/>
    </b:if>
    </b:includable>
    </b:widget>
    Step 5 Setelah conditional tags ditambahkan, save template.
    Jika sobat ingin Cara Menampilkan Widget Lainnya Hanya di Halaman Tertentu, maka ulangi langkah-langkah diatas.