Cara Memasang Widget Jam di Blog

Setelah kemarin Blogaul mengulas beberapa artikel seputar cara-cara mendesain dan menghias blog, diantaranya artikel cara membuat like box facebook di blog, cara memberi burung twitter terbang di blog dan masih banyak lagi, maka kali ini saya kembali posting dengan judul cara memasang widget jam di blog. Widget jam merupakan widget yang sering dipakai oleh para blogger untuk menghias blog nya karena widget jam ini selain untuk mempercantik blog juga bisa menambah nilai dari blog itu sendiri karena dengan memasang widget jam ini akan membuat setiap visitor dapat melihat waktu saat ini sehingga mereka bisa mengontrol aktivitas mereka. Sebenarnya memasang widget jam cukup memberatkan blog apabila kita sudah memasang banyak widget di blog kita, tapi kalau baru sedikit widget juga tidak masalah. Apakah sobat tertarik untuk memasang widget jam tersebut? Bila tertarik untuk memasangnya, silahkan ikuti tutorial berikut:

1. Masuk ke situs penyedia jam, saya kasih contoh clocklink.com, silahkan masuk DISINI.
2. Setelah sobat sampai di situs tersebut, silahkan sobat lihat bagian sidebar sebelah kiri situs tersebut. Disitu ada beberapa pilihan aneka jenis jam yang bisa sobat pilih. Misal analog, digital, animal dan lain-lain. Silahkan sobat pilih sesuai keinginan sobat.
3. Setelah sobat pilih, maka akan muncul aneka bentuk jam yang bisa dipilih.
4. Setelah sobat memilih salah satu jam, maka selanjutnya klik View HTML Tag di bawah gambar jam yang sobat suka.
5. Maka akan terbuka halaman baru persetujuan, klik Accept untuk mendapatkan kodenya.
6. Atur kode area berdasarkan area di daerah sobat.
7. Setelah itu sobat akan mendapatkan kode html dari jam tersebut, copy saja.

Lantas, bagaimana cara memasang widget jam ini di blog kita? Berikut caranya:
1. Masuk dashbor blog sobat.
2. Klik Tata Letak.
3. Klik add gadget/tambah gadget di sidebar dimana sobat akan menempatkan jam tersebut.
4. Pilih HTML/Java Script.
5. Copast kode html jam tadi di kotak baru tersebut lalu klik simpan.
6. Silahkan lihat blog sobat.
Akhirnya selesai juga tutorial mengenai cara memasang widget jam di blog kita. Semoga bermanfaat untuk semua.

Kumpulan Html Kursor blog

di bawah ini beberapa html kursor yang mungkin agan dan sista sukai
langsung aja

1.
<style type="text/css">body, a:hover {cursor: url(http://www.funutilities.com/files/cursors/7/7962/appstarting.gif), progress !important;}</style><a href="http://situsalfi.blogspot.com/2012/11/kumpulan-cursor-untuk-blog.html" target="_blank" title="Boat"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Dari : Situs Alfi" style="position:absolute; top: 0px; right: 0px;" /></a>

2.
<style type="text/css">body, a:hover {cursor: url(http://www.funutilities.com/files/cursors/B/E5D76CBF1E4EF814EA8C775FA61588C/appstarting.gif), progress !important;}</style><a href="http://situsalfi.blogspot.com/2012/11/kumpulan-cursor-untuk-blog.html" target="_blank" title="Boat"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Dari : Situs Alfi" style="position:absolute; top: 0px; right: 0px;" /></a>

3.
<style type="text/css">body, a:hover {cursor: url(http://www.funutilities.com/Files/Cursors/01/92E3D6A9EB667762A16BE7C643F3820A/appstarting.gif), progress !important;}</style><a href="" target="_blank" title="Boat"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Dari : Situs Alfi" style="position:absolute; top: 0px; right: 0px;" /></a>

4.
<style type="text/css">body, a:hover {cursor: url(http://www.funutilities.com/files/cursors/3/22D8166DB7B9303F2DD3DA0AE5C44B5/arrow.gif), progress !important;}</style><a href="http://situsalfi.blogspot.com/2012/11/kumpulan-cursor-untuk-blog.html" target="_blank" title="Boat"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Dari : Situs Alfi" style="position:absolute; top: 0px; right: 0px;" /></a>

5.
<style type="text/css">body, a:hover {cursor: url(http://www.funutilities.com/files/cursors/6/6447/wait.gif), progress !important;}</style><a href="http://situsalfi.blogspot.com/2012/11/kumpulan-cursor-untuk-blog.html" target="_blank" title="Boat"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Dari : Situs Alfi" style="position:absolute; top: 0px; right: 0px;" /></a>

6.
<style type="text/css">body, a:hover {cursor: url(http://www.funutilities.com/files/cursors/2/D5C528739F2D5E0E662F67D089D166D/arrow.gif), progress !important;}</style><a href="http://situsalfi.blogspot.com/2012/11/kumpulan-cursor-untuk-blog.html" target="_blank" title="Boat"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Dari : Situs Alfi" style="position:absolute; top: 0px; right: 0px;" /></a>

7.
<style type="text/css">body, a:hover {cursor: url(http://www.funutilities.com/files/cursors/4/E09EEC12E68326A8C61B555E4C0584D/arrow.gif), progress !important;}</style><a href="http://situsalfi.blogspot.com/2012/11/kumpulan-cursor-untuk-blog.html" target="_blank" title="Boat"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Dari : Situs Alfi" style="position:absolute; top: 0px; right: 0px;" /></a>/

8.
<style type="text/css">body, a:hover {cursor: url(http://www.funutilities.com/files/cursors/D/089D0A0FA1AC7832D76643F0EC81C1A/arrow.gif), progress !important;}</style><a href="http://situsalfi.blogspot.com/2012/11/kumpulan-cursor-untuk-blog.html" target="_blank" title="Boat"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Dari : Situs Alfi" style="position:absolute; top: 0px; right: 0px;" /></a>

9.
<style type="text/css">body, a:hover {cursor: url(http://www.funutilities.com/files/cursors/9/9FADE529199C61FF0CEA656CC42C0DB/wait.gif), progress !important;}</style><a href="" target="_blank" title="Boat"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Dari : Situs Alfi" style="position:absolute; top: 0px; right: 0px;" /></a>

10.
<style type="text/css">body, a:hover {cursor: url(http://www.funutilities.com/files/cursors/8/40608D92D3320CD3F6C92F3C9E5C3B6/arrow.gif), progress !important;}</style><a href="http://situsalfi.blogspot.com/2012/11/kumpulan-cursor-untuk-blog.html" target="_blank" title="Boat"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Dari : Situs Alfi" style="position:absolute; top: 0px; right: 0px;" /></a>

 masih ada lagi

<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/anime/ani-6/ani549.cur), progress !important;}</style><a href="http://www.cursors-4u.com/cursor/2009/02/04/l-lawliet-death-note.html" target="_blank" title="L Lawliet - Death Note"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="L Lawliet - Death Note" style="position:absolute; top: 0px; right: 0px;" /></a>

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkicnWEr6XtZaR20bEcXNrea9wH5I3LHkLax7MJ2-gk-IJNNWJlJTR139nXuZJbH_Ywkx3EpLMMiIsKwc3n8sXua9kyLz0yD_jPl59U0yvaKsVoWrWOQYB6Q1JUrqR8SC1FPToyqPStV0/s128/Teori%20Ngeblog%20CURSOR%201.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgg8QPxH5Y36brGzw-zDEEN6RmKfxUcKpUFX2byeLJnpXRvP9l-f66NKUY2PbdTuKDcrln8U5yBtpbYqICXM4dZrmvDhG9bW6smTRPFtvWY2NZPPpb_p0CjrCEA3pks9qDiB3zqSdH-_As/s128/Teori%20Ngeblog%20CURSOR%202.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNQXNsxPANl8RrZLrB48yEdUCb6oJsosuCBb1zaNU6TmFo8HF7NPRAn4MR4dmPYvWr51FJ_QIXrhh-vmbvE9cNDKHJY__s3k_Iu7tyFlgMReOKSMVJtnEBZuXhssrY_S-MFKB3cAzivZs/s128/Teori%20Ngeblog%20CURSOR%203.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSmMEmOlK_NIkZXVAz_qYJfQNSTIwRxxI_CPYWAzA9vEqcFtIfSbAw3Y8w8pb3DAdg12j_gxt6L4xS3bYdWSxN2vMmpd-OJ8_E7M0Vg32kbBXEyIEczkGjIBWlv_gQpqDWFY3GXQqHs1c/s128/Teori%20Ngeblog%20CURSOR%204.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJIvcgcPPLpYbjfK5J6Bki9NNbHLkeLxmh8kV6imfCBeJl10xetQeHjaNwk5MW4INMVyYvzfsTLWFCfS6qdcp_EowJVBNMABReGZi8HwO6poYFK6JR1_t3quwZrTtFYBGvSvlNqX5gAcg/s128/Teori%20Ngeblog%20CURSOR%205.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0AX0aUZKvH8iUam9Mx4fww3lnsMfKJ1hyi_wtev9b4SKsz-_bdkO7Kg3dRf1UDoRMWIubggkFBqkLpgCJI_bXtNV3rHSteH5T1XVGZS_RR_vXAhTqXvXiRscOO_FSj-VpiVoCXiffPLc/s128/Teori%20Ngeblog%20CURSOR%206..gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1N5nUPD4xjAmKau1eV5-NE6ruNpmZnQk6nUCPeg7-gIGsrWdXJB0dr4NLd_f2xPpBWLI3V5Zs5lyHZFfEEeFTNEfG_LYeDvw2AKRd2YQF4f6m1hShSqucZHrBBzdQLcHLdUks_evmIIU/s128/Teori%20Ngeblog%20CURSOR%207..gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0Rq_lu2Tb4_RONF75KXalolnFcNWT4bydS5Rn65LySIvMQLpm1qrk3nV9Pkcc-O8_13llmdw8NsmS8RZE8Vs6dVctErlbsCMTec9m5tL6lJPYFpAUroUCGHhLaLwwCRnBWEM7TFhx2_4/s128/Teori%20Ngeblog%20CURSOR%208.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPI7UUL-VbumGSCgR6n0r_wfD1S4D2jMl03-dtV2UIM93U-E2Vu3ShrL6awZQKlwWSH-sCWgVDAvRy_aW6aXYBXwYDZNc5Uhb4qkpBkdSBr-PQzFVGRWXehTyfOPUNpLFLqQ12VbqeXX8/s128/Teori%20Ngeblog%20CURSOR%209.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr8_iM4BzlZvkNCTcLf8fEcrc3McqAsCR4yaBJFn01qeWn2gSOXUWTVxLXfgnnkywD88x_k31jk_ZfUmCbZZDd_uIULSAbvpCpKe1ow4K_gKPye9QJG5Wn5QD7DJ_zNQe66JgLRvFkoiY/s128/Teori%20Ngeblog%20CURSOR%2010.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVU5jAV3U6zq-OHcpb_hUyIX9xLqAJQWcwZjcL-P-pTlJQbct6g0jdlvjLojF_mzengFhRvGHwxuiUBfBj9alVBHSM8imBHj0sh-vsux8LqM-blS5fDEShhXssILrD0gWiXfhMJU4vd2g/s128/Teori%20Ngeblog%20CURSOR%2011.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrVEn_CjIySG9zVSfIae6iVFT4MKsRUh28DgxpW4iONTvszVCKQ6VXH4RA-8o9-F2wPWMUCqO0-Dxxn6Qq4r9FpTMeRMF4vk2eZJtqs3r4hN8szVKdgCbB13l06a-1Kc5ksIW80eEEIJA/s128/Teori%20Ngeblog%20CURSOR%2012.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFOFiGZlJoeQMkxfPSxMCFkqh3dRXI-cr13PhjM19EIpS59cdpotQT_ALVqQZr3ky8LlVERvLa11XzzyyuRBcYIUUdX9UOXkfgGEGZxfBb8fZlnw3iMJsZkrZiE7zjNEdtovy4-3ZBbQ8/s128/Teori%20Ngeblog%20CURSOR%2013.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXn_gLeM_4P1T-YbmSKhoHFo5GEnJCzIVuZnlCICpRyyJwyXHvoSmrn1nKJtZeu2u75PhOkUBzl5LLHDH9P2FhHOEXJEVEHNRYWbTCx7JV0JXqXHVguUKf0GaOFCgYWLgwTKxc4fvvO1Y/s128/Teori%20Ngeblog%20CURSOR%2014.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiU5oBTgEHmgRfZx7WE0ivZ_hPezR5WS6WmTHnwLskTwWHMmx9Urbe-urqPJPwms9TDJPSffFnxiYBwblrDseIjojj6r9v11R42sdK2ycqSm7zlPOhnK_DbEGDceTvEQnZr8NHumYpwF2I/s128/Teori%20Ngeblog%20CURSOR%2015.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpcJ9Gx0y_kVz8mx7r0fCx73J4zNMSeEBgH5RWRckXjrQ-5ukY1Tc-6eydBCjU2ZWVnj9RFkkgBcF8unkBDR4o784I91eG1GVlfL8KLDqFB7EJoCCoBj0nNVDSPVnbnmCwOzw0PW75vek/s128/Teori%20Ngeblog%20CURSOR%2016.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRoTTK8rXPWNOuljwd_Xei-x9agCtU-JBUlzwbpuL0eqlzEpLUrCJryS9GMqiJ4TJpB2k1TFGvUFelye3LmH4arq4oRJsx-qrEXgl_C5y3-1wGHsZXQjQVZrErHSb7LzC2_8bc79SMCZQ/s128/Teori%20Ngeblog%20CURSOR%2017.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihE8NsrlwnG_aHuALlaEpqCDZtFYDGlCGaYPSqmUSRkQAlXzS599JmLRWMr4d4CEfFrv63pD9EZTRiv-kvzc52XZNZSoIEixjR9PCmDdm_HVJ0A9m_CcnaBI256WarPx27DHiAWkHJr4U/s128/Teori%20Ngeblog%20CURSOR%2018.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMhyphenhyphenQjaMS-JFGi5eOU4ncBzetcJPUUSwR0QX-Bv3keR_ohLJ8NShZVdJbvB_yeMlbHcim1UEzdN5fB0BZ1ySBCtzfsIsiA3iFtS4b2bzg49tYv-CHgDbI1pLBDJ7gR7bjR9LmAPccLe2Q/s128/Teori%20Ngeblog%20CURSOR%2019.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh136OdShsInK9Xfsi_Vd9bxOPEokdABrbYI9lDJxsjntwTMtJeIpRiaEfIqp9kM4Oy_99KWf9U1xdO7m_5yyo-jvjFkj0R-CyzPQv_hgHDmLHZy8HeO1M2uFgIUCZJnUwskXK0-JWr-Jk/s128/Teori%20Ngeblog%20CURSOR%2020.gif

Cara Mengganti Kursor di Blog

  Untuk cara menggantinya kita langsung saja :

1. login lah ke akun blogger sobat terlebih dahulu

2. Lalu klik "Layout"

 3. Pilih "add a gadget" lalu pilih "HTML/Java Script" dan paste-kan kode berikut untuk mulai mengubah tampilan kursor yang ada di blog sobat:

a. Kode 1: mengubah kursor tapi tidak mengubah kursor ketika menyorot link

<style type="text/css">
body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDUFE_7mKEDULeu9ErX3ZCNvXKKQ7gSNjEpDmJom1BzCnKx3QRZCBx8lZ48ZnSX_BmbhR-l7bI4b-lhaacUHYD9v-YxQdg2PCkgyBKzQePBpDahVAJwCkRZQHQHTopQ6lNOW8LF4LoHBpA/"), auto;}
</style>

b. Kode 2: mengubah kursor serta tetap berubah walau disorot ke arah link

<style type="text/css">
body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDUFE_7mKEDULeu9ErX3ZCNvXKKQ7gSNjEpDmJom1BzCnKx3QRZCBx8lZ48ZnSX_BmbhR-l7bI4b-lhaacUHYD9v-YxQdg2PCkgyBKzQePBpDahVAJwCkRZQHQHTopQ6lNOW8LF4LoHBpA/"), auto;}
body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDUFE_7mKEDULeu9ErX3ZCNvXKKQ7gSNjEpDmJom1BzCnKx3QRZCBx8lZ48ZnSX_BmbhR-l7bI4b-lhaacUHYD9v-YxQdg2PCkgyBKzQePBpDahVAJwCkRZQHQHTopQ6lNOW8LF4LoHBpA/"), auto;}
</style>

SILAHKAN UNTUK MEMILIH SALAH SATU KODE YANG SOBAT INGINKAN

4. Jika sudah, maka silahkan untuk tekan tombol "SAVE" atau "SIMPAN"

PENTING:

Sobat bisa mengganti link gambar yang telah saya tandai warna biru dengan link gambar kursor sesuai keinginan sobat. Berikut adalah beberapa link gambar kursor koleksi saya:

---

Link:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDxaLElYw5xLB4_MDN4CYydmC0-EPjPdUQ-DbY1Jivdb2lOqoBAJUwKMsKkETCzBamAhQk0LKNZkL9m-Ki8ofO3pZKYkpZ8LhBUoiAIuHCxOG3pjDazW0BhbQ2jBJy7KH5VhU1Du1CXvU/s400/bat_banana_t4belajarblogger.png

---

---

Link:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOS726Afi9SlEN2drK2w_Sj_KIq9k36VbHHu5LVqPRH40KU8FyAyYAexaviOnN8QkHfySjpn1pjSI0B5z01PKUBvkRT_oFdVVlW-w2AgCRgS6pFXMYDM2xA6N-cRkUwEXskHQMuedhrTc/s400/bird_hair_t4belajarblogger.png

---

---

Link:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4BSH36ADExv_a4fgOHNIBDrOe634N1IfF7QM0U3p58C-aPuxX6nJ73JtJqFE6g-PqMZO7lnnRjtjPNnplR2G7w50WSynssdDS5gLgnbn2f784X5vJimSmSy3DBnL2m6jDanPIDWya_hE/s400/guitar_banana_t4belajarblogger.png

---

untuk lebih banyak html kursor klik di sini
atau untuk selebihnya sobat bisa mencarinya melalui Google... :D

Cara Membuat Category Bar di blog

Halo sahabat semua, kali ini Info Bagus Fakta Bagus akan berbagi cara membuat sub menu bar di blog. Sub menu bar sangat diperlukan bagi setiap blogger sejati. Bagi para pengunjung hal ini juga sangat dibutuhkan guna mencari informasi berdasarkan pada kategori di sub menu bar. Memberi sub menu bar juga membuat blog kita tampak lebih tampan, teratur, dan praktis (tidak acak-acakan). Langkah-langkahnya berhubungan dengan edit HTML. Bagi para blogger pemula mungkin akan merasa sulit, tetapi sebenarnya hal ini sangat mudah. Ikuti saja langkah-langkah yang kami jelaskan di bawah ini. 


Ok, setelah berbasa-basi. Let's check it out...

Berikut ini langkah-langkah yang harus dilakukan :

1. Klik Menu Desain 

2. Pilih Menu Template lalu pilih menu Edit HTML 

3. Pilih/klik menu Lanjutkan

4. Pilih/klik menu Expand Template Widget

5. <div class='main-outer'> atau <div id='main-wrapper'> atau <div id='main'>

   Cari scrift berikut :

Agar lebih mudah, klik saja F3 pada keyboard lalu pilh salah satu scrift diatas. Berdasarkan pengalaman saya setelah membolak balik informasi di www.google.com maka yang cocok adalah :

div class='main-outer'>.

Bisa jadi beda dengan template yang lain…

Setelah dapat, copas scrift berikut tepat diatas scrift yang dicari tadi : 

<style>

/* -- Menu Horizontal + Sub Menu-- */

#cat-nav {background:#156994;margin:0 15px;padding:0;height:35px;}

#cat-nav a { color:#eee; text-decoration:none; text-shadow: #033148 0px 1px 0px;border-right:1px solid #156994;}

#cat-nav a:hover { color:#fff; }

#cat-nav li:hover { background:#000; }

#cat-nav a span { font-family:Verdana, Geneva, sans-serif; font-size:11px; font-style:normal; font-weight:400; color:#fff; text-shadow:none;}

#cat-nav .nav-description { display:block; }

#cat-nav a:hover span { color:#fff; }

#secnav, #secnav ul { position:relative; z-index:100; margin:0; padding:0; list-style:none; line-height:1; background:#0d5e88; }

#secnav a { font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; font-weight:700; font-size:14px; display:block; z-index:100; padding:0 15px; line-height:35px; text-decoration:none;}

#secnav li { float:left; width: auto; height:35px;}

#secnav li ul  { position: absolute; left: -999em; width: 200px; top:35px}

#secnav li ul li  { height:30px; border-top:1px solid #fff; }

#secnav li ul li a  { font-family:Verdana, Geneva, sans-serif; width:180px; line-height:30px; padding:0 10px; font-size:11px; font-style:normal; font-weight:400; color:#eee; }

#secnav li ul ul  { margin: -30px 0 0 180px; }

#secnav li:hover ul ul, #secnav li:hover ul ul ul, #secnav li.sfhover ul ul, #secnav li.sfhover ul ul ul { left:-999em; }

#secnav li:hover ul, #secnav li li:hover ul, #secnav li li li:hover ul, #secnav li.sfhover ul, #secnav li li.sfhover ul, #secnav li li li.sfhover ul { left: auto; }

#secnav li:hover,#secnav li.hover  { position:static; }

#cat-nav #secnav {width:100%;margin:0 auto;}

</style>

<div id='cat-nav'>

<ul class='fl' id='secnav'>

<li><a href='#'>Beranda</a></li>

<li><a href='#'>Menu 1</a></li>

<li><a href='#'>Menu 2</a>

<ul id='sub-custom-nav'>

<li><a href='#'>Sub Menu2 a</a></li>

<li><a href='#'>Sub Menu2 b</a></li>

</ul>

</li>

<li><a href='#'>Menu3</a>

<ul id='sub-custom-nav'>

<li><a href='#'>Sub Menu3a</a></li>

<li><a href='#'>Sub Menu3b </a></li>

</ul>

</li>

<li><a href='#'>Menu4</a>

<ul id='sub-custom-nav'>

<li><a href='#'>Sub Menu4a</a></li>

<li><a href='#'>Sub Menu4b </a></li>

</ul>

</li>

<li><a href='#'>Menu5</a></li>

</ul>

</div>

PENJELASAN :

• Ganti tanda # (warna biru) dengan link/url yang anda inginkan. Bisa jadi link posting atau label (katagori) yang ada pada blog anda.
• Ganti Tulisan warna biru dengan menu dan sub menu yang anda inginkan.
• Setiap sub menu bisa ditambah atau dikurangkan sesuai keinginan. 

7. Setelah itu klik Pratinjau dulu untuk memastikan scrift sudah benar . Lalu simpanlah/save. Dan tutup edit HTML tersebut.

Saran : back up dulu template anda sebelum merubah/menambah scrift diatas, agar bisa dimanfaatkan kembali jika ada masalah dengan penambahan srcritf diatas.

8. Untuk menghilangkan tampilan tampilan dabel dengan Laman Utama, 
Maka ikutilah saran berikut :

• Masuk ke Menu Laman 
• Lalu pilih tampilan halaman dengan memilih "jangan tampilkan"
• Simpan setelan, maka laman utama akan tampil sendiri sesuai dengan scrift yang kita ketikkan tadi.

Sumber artikel: http://kanginanjaya.blogspot.com/2013/01/cara-membuat-sub-menu-bar-di-blog.html#ixzz2MuAvb9Sv