Rahasia muncul dan hilangnya widget di blogger

Trik

Trik ini di gunakan untuk tujuan tertentu, menghilangkan atau memunculka widget sebagai mana mestinya atau lebih tepat fungsinya. misalkan di halaman depan blog ini sudah ada daftar posting update terbaru, jadi untuk widget recent post lebih cocok di munculkan hanya pada halaman posting saja. trik ini juga bisa di gunakan untuk membuat halaman atau postingan tanpa widget. untuk caranya simak di bawah ini:

1. login ke akun blogger.com sobat
2. pilih templat
3. cari kode widget yang ingin sobat hilangkan

Contoh: saya ingin memunculkan widget populer post hanya di halaman posting saja, berikut kodenya:

<b:widget id='PopularPosts1' locked='false' title='5 Artikel Populer' type='PopularPosts'>

<b:includable id='main'>

  <b:if cond='data:title'><h2><data:title/></h2></b:if>

  <div class='widget-content popular-posts'>

    <ul>

      <b:loop values='data:posts' var='post'>

      <li>

        <b:if cond='data:showThumbnails == &quot;false&quot;'>

          <b:if cond='data:showSnippets == &quot;false&quot;'>

            <!-- (1) No snippet/thumbnail -->

            <a expr:href='data:post.href'><data:post.title/></a>

          <b:else/>

            <!-- (2) Show only snippets -->

            <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>

            <div class='item-snippet'><data:post.snippet/></div>

          </b:if>

        <b:else/>

          <b:if cond='data:showSnippets == &quot;false&quot;'>

            <!-- (3) Show only thumbnails -->

            <div class='item-thumbnail-only'>

              <b:if cond='data:post.thumbnail'>

                <div class='item-thumbnail'>

                  <a expr:href='data:post.href' target='_blank'>

                    <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>

                  </a>

                </div>

              </b:if>

              <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>

            </div>

            <div style='clear: both;'/>

          <b:else/>

            <!-- (4) Show snippets and thumbnails -->

            <div class='item-content'>

              <b:if cond='data:post.thumbnail'>

                <div class='item-thumbnail'>

                  <a expr:href='data:post.href' target='_blank'>

                    <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>

                  </a>

                </div>

              </b:if>

              <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>

              <div class='item-snippet'><data:post.snippet/></div>

            </div>

            <div style='clear: both;'/>

          </b:if>

        </b:if>

      </li>

      </b:loop>

    </ul>

    <b:include name='quickedit'/>

  </div>

</b:includable>

</b:widget>

</b:section>
kode di atas kode awal, lalu saya tambahkan kode di bawah ini:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
 setelah kode <b:includable id='main'> dan tag penutupnya </b:if> di atas kode
</b:includable>
maka akan menjadi

<b:widget id='PopularPosts1' locked='false' title='5 Artikel Populer' type='PopularPosts'>

<b:includable id='main'>

<b:if cond='data:blog.pageType == &quot;item&quot;'> 

  <b:if cond='data:title'><h2><data:title/></h2></b:if>

  <div class='widget-content popular-posts'>

    <ul>

      <b:loop values='data:posts' var='post'>

      <li>

        <b:if cond='data:showThumbnails == &quot;false&quot;'>

          <b:if cond='data:showSnippets == &quot;false&quot;'>

            <!-- (1) No snippet/thumbnail -->

            <a expr:href='data:post.href'><data:post.title/></a>

          <b:else/>

            <!-- (2) Show only snippets -->

            <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>

            <div class='item-snippet'><data:post.snippet/></div>

          </b:if>

        <b:else/>

          <b:if cond='data:showSnippets == &quot;false&quot;'>

            <!-- (3) Show only thumbnails -->

            <div class='item-thumbnail-only'>

              <b:if cond='data:post.thumbnail'>

                <div class='item-thumbnail'>

                  <a expr:href='data:post.href' target='_blank'>

                   
 <img alt='' border='0' expr:height='data:thumbnailSize' 
expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>

                  </a>

                </div>

              </b:if>

              <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>

            </div>

            <div style='clear: both;'/>

          <b:else/>

            <!-- (4) Show snippets and thumbnails -->

            <div class='item-content'>

              <b:if cond='data:post.thumbnail'>

                <div class='item-thumbnail'>

                  <a expr:href='data:post.href' target='_blank'>

                   
 <img alt='' border='0' expr:height='data:thumbnailSize' 
expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>

                  </a>

                </div>

              </b:if>

              <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>

              <div class='item-snippet'><data:post.snippet/></div>

            </div>

            <div style='clear: both;'/>

          </b:if>

        </b:if>

      </li>

      </b:loop>

    </ul>

    <b:include name='quickedit'/>

  </div>

 </b:if>

</b:includable>

</b:widget>

</b:section>

4. save atau simpan perubahan.

Berikut ini adala kode yang bisa anda gunakan untuk trik menyembunyikan dan memunculkan widget 


