Hot Todays

Pasang (Navigasi) Breadcrumb di Blog Blogspot

Salam blogger, peernah lihat navigasi situs berupa label - label yang berjajar di awali dari home, dan terletak di atas judul posting, kali ini saya akan menjelaskan tentang navigasi situs tersebut.


oke, begini cara membuat navigasi breadcrumb-nya :
  • Login ke Blogger. 
  • Langsung tuju Edit HTML. 
  • Klik Expand Template Widget. 
Letakkan kode berikut ini tepat sebelum kode ]]></b:skin> 

.breadcrumbs{
padding:5px 5px 5px 0;
margin:0;font-size:95%;
line-height:1.4em;
border-bottom:4px double #cadaef}
  • kemudian, cari kode seperti ini :
<div class='post hentry uncustomized-post-template'> 
  • kalau tidak ada coba cari code yang mirip seperti <div class='post hentry> 
  • Letakkan kode berikut ini tepat di bawah kode <div class='post hentry uncustomized-post-template'> atau  <div class='post hentry> tergantung templatenya.  
<b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='breadcrumbs'> Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187; <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'><data:label.name/></a> <b:if cond='data:label.isLast != &quot;true&quot;'> , </b:if> </b:loop> </b:if> &#187; <data:post.title/> </div> </b:if> </b:if> 
  • sekarang simpan templatenya.
  • have fun 

Cara Membuat Scroll Pada Label

Salam Blogger semua, pastinya sobat blogger sudah tidak asing lagi dengan widget bawaan Blogspot yang satu ini yaitu Label , tetapi widget yang satu ini, biasanya akan memanjang jika Label terlalu banyak. namun jangan khawatir, karena dengan fungsi scrool semua akan tampak rapi seperti pada Blog archive yang pernah saya share, dan tidak memakan tempat tentunya. langsung saja :

  • Dari halaman dasbor, klik Tata Letak - Edit HTML.
  • Beri tanda centrang pada Expand Template Widget.
  • Kemudian cari kode type='Label' (gunakan Control F atau F3).
  • Perhatikan kode yang ada di bawahnya, seperti ini:
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
Tambahkan perintah style='overflow:auto; height:200px' pada kode yang berwarna biru, sehingga menjadi seperti ini:

<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content' style='overflow:auto; height:200px'>
  • Atur ukuran tinggi (height)-nya sesuai kebutuhan.
  • Simpan hasil editing ini.
Have fun sobat..

Cara Membuat Posting Tampil Hanya Judulnya Saja

Salam Blogger, pasti pernah lihat kan ada blog yang hanya menampilkan judul postingnya saja pada halaman depan blognya, seperti blognya kang rohman, nah kaliini saya mau berbagi cara Membuat Posting Tampil Hanya Judulnya Saja pada halaman depan blogspot. Langsung saja :
  • Dari halaman dasbor, klik Tata Letak - Edit HTML.
  • Beri tanda centrang pada Expand Template Widget.
  • Kemudian cari kode ]]></b:skin> (gunakan Control F atau F3).
  • Copy kode berikut, lalu paste di bawah kode ]]></b:skin>
<style type='text/css'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
.post-body{display:none;}
</b:if>
</b:if>
</style>
  • Klik tombol SIMPAN TEMPLATE. 
  • Selesai. Silahkan lihat hasilnya.
namun, dengan memasang kode diatas masih menyisakan beberapa elemen seperti tanggal posting, komentar dan yang lainnya. Jika sobat ingin menghilangkan semuanya dan yang tersisa hanya judul post nya saja, anda bisa menggunakan kode berikut :

<style type='text/css'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
.post-body, .post-footer, .jump-link,
.post-timestamp, .reaction-buttons,
.star-ratings, .post-backlinks,
.post-icons, .date-header{display:none;}
</b:if>
</b:if>
</style>

Have fun..

Cara Membuat Scroll Pada Blog Archive

 Salam Blogger semua, pastinya sobat blogger sudah tidak asing lagi dengan widget bawaan Blogspot yang satu ini yaitu Blog Archive , tetapi widget yang satu ini, biasanya akan memanjang jika kita post banyak pada satu bulan. namun jangan khawatir, karena dengan fungsi scrool semua akan tampak rapi, dan tidak memakan tempat tentunya. langsung saja :
  • Dari halaman dasbor, klik Tata Letak - Edit HTML.
  • Beri tanda centrang pada Expand Template Widget.
  • Kemudian cari kode type='BlogArchive' (gunakan Control F atau F3).
  • Perhatikan kode yang ada di bawahnya, seperti ini:
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div id='ArchiveList'>
  • Tambahkan perintah style='overflow:auto; height:200px' pada kode yang berwarna biru, sehingga menjadi seperti ini:
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content' style='overflow:auto; height:200px'>
<div id='ArchiveList'>

  • Atur ukuran tinggi (height)-nya sesuai kebutuhan.
  • Simpan hasil editing ini
Have fun..

Advertisements

Advertisements