About

Pages

Sabtu, 09 Januari 2010

Cara menampilkan judul postingan saja

Untuk memberikan kesan praktis, simpel dan rapi, maka saat kita membutuhkan postingan yang sesuai dengan kategori label, perlu ditampilkan judul postingannya terlebih dahulu.

Nah karena jika kita klik label di gadget blogger yang akan muncul semua tampilan positngan, sehingga perlu ada sedikit modifikasi pada kode HTMLnya,caranya:


1. Setelah login ke blogger kemudian masuklah ke Tata Letak
2. Selanjutnya klik edit HTML, jangan lupa centang pada Expand Widget Template
3. Tekan Ctrl+F lalu ketik kode : lalu tekan enter
4. Setelah ketemu, gantilah kode diatas dengan kode dibawah ini

5. Klik simpan template



Cara memasang image sebagai header di blog

namanya juga header, tentu berada pada posisi atas dari blog kita, bosan dengan tampilan standart? dan ingin menggantinya dengan suatu image yang menarik dan menjadi ciri khas dari blog kita? oke aa' ajarin caranya

Untuk memasang header, kita harus mengupload image di tempat penyimpanan gambar, cara mudahnya di Photobucket, yang belum ngerti baca disini aja.

Setelah mengupload file image di Photobucket (tapi bisa dimana saja sih), login ke blogspot dengan ID anda, klik Tata Letak, lalu menuju ke Edit HTML. Jangan lupa untuk mencentang box disamping Expand Template Widget.
Selanjutnya carilah teks seperti ini.








Selanjutnya gantilah tulisan yang berwarna
merah dengan alamat URL tempat anda menyimpan image di Photobucket.
Setiap template blog mungkin memiliki tempat dan menampilakan kode html yang berbeda-beda, terutama template yang bukan clasik. Untuk menemukan URL header adalah dengan Klik kanan pada Image header yang ingin diganti, kemudian klik Properties. Copy URL-nya dan cari dalam barisan kode HTML template.

Selanjutnya masukkan URL header yang sudah dicopy kearea yang terblok. klik Pratinjau untuk mengecek hasil perubahan yang telan anda lakukan, jika sudah terpasang sesuai yang diharapkan jangan lupa untuk klik Simpan Template.

MEMBUAT MENU DAN SUB MENU NAVIGASI HORISONTAL PADA BLOG

Sebelum membuat menu navigasi, sebaiknya kita terlebih dahulu membuat link yang akan mengarahkan menu-menu kita. Untuk blogger kita gunakan alamat posting sebagai link kita (kecuali kita ingin mebuat link ke situs tertentu dari menu). Demikian juga halnya dengan Sub Menu yang akan kita buat, persiapkan dulu link-linknya.
Sebagai contoh kita akan membuat menu denga skema sebagai berikut :

• TUTORIAL
- Tutorial Blogspot
- Tutorial Dreamweaver
- Tutorial Wordpress
- Tutorial PHP/HTML

• BISNIS ONLINE
- Adsense
- Reseller
- Pay To Clic
- Pay To Review

• LINKKU
- Blog Tutorial
- Iklan Gratis
- Solusi Finansial
- CPNS

Skema diatas yang dimaksud sebagai menu adalah : TUTORIAL, BISNIS ONLINE dan LINKKU, sedangkan Sub Menu adalah kategori yang berada di bawah menu seperti : Tutorial Blogspot, Adsense, Iklan Gratis dsb.

Pertama kali yang perlu kita persiapkan adalah membuat link terhadap menu dan sub menu tersebut, disini karena setiap menu telah memiliki sub menu, maka link dari menu bisa ditiadakan. Dalam pembuatan link dengan skema diatas terdapat dua bentuk link, yaitu link menggunakan fasilitas posting di blog dan link terhadap blog/situs/web lain.

Untuk membuat link menu dengan blog/web/situs lain (seperti pada menu LINKKU), kita hanya membutuhkan alamat (URL) blog/web/situs yang akan kita linkkan. Misalnya :

URL Sub Menu Automotif : http://mantpi-electronic.blogspot.com

URL Sub Menu Iklan HP : http://mantpi-hp.blogspot.com

URL Sub Menu steak : http://mantpi-steaks.blogspot.com

Sedangkan untuk membuat link yang mengarah pada blog kita sendiri misalnya blognya http://blogku.com, maka buat postingan dengan judul adsense yang akan memberikan alamat URL : http://blogku.com/2009/03/adsense.html. Keteranga http://blogku.com meupakan nama domain blog kita, 2009, adalah tahun posting, 03 merupakan bulan pada saat kita melakukan postingan sedangkan adsense.html, merupakan judul postingan (bernama adsense) kita.

Dengan begitu setiap sub menu dibuatkan alamat URL yang sesuai dengan alamat positngan yang akan kita sediakan.

Langkah Kedua adalah login terlebih dahulu pada ID blogger anda, pilih TATALETAK, lalu klik EDIT HTML. Jangan lupa centang Expand Template Widget, lalu letakkan kode CSS berikut tepat diatas kode ]]>< / script>

ul#main-nav {font-family:helvetica,arial,sans-serif;margin:0;padding:0;float:left;width:100%;font-size:0.9em;}

ul#main-nav li {margin:0;padding:0;list-style:none;float:left;margin:0 0.3em 0 0;width:9em;}

ul#main-nav li a {text-decoration:none;display:block;padding:0.3em 0.5em;border:1px solid silver;color:#003;background:#fff;}

ul#main-nav li a:hover, ul#main-nav li a:focus {border:1px solid gray;color:#000;background:#efefef;}

ul#main-nav li ul {padding:0;display:none;}

ul#main-nav li:hover ul {display:block;}

ul#main-nav li ul li {float:none;}

ul#main-nav li ul li a {font-size:0.9em;}




Langkah Ketiga


Setelah anda melakukan login dib logger dengan ID anda, pilih TATA LETAK selanjutnya klik ELEMEN HALAMAN, tambahkan Gadget JAVASCRIPT/HTML lalu copy paste kode HTML berikut ini.




 

Blogger news

Blogroll

About