1. cara menampilkan widget hanya pada Homepage saja
<b:if cond='data:blog.url == data:blog.homepageUrl'>
KODE WIDGET ANDA DISINI 
</b:if>
2. Bagaimana cara menyembunyikan widget dari halaman Homepage
<b:if cond='data:blog.pageType == "item"'>
KODE WIDGET ANDA DISINI
</b:if>
3. Bagaimana cara menampilkan widget hanya pada halaman Static Page
<b:if cond='data:blog.pageType == "static_page"'>
KODE WIDGET ANDA DISINI
</b:if>
4. Bagaimana cara menyembunyikan widget dari halaman Static Page
<b:if cond='data:blog.pageType != "static_page"'>
KODE WIDGET ANDA DISINI
</b:if>
5. Bagaimana cara menampilkan widget hanya pada URL tertentu saja
<b:if cond='data:blog.url == "URL Pilihan Anda disini"'>
KODE WIDGET ANDA DISINI
</b:if>
6. Bagaimana cara menyembunyikan widget dari URL tertentu
<b:if cond='data:blog.url != "URL Pilihan Anda disini"'>
KODE WIDGET ANDA DISINI
</b:if>
7. Kode ini hanya akan menampilkan widget pada Archive Page atau halaman arsip
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
KODE WIDGET ANDA DISINI
</b:if>
8. Kode ini hanya akan menampilkan widget selain halaman Archive Page
<b:if cond='data:blog.pageType != &quot;archive&quot;'>
KODE WIDGET ANDA DISINI
</b:if>
9. Kode ini hanya akan menampikan widget pada halaman postingan saja
<b:if cond='data:blog.pageType == &quot;item&quot;'>
KODE WIDGET ANDA DISINI
</b:if>
10. Kode ini hanya akan menampikan widget selain halaman posting
<b:if cond='data:blog.pageType != &quot;item&quot;'>
KODE WIDGET ANDA DISINI
</b:if>
11. Kode ini hanya akan menampilkan widget pada halaman static page
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
KODE WIDGET ANDA DISINI
</b:if>
12. Kode ini hanya akan menampilkan widget selain halaman static page
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
KODE WIDGET ANDA DISINI
</b:if>
13. Kode ini hanya akan menampikan widget  pada postingan tertentu
<b:if cond='data:blog.url == &quot;alamatpostingan&quot;'>
KODE WIDGET ANDA DISINI
</b:if>
14. Kode ini hanya akan menampilkan widget selain postingan tertentu
<b:if cond='data:blog.url != &quot;alamaatpostingan&quot;'>
KODE WIDGET ANDA DISINI
</b:if>

Semoga berguna...

Artikel Terkait

  • Cara membuat judul header untuk tag pre
    Selamat malam sobat blogger kali ini saya mau berbagi tentang cara dan trik membuat judul pada tag pre demo lihat blog ini, biar blognya tambah keren dan terlihat bagus. untuk demo dan hasilnya silahkan lihat di blog ini. cara dan langkahnya cukup mudah silahkan saja ikuti trik di bawah ini. pertama silahkan buka editor template blogger sobat…
  • Pencarian dengan tombol bersihkan
    Salah satu yang membuat blog kita menjadi user friendly adalah dengan adanya kotak pencarian, Kotak pencarian ini sangat penting untuk memudahkan pengunjung menjelajahi blog Anda atau mencari artikel lainnya di blog Anda. Fungsi kotak pencarian untuk saya sendiri adalah untuk mempermudah mencari posting yang akan saya tambahkan sebagai link i…
  • Breadcrumb Microdata valid HTML5
    Fungsi dari breadcrumb pada blog adalah untuk mengetahui sedang dihalaman mana sekarang pengunjung berada. Dengan breadcrumb, maka urusan navigasi link bisa lebih mudah. Selain itu, breadcrumb juga sangat baik untuk SEO blog karena memperkaya kata kunci dalam postingan. Hal ini terbukti dari beberapa postingan blog sesepuh seperti, kang ismet,…
  • Cara membuat penomoran otomatis pada tag pre
     Setelah sebelumnya saya share cara membuat header judul pada tag pre kali ini saya mau berbagi tentang cara bagaiman memberi urutan nomor pada tag pre yang bisa langsung hanya dengan menambahkan css saja dan sedikit penambahan kode html pada elemen tag pre. untuk bagaimana hasilnya silahkan di lihat di blog ini. langsung ke topik pembah…
  • Membuat show hide konversi kode dan emoticon
    Salam buat agan agin sobat blogger yang suka utak atik template, kali ini saya mau share cara membuat show hide konversi kode dan emoticon pada komentar blogger bagi anda yang sedang mencari trik ini silahkan saja untuk di simak. pertama buka editor template blogger lalu tambahkan css di bawah ini .box-konvert-kode-db { width:100%; …
  • Membatasi jumlah posting di halamam label
    Seringkali terkadang jumlah posting yang muncul di halaman search label blogger melebihi jumlah yang sudah kita terapkan di pengaturan dasar, ketik kita telah mengatur jumlah posting yang muncul di halaman beranda blogger dengan jumlah maksimal misalkan sepuluh posting maka poating yang akan muncul di halaman label akan tetap berada di jumlah…

Tidak ada komentar :

Kode klik emo: :) :( =( :wa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :ya: :'( T_T :\ :p B) :Q :Ozz 7:( \o/ **p

Link aktif dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan kode, gunakan tag <i rel="code">...KODE ANDA DI SINI...</i>
Untuk menyisipkan script, gunakan <i rel="pre">...KODE SCRIPT ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">...URL GAMBAR ANDA ...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">...JUDUL ANDA...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">...CATATAN ANDA...</b>
Untuk menciptakan efek tebal gunakan tag <b>...TEKS ANDA...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>...TEKS ANDA...</i>

Konversi KodeOOT

Back to Top
Loading...