Cara membuat link senggol

1. Login ke blogger dengan ID anda.
2. Klik Rancangan.
3. Dan KLik tab Edit HTML.

4. Cari kode di bawah ini atau yang mirip dengan kode ini :

</head>

5. Copy kode di bawah ini dan taruh sebelum kode </head> :

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
//<![CDATA[

$(document).ready(function()
{
 slide("#sliding-navigation", 25, 15, 150, .8);
});

function slide(navigation_id, pad_out, pad_in, time, multiplier)
{
 // creates the target paths
 var list_elements = navigation_id + " li.sliding-element";
 var link_elements = list_elements + " a";
 
 // initiates the timer used for the sliding animation
 var timer = 0;
 
 // creates the slide animation for all list elements
 $(list_elements).each(function(i)
 {
  // margin left = - ([width of element] + [total vertical padding of element])
  $(this).css("margin-left","-180px");
  // updates timer
  timer = (timer*multiplier + time);
  $(this).animate({ marginLeft: "0" }, timer);
  $(this).animate({ marginLeft: "15px" }, timer);
  $(this).animate({ marginLeft: "0" }, timer);
 });

 // creates the hover-slide effect for all link elements  
 $(link_elements).each(function(i)
 {
  $(this).hover(
  function()
  {
   $(this).animate({ paddingLeft: pad_out }, 150);
  }, 
  function()
  {
   $(this).animate({ paddingLeft: pad_in }, 150);
  });
 });
}

//]]>
</script>

<style type="text/css">
ul.listpanah {list-style-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjG-48_ZllhbC_P5FzqFIZWZ9c-sPtHt9DGNSWQw6x0c5MRo_AjcfLXwoUFocNsQ4toQH7toMvOoRRVY3QoLEtP03RmLbugXWgkAUtRbYL6TuafkoVZnO1xTZvLH58SdlSkC7wqQO9V146-/s12/List+6.jpg');}

a:link {color:#000;text-decoration:none;}
a:visited {color:#000;text-decoration:none;}
a:hover {color:#669CFF;text-decoration:none;}
</style>

Langkah selanjutnya anda tinggal menampilkan Link senggol tersebut pada sidebar blog anda. Berarti anda tinggal menambah gadget. Perhatikan langkah berikut :

1. Klik Rancangan dan pilih Elemen Laman

2. Tambah Gadget

                                       
3. Pada jendela baru anda Anda pilih gadget HTML/JavaScript

                                                              
4. Copy dan paste kode dibawah ini pada gadget tersebut :

<div class  id="sliding-navigation">  
<ul class="listpanah">
  
<li class="sliding-element"><a href="GANTI ULR"target="_blank">JUDUL   1</a></li> 
<li class="sliding-element"><a href="GANTI ULR"target="_blank">JUDUL  2</a></li>
<li class="sliding-element"><a href="GANTI ULR"target="_blank">JUDUL   3</a></li> 
<li class="sliding-element"><a href="GANTI ULR"target="_blank">JUDUL   4</a></li> 
<li class="sliding-element"><a href="GANTI ULR"target="_blank">JUDUL   5</a></li>
<li class="sliding-element"><a href="GANTI ULR"target="_blank">JUDUL   6</a></li>
<li class="sliding-element"><a href="GANTI ULR"target="_blank">JUDUL   7</a></li>
<li class="sliding-element"><a href="GANTI ULR"target="_blank">JUDUL   8</a></li>
<li class="sliding-element"><a href="GANTI ULR"target="_blank">JUDUL   9</a></li>
<li class="sliding-element"><a href="GANTI ULR"target="_blank">JUDUL 10</a></li>
 
</ul></div>

Ok...., Selamat mencoba dan Semoga bermanfaat....

cara pasang icon yahoo Messenger

Untuk membuat simbol Yahoo Messenger di blogger yang menunjukkan status anda dan pengunjung bisa langsung chat dgn anda, langkah-langkahnya adalah sebagai berikut:
1. Langka Pertama masuk klik Layout
2. Klik edit HTML
3. Kemudian add widget
4. Pilih edit HTML menu
5. Silahkan copy salah satu kode berikut

a.Contoh 1

<a href="ymsgr:sendIM?your id"><img src="http://yuor ID&m=g&t=0 border="0 /> </a>

b.Contoh 2

<a href="ymsgr:sendIM?yuor Id"><img border="0" src="http://id YAHOO mu&m=g&t=2"/></a>

c.Contoh 3

<a href="ymsgr:your ID"><img src="http://oalamt yahoo loe&m=g&t=2 border="0 /> </a><br />

6. save setting
Selesai selamat mencoba!!GOOD LUCK

cara membuat menu multi kolom

Membuat menu multi kolom disini maksudnya membuat lebih dari satu menu dalam satu kolom, ini berguna sekali untuk menghemat space blog anda yang sudah memiliki menu yang banyak seperti ini:

Langkah-langkah untuk membuat menu multi kolom silahkah ikuti seperti dibawah ini:
1. Login ke blogger anda
2. Layout-->Edit HTML
3. Kemudian cari kode ]]></b:skin>
4. Masukan kode dibawah ini sebelum kode diatas

div.TabView div.Tabs
{
height: 24px;
overflow: hidden;
}
div.TabView div.Tabs a
{
float: left;
display: block;
width: 90px; text-align: center;
height: 24px;
padding-top: 3px;
vertical-align: middle;
border: 1px solid #000;
border-bottom-width: 0;
text-decoration: none;
font-family: "Times New Roman", Serif;
font-weight: 900;
color: #000;
}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
{
background-color: #FF9900;
}
div.TabView div.Pages
{
clear: both;
border: 1px solid #6E6E6E;
overflow: hidden;
background-color: #FF9900;
}
div.TabView div.Pages div.Page
{
height: 100%;
padding: 0px;
overflow: hidden;
}
div.TabView div.Pages div.Page div.Pad
{
padding: 3px 5px;
}

Keterangan :

- Angka yang berwarna merah-->lebar kotak menu utama
- Angka yang berwarna biru--> tinggi kotak menu utama
- Kode yang berwarna hijau--> warna border menu utama
- Kode yang berwarna ungu-->warna Font menu utama
- Kode yang berwarna abu-abu-->Warna background menu utama
- Kode yang berwarna kuning-->Warna border kotak utama
- Kode yang berwana orange-->warna background kotak utama


5. Silahkan masukkan kode dibawah ini sebelum kode </head>

<script src='http://superinhost.com/trikblog/tabview.js' type='text/javascript'/>

6. Kemudian Save

Kemudian ke menu Layout-->Page Elements-->pilih Add Gadget yang akan kamu tempatkan menu multi kolom ini-->HTML/Javascript

Silahkan masukkan script menu multi kolom dibawah ini:

<form action="tabview.html" method="get">
<div class="TabView" id="TabView">
<div class="Tabs" style="width: 350px;">
<a>Title menu 1</a>
<a>Title menu 2</a>
<a>Title menu 3</a>
</div>
<div class="Pages" style="width: 350px; height: 250px;">

<div class="Page">
<div class="Pad">
Link 1 di menu 1 <br />
Link 2 di menu 1 <br />
Link 3 d1 menu 1 <br />
</div>
</div>

<div class="Page">
<div class="Pad">
Link 1 di menu 2 <br />
Link 2 di menu 2 <br />
Link 3 d1 menu 2 <br />
</div>
</div>

<div class="Page">
<div class="Pad">
Link 1 di menu 3 <br />
Link 2 di menu 3 <br />
Link 3 d1 menu 3 <br />
</div>
</div>

</div>
</div>
</form>

<script type="text/javascript">
tabview_initialize('TabView');
</script>

Silahkan dicoba,,semoga berhasil!!!
Keterangan
- kode yang berwarna hijau adalah title menu anda
- kode yang berwarna biru adalah lebar dan tinggi menu multi kolom
- kode yang berwarna merah adalah isi dari menu anda

Cara pasang read more

Untuk membuat Read More agar tidak memakan tempat,supaya artikel yang tampil lebih pendek ikuti langkah – langkah berikut:

1. Sign in di blogger anda dengan->Setting->Formatting

2.Pada layar paling bawah, ada text area kosong disamping tulisan Post Template, isi text area kosong tersebut dengan kode di bawah ini :

<div class="fullpost">

</div>

 3. Klik tombol yang bertuliskan Save Settings

Pemasangan kode ini supaya pada saat posting artikel, kode tersebut langsung muncul tanpa harus menuliskan terlebih dahulu ditext area saat posting

Langkah selanjutnya yaitu menambahkan kode pada template, silahkan ikuti langkah berikut :


1. Klik menu Dasboard->Layout->Edit HTML


2. Klik tulisan Download Full Template


Silahkan save dulu template tersebut, untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula dgn upload lagi data tersebut


3. Jangan lupa beri tanda centang pada kotak di samping tulisan "Expand Widget Template"


4. Silahkan anda cari kode berikut pada kode template milik sobat :

<div class='post-header-line-1'/>
<div class='post-body'>

atau

<div class='post-header-line-1'/>
<div class='post-body entry-content'>

5. Copy kode HTML di bawah ini kemudian paste di bawah kode diatas

<b:if cond='data:blog.pageType == "item"'>

<style>.fullpost{display:inline;} </style>

<p><data:post.body/></p>

<b:else/>

<style>.fullpost{display:none;} </style>

6. Kemudian lihat kebagian bawah sehingga terlihat kode berikut ini :

<p><data:post.body/></p>

7. Copy kode HTML di bawah ini kemudian paste di bawah kode tadi

<a expr:href='data:post.url'>Read More......


</b:if>

anda bisa mengganti kata Read More pada kode ini sesuai keinginan anda

8. klik tombol bertuliskan Save Template

9. Selesai,

 Cara Posting Artikel nya


1. Klik menu Posting->jangan lupa tulis posting di Edit HTML bukan di Compose karena kode dibawah ini tidak akan muncul di halamana compose

Secara otomatis akan timbul kode seperti ini

<div class="fullpost">



</div>

2. Tulisankan artikel yang ingin tampak pada blog sebelum kode dibawah ini

<div class="fullpost">

3. Tulis keseluruhan sisa artikel sesudah kode di atas tadi dan sebelum kode dibawah ini :

</div>

4. Klik tombol PUBLISH POST->Silakan lihat blog anda,,


Untung postingan yang anda buat sebelum pasang read more silakan edit dan tambahkan kode dibawah ini secara manual dengan format dibawah ini

Artikel yang ingin tampil dipostingan

<div class="fullpost">

Sisa Artikel anda

</div>

warna merah adalah kode yang harus anda tambahkan dipostingan yang sedang anda edit



Selamat mencoba!!! semoga berhasil :z

Cara memasang search engine

Selain label, untuk mempercepat pencarian kategori yang kita inginkan maka dipasang search engine untuk blog anda,caranya sebagai berikut:

1.Login ke blog anda ->Layout->add gadget
2.Pilih HTML/Javascript
3.Masukkan kode berikut

<form id="searchform" action="http://AlamatBlogAnda.blogspot.com/search" name="searchform" method="get"> <br /><input id="s" value="" name="q" type="text"> <input id="searchsubmit" value="Search" type="submit"> </form>

4.Ganti tulisan AlamatBlogAnda dengan URL atau alamat blog anda
5.Kemudian Save Setting
6.Preview dan lihat hasil kerja anda ...GOOD Luck...