Selamat Datang di InginTauSaja ~ Tempat Untuk Mencari Tau

Showing posts with label Blogging. Show all posts
Showing posts with label Blogging. Show all posts

Membuat 2 atau 3 Column Widget





Ikuti langkah-langkah berikut:



Cara menembahkan dua atau tiga kolom elemen halaman dibawah header:
1. Pada dasbor klik Template=> Edit HTML=> Cari kode berikut ]]></b:skin> jika sudah dapat, letakkan kode berikut diatasnya:
#box-main-container {
clear:both;
}
.box-column {
padding:0px 10px 10px 10px;
border:1px dotted $bordercolor;
}
Kalau sobat dah bisa ngedit CSS atau sedikit bisa membaca maksud perintahnya silahkan edit exp: padding, margin atau bordernya!
2. Kemudian cari kode<div id='main-wrapper'> 


jika tidak bisa cari yang ini:
<div id=’outer-wrapper’>
<div id=’header-wrapper’>
<b:section class=’header’ id=’header’ maxwidgets=’1′>
<b:widget id=’Header1′ locked=’true’ title=’NAMA BLOG ANDA’ type=’Header’/>
</b:section>
</div>
setelah dapat letakkan kode beikut diatasnya (untuk dua kolom dibawah header):


<div id='box-main-container'>
<div id='box1' style='width: 50%; float: left; margin:0; text-align: left;'>
<b:section class='box-column' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='box2' style='width: 50%; float: right; margin:0; text-align: left;'>
<b:section class='box-column' id='col2' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
</div>


Jika ingin tiga kolom dibawah header maka kode berikut yang sobat letakkan diatas kode 




<div id='box-main-container'></div>
<div id='box1' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='box-column' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='box2' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='box-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='box3' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='box-column' id='col3' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/> 
  




3. Simpan template dan lihat hasilnya dibagian elemen halaman, jika berhasil sobat akan melihat seperti screenshot diatas.
Apabila hasil kolom yang baru berada di atas posting atau dengan kata lain tidak sesuai harapan coba cyber mania taruh code diatas tadi di bawah code 


<div id='content-wrapper'&gt

dan lihat lagi hasilnya..

Semoga bermanfaat.



READ MORE - Membuat 2 atau 3 Column Widget

Cara Menampilkan Widget Pada Halaman Tertentu Saja




Pada kesempatan kali InginTauSaja akan men-share tentang bagaimana cara  menampilkan widget di halaman tertentu saja.
Mengapa harus di tampilkan di homepage atau di halaman posting saja? ? ? Selain untuk merapihkan letak-letak widget kita agar enak di lihat oleh pengunjung, trik ini juga termasuk salah satu trik menjadikan blog SEO Friendly yg mana widget yg tidak perlu di tampilkan pada halaman posting kita tempatkan pada homepage blog kita, atau di halaman lain yg kita inginkan seperti widget follower,chatbox dll.
Untuk melakukannya silahkan ikuti petunjuk dengan baik .
  1. Login ke dashboard blogger.
  2. pilih Rancangan »» edit HTML
  3. Beri tanda centang pada tulisan Expand Template Widget
  4. Lalu cari kode widget yg akan di tampilkan pada halaman tertentu.
    Caranya cari nama judul pada widget tersebut menggunakan tombol ctrl+F
    untuk mempermudah pencarian kode widget, sebaiknya widget yg akan di edit di beri judul dulu.
    Untuk contohnya InginTauSaja akan mengedit dan menampilkan widget Random Post hanya pada halaman posting saja dengan judul widget bernama Random Post.contohnya

    <b:widget id='HTML1' locked='false' title='Random Post' type='HTML'>
    <b:includable id='main'>
    <!-- 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:includable>
    </b:widget>
    Kode di atas akan menampilkan widget di semua halaman. Nah. . . . kalau ingin menampilkan widget tersebut di halaman posting saja maka harus di tambahi kode berikut »»
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    ................,.........................................,...............................
    </b:if>

    Dan nantinya akan menjadi seperti ini.
    <b:widget id='HTML1' locked='false' title='Random Post' type='HTML'> <b:includable id='main'>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <!-- 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:if>
    <b:include name='quickedit'/>
    </b:includable>
    </b:widget>
    Dari kode diatas yg sudah di edit, hanya akan muncul di halaman posting saja dan tidak akan muncul di homepage.
Nah untuk menampilkan widget pada halaman-halaman yg di inginkan, misal pada homepage saja, pada staticpage saja, pada halaman archive saja dan pada halaman index saja berikut kode-kode yg bisa anda pakai, tinggal ganti kode yg berwarna ungu dg salah satu kode di bawah ini.
    • Menampilkan widget hanya pada halaman depan saja (homepage).
      <b:if cond='data:blog.url == data:blog.homepageUrl'>
      ......................................................
      </b:if>
    • Menampilkan di semua halaman kecuali homepage.
      <b:if cond='data:blog.url != data:blog.homepageUrl'>
      ......................................................
      </b:if>
    • Menampilkan widget hanya pada halaman Archive saja.
      <b:if cond='data:blog.pageType == &quot;archive&quot;'>
      ......................................................
      </b:if>
    • Menampilkan widget di semua halaman kecuali halaman archive.
      <b:if cond='data:blog.pageType != &quot;archive&quot;'>
      ......................................................
      </b:if>
    • Menampilkan widget hanya di halaman posting.
      <b:if cond='data:blog.pageType == &quot;item&quot;'>
      ......................................................
      </b:if>
    • Menampilkan widget di semua halaman, kecuali halaman posting.
      <b:if cond='data:blog.pageType != &quot;item&quot;'>
      ......................................................
      </b:if>
    • Menampilkan widget hanya pada halaman staticpages.
      <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
      ......................................................
      </b:if>
    • Menampilkan widget di semua halaman,kecuali halaman staticpages.
      <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
      ......................................................
      </b:if>
    • Menampilkan widget hanya pada postingan tertentu saja.
      <b:if cond='data:blog.pageType == &quot;alamat-postingan&quot;'>
      ......................................................
      </b:if>
    • Menampilkan widget selain di postingan tertentu.
      <b:if cond='data:blog.pageType != &quot;alamat-postingan&quot;'>
      ......................................................
      </b:if>
READ MORE - Cara Menampilkan Widget Pada Halaman Tertentu Saja

 
 
 

Dapatkan update terbaru kami, klik suka / like dibawah

Followers

My Ping in TotalPing.com
Free Automatic Backlink