Membuat Menu SlideBar Dengan Mudah

View previous topic View next topic Go down

Membuat Menu SlideBar Dengan Mudah

Post by Alex on Mon Oct 04, 2010 7:41 pm

Pada pada postingan kali ini, kami akan membahas bagaimana caramembuat menu sidebar blog. Menu di bagian sidebar/ widget / bagian samping kiri atau kanan blog. Menu di bagian blog merupakan komponen
penting dalam Navigasi sebuah blog. Karena tanpa hal tersebut blog kita akan sangat menyulitkan pengunjung, jika pengunjung ingin menjelajahi blog kita. Ada yang memasang Menu dibagian header, dalam hal ini merupakan hal yang umum dilakukan para blogger, nah saat ini kami ingin mencoba menjelaskan bagaimana cara memasang menu di sidebar. Silahkan anda buka blog anda, jangan lupa untuk login terlebih dahulu

Pilih -> Tata Letak(Page Element) ->Elemen Laman->Tambah Gadget->Kemudian New HTML
Kemudian pastekan code script ini :


<style type="text/css">

#ddblueblockmenu{
border: 1px solid #000000; /*Main Border Color */
border-bottom-width: 0;
width: 100%;
}

#ddblueblockmenu ul{
margin: 0;
padding: 0;
list-style-type: none;
font: normal 90% 'Trebuchet MS', 'Lucida Grande', Arial, sans-serif;
}

#ddblueblockmenu a{
display: block;
padding: 3px 0;
padding-left: 9px;
width: 94%; /*94% minus all left/right paddings and margins*/
text-decoration: none;
color: #ffffff; /* Menu Font Color */
background-color: #2175bc; /*Ganti warna bacground*/
border-bottom: 1px solid #90bade; /*Bottom border color */
border-left: 7px solid #1958b7; /*Left border color */
list-style-type:none;
}

* html #ddblueblockmenu a{ /*IE only */
width: 94%; /*IE 5*/
width: 94%; /*94% minus all left/right paddings and margins*/
}

#ddblueblockmenu a:hover {
background-color: #2586d7; /*Menu background Color On Hover*/
border-left-color: #1c64d1; /*Left border color On Hover*/
}

#ddblueblockmenu div.menutitle{
color: #ffffff; /* Title Font Color */
border-bottom: 1px solid black;
padding: 1px 0;
padding-left: 5px;
background-color: #000000; /*Menu Tite Background Color*/
font: bold 90% 'Trebuchet MS', 'Lucida Grande', Arial, sans-serif;
}
<a href=" [You must be registered and logged in to see this link.] /">Home</a>
<a href=" [You must be registered and logged in to see this link.] About us</a>
<a href=" [You must be registered and logged in to see this link.] ">Blogger
templates</a>
<a href=" [You must be registered and logged in to see this link.] ">Blogger
Tricks</a>
<a href=" [You must be registered and logged in to see this link.] ">Blogger Tools</a>


• Untuk Mengganti Nama menu yang anda inginkan silahkan anda mengganti tulisan yang sudah saya beri warna merah tersebut.
• Untuk Mengganti warna border bisa anda ganti script yang sudah saya tandai warna biru.
• Untuk mengganti link menu anda, anda bisa mengganti tulisan yang saya beri warna hijau, atau yang tertulis [You must be registered and logged in to see this link.]
• Untuk menganti warna background cari script di bawah ini ,

background-color: #00000; /*Menu background Color */

silahkan anda ganti #00000 dengan warna yang anda inginkan, bisa menggunakan color picture atau silahkan mengunjungi link ini
[You must be registered and logged in to see this link.]

Kemudian klik save,
tutorial tentang cara membuat menu di sidebar sudah selesai,
Selamat mencoba….

Sumber :
ini
avatar
Alex
V.I.P
V.I.P

Posting : 225
Points : 655
Reputation : 4
Join date : 2010-10-03
Location : Bandung

Back to top Go down

View previous topic View next topic Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum