Ada pertanyaan dari sobat Sigit Super... " oia gimana caranya buat biar menu di navbar bisa ada dua atau tiga menu.maksudnya dropdown menu plis ya bung ?"
Menu Horizontal Drop Down seperti gambar dibawah ini, tampilannya minimalis.
Langkah-langkahnya sbb :
1. Login ke blogger > Rancangan > Edit HTML > Edit Template ( centang saja expand template widget ).
2. Copy-Paste dahulu seluruh kode HTML template widget blog ke dalam Notepad dan simpan, untuk jaga-jaga (Backup)
3. Cari dengan CTRL+F kode " ]]></b:skin> " lalu copy script dibawah ini dan paste diatasnya.
Contohnya seperti dibawah ini.
/* MHD2 */
#bg_nav {
background: #FCF526; /* kuning_warna background dasar */
width: 760px; /* Panjang dari kotak menu dasar */
height: 29px;
font-size: 11px;
font-family: Arial, Tahoma, Verdana;
color: #000000;
font-weight: 28px;
margin: 0px auto 0px;
padding: 0px;
overflow: hidden;
-moz-border-radius:0px;
}
#bg_nav a, #bg_nav a:visited { /* bagian script yang ini dibiarkan saja ya */
color: #ffffff;
font-size: 11px;
text-decoration: none;
text-transform: uppercase;
padding: 0px 0px 0px 0px;
}
#bg_nav a:hover { /* bagian script yang ini dibiarkan saja ya */
color: #ffffff;
text-decoration: underline;
padding: 0px 0px 0px 0px;
}
#navleft {
width: 760px;
color: #FFFFFF;
float: left;
margin: 0px;
padding: 0px;
}
#nav {
margin: 0px;
padding: 0px;
list-style: none;
}
#nav ul {
margin: 0px;
padding: 0px;
list-style: none;
}
#nav a, #nav a:visited { /* Menu Utama */
background: #FCF526; /*Kuning_warna latar menu utama */
color: #053EFA; /*BIRU_warna teks menu utama */
text-shadow: 4px 4px 4px #aaa; /* Memberi efek bayangan di teks */
display: block;
height: auto;
width: auto;
font-weight: bold;
margin: 0px auto 0px;
-moz-border-radius:0px;
padding: 8px 15px 8px 15px;
opacity: 0.7;filter:alpha(opacity=70);zoom:1;
}
#nav a:hover {
background: #F7F68F; /*Kuning cerah_warna hover di Menu Utama*/
color: #3854F2; /* Biru_warna teks di menu drop-down n teks hover MU*/
margin: 0px auto 0px;
font-weight: bold;
padding: 8px 15px 8px 15px;
text-decoration: none;
-moz-border-radius:0px;
opacity: 0.7;filter:alpha(opacity=70);zoom:1;
}
#nav li {
float: left;
margin: 0px;
padding: 0px;
}
#nav li li {
float: left;
margin: 0px;
padding: 0px;
width: 300px;
}
#nav li li a, #nav li li a:link, #nav li li a:visited {
background: #F7F68F; /*kuning cerah_warna latar menu drop-down*/
width: 200px;
float: none;
margin: 0px;
padding: 7px 30px 7px 10px;000000;
}
#nav li li a:hover, #nav li li a:active {
background: #F8FABB; /*kuning cerah2_warna hover menu drop-down*/
padding: 7px 30px 7px 10px;
}
#nav li ul {
position: absolute;
width: 10em;
left: -999em;
}
#nav li:hover ul {
left: auto;
display: block;
}
#nav li:hover ul, #nav li.sfhover ul {
left: auto;
}
#nav li ul a {
width: 100px;
}
#nav li ul ul {
position: absolute;
margin: -30% 0 0 95%;
}
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
left:-999em;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
left:auto;
}
#nav li li li.sfhover ul {
left:auto;
}
#nav li:hover, #nav li.sfhover {
position:static;
}
/* eleman dibawah header */
#under_header{
margin:-20px 0 25px 0px;
padding:1%;
height;0px;
width:98%;
}
]]></b:skin>
#bg_nav {
background: #FCF526; /* kuning_warna background dasar */
width: 760px; /* Panjang dari kotak menu dasar */
height: 29px;
font-size: 11px;
font-family: Arial, Tahoma, Verdana;
color: #000000;
font-weight: 28px;
margin: 0px auto 0px;
padding: 0px;
overflow: hidden;
-moz-border-radius:0px;
}
#bg_nav a, #bg_nav a:visited { /* bagian script yang ini dibiarkan saja ya */
color: #ffffff;
font-size: 11px;
text-decoration: none;
text-transform: uppercase;
padding: 0px 0px 0px 0px;
}
#bg_nav a:hover { /* bagian script yang ini dibiarkan saja ya */
color: #ffffff;
text-decoration: underline;
padding: 0px 0px 0px 0px;
}
#navleft {
width: 760px;
color: #FFFFFF;
float: left;
margin: 0px;
padding: 0px;
}
#nav {
margin: 0px;
padding: 0px;
list-style: none;
}
#nav ul {
margin: 0px;
padding: 0px;
list-style: none;
}
#nav a, #nav a:visited { /* Menu Utama */
background: #FCF526; /*Kuning_warna latar menu utama */
color: #053EFA; /*BIRU_warna teks menu utama */
text-shadow: 4px 4px 4px #aaa; /* Memberi efek bayangan di teks */
display: block;
height: auto;
width: auto;
font-weight: bold;
margin: 0px auto 0px;
-moz-border-radius:0px;
padding: 8px 15px 8px 15px;
opacity: 0.7;filter:alpha(opacity=70);zoom:1;
}
#nav a:hover {
background: #F7F68F; /*Kuning cerah_warna hover di Menu Utama*/
color: #3854F2; /* Biru_warna teks di menu drop-down n teks hover MU*/
margin: 0px auto 0px;
font-weight: bold;
padding: 8px 15px 8px 15px;
text-decoration: none;
-moz-border-radius:0px;
opacity: 0.7;filter:alpha(opacity=70);zoom:1;
}
#nav li {
float: left;
margin: 0px;
padding: 0px;
}
#nav li li {
float: left;
margin: 0px;
padding: 0px;
width: 300px;
}
#nav li li a, #nav li li a:link, #nav li li a:visited {
background: #F7F68F; /*kuning cerah_warna latar menu drop-down*/
width: 200px;
float: none;
margin: 0px;
padding: 7px 30px 7px 10px;000000;
}
#nav li li a:hover, #nav li li a:active {
background: #F8FABB; /*kuning cerah2_warna hover menu drop-down*/
padding: 7px 30px 7px 10px;
}
#nav li ul {
position: absolute;
width: 10em;
left: -999em;
}
#nav li:hover ul {
left: auto;
display: block;
}
#nav li:hover ul, #nav li.sfhover ul {
left: auto;
}
#nav li ul a {
width: 100px;
}
#nav li ul ul {
position: absolute;
margin: -30% 0 0 95%;
}
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
left:-999em;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
left:auto;
}
#nav li li li.sfhover ul {
left:auto;
}
#nav li:hover, #nav li.sfhover {
position:static;
}
/* eleman dibawah header */
#under_header{
margin:-20px 0 25px 0px;
padding:1%;
height;0px;
width:98%;
}
]]></b:skin>
Hitam, yang ada di bagian bg_nav dan navleft, ini untuk mengatur panjang menu horizontal, silahkan diatur sesuaikan.
Hijau, warna latar menu.
Pink, warna hover menu ketika di mouseover.
Orange, warna teks menu utama.
Biru, warna hover ketika teks di mouseover.
4. Cari dengan CTRL+F kode " <div id='header-wrapper'> " lalu copy script dibawah ini setelah kode " </div> ".
atau ( Jika tidak ada kode header-wrapper ), cari kode " <body> " lalu copy script dibawah ini setelahnya.
Paste persis seperti contoh dibawah ini.
<div id='under_header'>
<b:section class='header' id='underheader' preferred='yes'/>
<div id='bg_nav'>
<div id='navleft'>
<div id='nav'>
<ul>
<li><a href='http://ecaknyo.blogspot.com/'> Home</a></li>
<li><a href='####' target='_blank'> Blogging</a>
<ul>
<li><a href='http://www.blogger.com' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Login ke blogger</a></li>
<li><a href='http://www.blogger.com/profile/07038241031299325975' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> blogger profil</a></li>
<li><a href='http://www5.shoutmix.com/?pumitabusan' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Blog Walking</a></li>
</ul></li>
<li><a href='#' target='_blank'> Demo</a>
<ul>
<li><a href='http://eksperimen284.blogspot.com' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> blog eksperimen284</a></li>
</ul></li>
<li><a href='URL tujuan utk menu 2'> ALAT</a>
<ul>
<li><a href='http://www.colorpicker.com/' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> color picker</a></li>
<li><a href='http://centricle.com/tools/html-entities/' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Encode/Decode HTML Entities</a></li>
<li><a href='http://www.iconfinder.com/' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Icon Finder</a></li>
<li><a href='http://translate.google.co.id/#' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Google Translator</a></li>
<li><a href='http://myspace.laymark.com/' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Smiley Emotion</a></li>
<li><a href='http://sites.google.com/' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Google Site</a></li>
</ul></li>
<li><a href='#' target='_blank'> Download/Upload</a>
<ul>
<li><a href='http://www.filehippo.com' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> FileHippo</a></li>
<li><a href='http://www.ziddu.com' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> ziddu</a></li>
</ul></li>
<li><a href='#' target='_blank'> <blink>MAU DUIT</blink></a>
<ul>
<li><a href='http://www.neobux.com/?r=wong284' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Neobux</a></li>
<li><a href='http://www.idr-clickit.com/register.php/wong284.html' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> idr-clickit</a></li>
<li><a href='http://www.donkeymails.com/pages/index.php?refid=wong284' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> DonkeyMails</a></li>
<li><a href='https://www.vipclix.com/?ref=wong284' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> vipclix</a></li>
</ul></li>
<li><a href='http://ecaknyo.blogspot.com/2010/08/cara-membuat-menu-horizontal-drop-down.html' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow003.gif'/> Buat Menu drop-down seperti ini</a></li>
</ul>
</div>
</div>
</div>
</div>
<b:section class='header' id='underheader' preferred='yes'/>
<div id='bg_nav'>
<div id='navleft'>
<div id='nav'>
<ul>
<li><a href='http://ecaknyo.blogspot.com/'> Home</a></li>
<li><a href='####' target='_blank'> Blogging</a>
<ul>
<li><a href='http://www.blogger.com' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Login ke blogger</a></li>
<li><a href='http://www.blogger.com/profile/07038241031299325975' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> blogger profil</a></li>
<li><a href='http://www5.shoutmix.com/?pumitabusan' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Blog Walking</a></li>
</ul></li>
<li><a href='#' target='_blank'> Demo</a>
<ul>
<li><a href='http://eksperimen284.blogspot.com' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> blog eksperimen284</a></li>
</ul></li>
<li><a href='URL tujuan utk menu 2'> ALAT</a>
<ul>
<li><a href='http://www.colorpicker.com/' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> color picker</a></li>
<li><a href='http://centricle.com/tools/html-entities/' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Encode/Decode HTML Entities</a></li>
<li><a href='http://www.iconfinder.com/' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Icon Finder</a></li>
<li><a href='http://translate.google.co.id/#' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Google Translator</a></li>
<li><a href='http://myspace.laymark.com/' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Smiley Emotion</a></li>
<li><a href='http://sites.google.com/' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Google Site</a></li>
</ul></li>
<li><a href='#' target='_blank'> Download/Upload</a>
<ul>
<li><a href='http://www.filehippo.com' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> FileHippo</a></li>
<li><a href='http://www.ziddu.com' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> ziddu</a></li>
</ul></li>
<li><a href='#' target='_blank'> <blink>MAU DUIT</blink></a>
<ul>
<li><a href='http://www.neobux.com/?r=wong284' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> Neobux</a></li>
<li><a href='http://www.idr-clickit.com/register.php/wong284.html' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> idr-clickit</a></li>
<li><a href='http://www.donkeymails.com/pages/index.php?refid=wong284' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> DonkeyMails</a></li>
<li><a href='https://www.vipclix.com/?ref=wong284' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow002.gif'/> vipclix</a></li>
</ul></li>
<li><a href='http://ecaknyo.blogspot.com/2010/08/cara-membuat-menu-horizontal-drop-down.html' target='_blank'><img src='http://icons.primail.ch/eyecatch/arrow003.gif'/> Buat Menu drop-down seperti ini</a></li>
</ul>
</div>
</div>
</div>
</div>
Hitam, gantilah nama menu-menu nya.
Biru, ganti alamat URL-nya, sesuaikan.
5. Simpan & reload blog untuk melihat hasilnya.
Selamat Mencoba.
keren2..
ReplyDeletethanks berat yah atas ilmu bloggernya..
^_^
masih belajar nih mas,dibantu laagi ya?/
ReplyDeletesangat membantu kawan...
ReplyDeletesob kalo div id='header-wrapper' ga ada gimana ya ? ~x
ReplyDeleteSerba Serbi > sama2 gan.. silahkan dimodifikasi lagi
ReplyDeleteiplock > oke... akan dibantu.. mudah2an sy bisa membantu dg baik.. ;)
BUNTU > silahkan dicoba2.. :)
Fhidi >... Gk ad "div id=header-wrapper" ?? aah masak sob.. aneh..template blogmu yg tipe apaan ya?... mungkin berbeda sedikit aj kali namanya..
ReplyDeleteSaya kasih clue ya :
..Kalo pake CTRL+F gk ketemu coba kamu cari manual... letaknya ada di bagian bawah template blog kamu..persisnya dibawah kode " <body> " cari yg mirip2 "header-wrapper" atau cari div id='content-wrapper' ...
Kalau ada div id='content-wrapper' ....kamu pastekan kode scrip isi MHD2-nya tepat diatasnya..
Bang Andi,,, Islam tidak secara spesifik menggambarkan bahwa tattoo itu haram (kecuali pndapat pemuka agama). Kutipan ayat dan hadits utk menbgharamkan tattoo pun belum relevan. Belum lagi klo yang dilihat dari asas manfaat/ kebutuhan org bertattoo. Tentunya tattoo punya nilai etis tersendiri jika kegunaannya dalam konteks yg baik. Salah satu contoh bagi tattoo yang ditempatkan bagi mereka yg disimbolkan sebagai figur2 teladan (sewperti org dayak yg sy contohkan di atas).
ReplyDeleteTaattoo dianggap pelaku kriminal, lagi2 karena orde baru mengkonstruksinya demikian. Siapa yang melakukan kejahatan, maka akan di tattoo. Akhirnya, kitapun menganggap tatto itu=Kriminal.
informasinya sangat bermanfaat sob, kebetulan saya mau memakai cara ini...^_^ terima kasih
ReplyDeleteKodenya lumayan banyak y ^^
ReplyDeleteWah2!! bagus2!!!
ReplyDeletewah... perlu dicoba nih...
ReplyDeletekayaknya baguss.....
buntu > saya hanya merunut dari hadis2 shahih & kisah para sahabat gan.. seingat sy ada sahabat yg bertanya mengenai tatto di badan kpd rasulullah tpi jawaban Nabi tegas tidak membolehkannya..haram gan.. mudah2an betul ingatan sy ini.. subhanallah.. :)
ReplyDeleteAZ COMSOFT > kalo begitu cobalah gan.. :)
Ka Damar > iya banyak... ini atas permintaan sobat sigit super.. makanya kalo sy bisa saya usahakan jawab dg contoh jadinya.. :)
ridho blog > thx gan.. cobalah ;)
akhyar.info > memang bagus gan.. wa aj mau pasang di blog ecaknyo ini.. :D
wah keren ,thanks infonya
ReplyDeletemet puasa cak :)
Nabi mengharamkan tatto pasti ada hal yg negatifnya sob bisa saja kalau tatto bisa menyebabkan kanker kulit , tatto gagal kan jadi jelek sob ga bisa di hapus lg :-t ..
ReplyDelete@Andi Wong : ngga ada sob ~x( y udh gpp deh..
sob kalo mau post code gimana yah ? misalnya kayak diatas .. b-(
ini yg saya cari coba ah....hehhehe...
ReplyDeletethx ya kawand,,,..
verry Nice good post...
:D
SALAM BERKAWAND
Tukar banner broooo
ReplyDelete<a href=" http://www.gratizs.co.cc/ " title="UANG GRATIS"><img src="http://lh3.ggpht.com/_TSfalsMYJyA/TGRtECzSXAI/AAAAAAAAAHI/FShT3IfdoDI/60x60.gif" border="0" /></a>
trims ats jawabanny teman, ntar ak cb pelajari dl,...success 4 u...!Amin.
ReplyDeleteseptian > :) ..met puasa jg sob..
ReplyDeleteRizky Fhidi > lebih baik menghindari hal-hal yg dilarang rasulullah ..ow..post code..oke ntar wa jelasin ya.. ;)
anggar berkawand > silahkan dicoba gan :D
Uang Gratis > waah.. kalo tuker banner gk bisa diblogku sob (bikin berat loading).. tpi link banner lo sdh nongkrong tuh di blogroll ku...
tiwi > silahkan dipelajari tiwi.. :)
Link ku dikasi nama apa brooo??
ReplyDeleteSELAMAT BERIBADAH PUASA
ReplyDeleteMampi sob,,, tulisan-menarik.blogspot.com
wah demonya kren ya sob, lumayan buat nambahin wawasan jika ada kesempatan saya akan praktekan sobat
ReplyDeleteSukses Slalu!
hallo kawand....
ReplyDeletemampir jalan2 lg ah smbil ngabuburit ketmpt sahabat..
SALAM BERKAWAND ,,,,..
iya sob tadi abis nyari di google eh ketemu thanks sob sebelumnya , tukeran link yuk link mu sudah ada di blog ku sob.. ^^
ReplyDeleteThis comment has been removed by the author.
ReplyDelete@Uang Gratis
ReplyDeleteada tuh di blogroll abjad G gan.. :)
Patut di coba nih.. Makasih bwt tutorialnya gan! :)
ReplyDeleteMantaph nie :)
ReplyDeletewahhh bagus nihhh sobbb tutorialnya,,
ReplyDeletelanjutkan kawan...
@mas kholiq
ReplyDeleteiya sama2 gan.. mhon maaf lahir & batin yaa.. oke sung ke TKP :)
@Bunglon Blog Indonesia
ReplyDeletetapi ada loh yg lebih keren lagi..tpi pake jquery.. namun kayaknya berpengaruh trhdp loding blog kalo pake jquery script.. :)
@anggar berkawand
ReplyDelete..halo anggar.. mo menu buka apa disini gan.. ? ntar tk siapin BLoger asam manis plus jus blogging... hehe.. :D
salam berkawan..
@Fhidi
ReplyDelete..iya gw liat kamu udah bisa..tuh buktinya dah kamu post cara convert code html-nya..
btw OKE.. Link mu sdh terpasang di blogroll abjad F gan.. thx ya :)
Wah bisa mempercantik penampilan blog nich, tapi jika ku pasang kira-kira berpengaruh pada loading blog ga kawan? makasih atas infonya
ReplyDelete@Ikhsan^funztoo
ReplyDeletesilahkan dibaca2 dulu gan.. ntar baru kapan2 kmu praktekan.. :D
@K-blogger
ReplyDeletethx gan.. :)
wahhh tutorial yang bagus sobat,,
ReplyDeletesalam kenal dari ikomputer.co.cc..
@Gieterror
ReplyDeletethx gan... tpi MHD2 ini masih menu drop-down yg sederhana..stidaknya tdk membuat loding blog lama.. hehe :D
@PIK Remaja Al-Hikmah
ReplyDeletebetul..akan mempercantik tampilan blog.. tenang sj gk akan memperberat loding blog MHD2 ini.. :) buktikan sj dg klik DEMO-nya..
Wikh..mantab sob
ReplyDeleteBisa mempercantik blog,saya coba yakh
@ikomputer.co.cc
ReplyDeletethx gan.. tuh kamu jg sudah menerapkan MHD2 ini .. :) manteb
WAH, tar ane plajari dulu deh...
ReplyDeleteruwet jg kyknya...
hmmm..
ijin disave dulu ya kode htmlnya... bwt ane riset dulu...
ReplyDeletehehe..
mksh share nya.. slm knl
JIakkakaka bisa aja lu brooo, pantes aja aku pantau di blog u tapi gak ada siapa-siapa. gimana have funnya??? asyik tentunya donk??
ReplyDeleteNice share gan!. Tutorial yang sangat bagus skl, sistematis dan sangat mudah bwt dipelajari! gw kasih bintang 100 dari 10 :D . Great job! & Keep posting gan! :)
ReplyDelete@Ibnu(dunia-klue)
ReplyDeletesilahkan kapan2 kamu coba ibnu.. ;)
@penghuni60
ReplyDeleteoke..pelajari aj dulu gan.. :)
@Science Box
ReplyDeletesilahkan di save & di riset dulu sob.. :D
@Uang Gratis
ReplyDeleteyg pasti senang sob.. bisa weekend sama keluarga... memang hri sbtu-mingu blogging gw liburkan.. ;)
@Glan@Flixnn
ReplyDeletethx gan... kekekek... baguslah kalo emg tutor ini mudah utk dipelajari.. :D
Wahh menarik sekali masnn.. Tx tutornya
ReplyDeletecoba pake efek jQuery deh gan, lebih kinclong nanti blognya :)
ReplyDeletelha mhd itu apaan mas.ntar tak coba ah
ReplyDeletemarkasih banget mas atas tutornya
tulisan kaya ininya gak ada gan ]]>
ReplyDeleteoia mas aku dah download dreamweaver tapi cara pakenya gak tau.ajarin donk
@akhatam
ReplyDeletethx..silahkan dicoba2 gan.. :)
@Muhammad Taqi
ReplyDelete..betul itu.. tetapi saya pilih yg tanpa jquery gan.. :)
@sigit
ReplyDeleteMHD2 itu singkatan dari Menu Horizontal Drop-Down gan...
Dreamweaver itu bagusnya utk kita yg punya website di hosting..kalo blogger sih gk perlu pake ini program..kn sudah otomatis smua..
..sy udah gk pakai Dreamweaver lagi semenjak gk lagi fokus ke CMS(Drupal/mambo/joomla).. tutorial dreamweaver byk kok di internet gan.. cara pakenya mudah kok..kamu run dreamweaver lalu open file yg ber-extensi.html atupun file javascript.. tapi pengunaan dreamweaver ini mesti didampingi oleh Adobe Photoshop biar desainnya langsung bisa diterapkan di website..
wah sob terimaksih tutorialnya
ReplyDeleteMERDEKA!!! MERDEKA!!!
wah sob terimaksih tutorialnya
ReplyDeleteMERDEKA!!! MERDEKA!!!
nice tutorial....masih banyak bnyak ya.....tapi terlalu panjang...:D ..wkkkwwkwkwk
ReplyDeletekomen balik dong :)
ReplyDeleteknp gak pake jQuery bukannya lebih cadas :)
@mas kholiq:
ReplyDeletesama2 gan.. merdeka!!!!.. :)
@Bang Roy:
ReplyDeletetergantung bahasannya roy...kalo agak rumit..ya otomatis jd lebih panjang tutornya..biar mudah dipahami.. :)
@Muhammad Taqi:
ReplyDeleteudah gw komen balik gan..tapi kok belum masuk daftar komentarmu ya.. ? masuk ke spam kali ya ?...
emg lebih bagus kalo MHD2 ini pake jquery tpi itupun perlu memanggil file.js ..ini yg akan menambah berat loding blog...krn sebagian sobat blogger sdh byk yg widgetnya pake jquery + file.js ..jd kalo ditambah dg MHD2 jquery jg dikhawatirkan akan byk keluhan..hehehe.. :D
..tapi nanti akan sy postingkan MHD2 JQUERY.. :)
saya cobain nih,, kebetulan nav blog saya belum pakai dropdown. tapi masih kesulitan mengatur warna dan lebarnya biar pas.
ReplyDeletebtw thanks ilmunya gan,, selamat menjalankan puasa..
makasih banyak mas andi...
ReplyDeleteberguna bgd nie...
@Dwi:
ReplyDeleteSilahkan dipelajari gan... sy jg ucapkan met menunaikan ibadah puasa jg.. :)
@Ubhay Sthrezh:
ReplyDelete:) ..baguslah kalo emg berguna bwt kamu sob..
maaf nih OOT, saya mau tanya gimana caranya menampilakn widget follower berada di halaman postingan, saya dah coba g berhasil, kl widged yg lain berhasil tinggal followersnya aja yg belum berhasil
ReplyDeleteterima kasih mas,,post'na menarik dan sgt brgna...
ReplyDeletewah keren nih jcuma tampil judul postingannya doang
ReplyDeletemampilagi sob
ReplyDeletemakasih infonya sob...ane coba dulu..
ReplyDelete@Rizky2009:
ReplyDeletemenampilkan widget follower google pd hal.postingan ?... heuum.. ntar wa utak-atik dulu riz.. :) ..mo bikin tampilan blogspot-mu kayak blogazine (freestyler blog).. :D siip
@Make You Smile:
ReplyDeletemakasih gan.. syukurlah kalo emg berguna.. ;)
@mas kholiq:
ReplyDeleteSiip..ntar wa jg mampir sob.. ;)
pake demo sob. Biar mantep
ReplyDelete@Manchester United Tech:
ReplyDeleteya silahkan saja kalo mo dicoba MHD2 yg simple ini .. :)
@KANG uchiha:
ReplyDeletekan emg ada DEMO-nya sob.. lu klik aj tuh link demo yg ada dibawah gambar MHD2.. :)
ntar kl ada kesulitan ak konsul lg ya.., tp kayaknya ribet nih..he3..btw, tnx dah mampir mas, anakku dh baikan kok skrg lg recovery kmren skt DB n Typhus..tq....success 4 u..!
ReplyDeletewah mantap nih blog ane blom ada drop down
ReplyDeletemas di template saya kok g ada ya code <div id='header-wrapper'? nya?
ReplyDelete@Sir_Remo_Jr:
ReplyDelete..silahkan dicoba gan.. :D
@Fauzan:
ReplyDeletegak "header wrapper" ya..
itu letaknya di bagian bawah template blog.. (coba centang expand template-nya).. lalu cari pake CTRL+F... kalo masih gk ad berarti harus ditambah dulu elemen header tambahan sob.. :)
aku uda nyoba tapi kug hasilnya gag kayak contohnya gan?? gmn niy solusinya??
ReplyDeleteOK SOB link udah d pasang balik. follow balik jg. thank
ReplyDeleteMksie ats infox....
ReplyDelete@yan_zhen:
ReplyDelete..ow.. mw yg sma persis kayak punyaku ya.. :)
oke... silahkan donlod script CSS-nya di sini.. >>
http://www.ziddu.com/download/11451462/MHD2ECAKNYO.txt.html
@ILMU KOMPUTER:
ReplyDeleteSiip... thx ya :)
@Dhiyas Music Centre:
ReplyDelete..yups.. sm2 gan.. thx krn udah berkomentar.. :)
makasih gan..
ReplyDeletejaya terus!!
salam blogger
@yan_zhen:
ReplyDelete..senang bisa membantu.. salam blogger.. ;)
Mantap Bener dah....
ReplyDeleteBener2 Hebat Gan....
Sneng bsa tau blog ini.... :)
@dhe_romantiic:
ReplyDeleteMakasih.. sering2 singgah ksini sobat.. :)
exchange link with PR 5
ReplyDeletethanks ya mas
ReplyDeleteIni blog emang paling yahud dah... Informasinya sangat membantu. Di follow aah... :D
ReplyDelete@Business and Finance:
ReplyDeleteoke.. xchange link ;)
@jual beli paypal:
ReplyDeleteyups.. :)
@M. Helmi Akbar W.:
ReplyDeletetrima kasih...gw bls FOLLOW jg.. :)
Bro, bole tanya? di html saya g ada
ReplyDeletediv id='header-wrapper.
itu buat nampilin apa ya mas di web ny?
kok malah vertikal mas jadinya? apa gag cocok dengan tempalte saya ya?
ReplyDelete@CrazyPolar:
ReplyDeleteitu header wrapper buat nampilin header image (background gambar / warna) secara wide sesuai template blognya..
kalo gk ada header wrapper ya bisa diakalin..ditambahkan sendiri ..atau ..ikuti saja cara2 berikut ini.. :)
1. Copy kode dibawah ini dan Paste- letakan di atas kode ]]></b:skin>
/* eleman dibawah header */
#under_header{
margin:-20px 0 25px 0px;
padding:1%;
height;0px;
width:98%;
}
2. lalu Copy kode dibawah ini lagi dan Paste -letakan sesudah kode <body> (kalo emg gk ad div id header wrapper)..
kode-nya kamu donlod dulu ya..ringan kok..ini linknya >> https://sites.google.com/site/ecaknyo/blog/backup-script-widget-ecaknyo/KODEMHD2MENU?attredirects=0&d=1
soalnya gw paste disini gk bisa krna over kuota..
3. SElesai..Simpan template Blog..
..Smoga bisa membantu..
@BoxOfficeIndo:
ReplyDeletejadinya vertikal ?.. bisa jadi bentrok dg kode header blogmu gan.. tapi kalo mw di akal2in masih bisa kok.. ikuti cara di bawah ini..
1. Copy kode dibawah ini dan Paste- letakan di atas kode ]]></b:skin>
/* eleman dibawah header */
#under_header{
margin:-20px 0 25px 0px;
padding:1%;
height;0px;
width:98%;
}
2. lalu Copy kode dibawah ini lagi dan Paste -letakan sesudah kode <body> (kalo emg gk ad div id header wrapper)..
kode-nya kamu donlod dulu ya..ringan kok..ini linknya >> https://sites.google.com/site/ecaknyo/blog/backup-script-widget-ecaknyo/KODEMHD2MENU?attredirects=0&d=1
soalnya gw paste disini gk bisa krna over kuota..
3. SElesai..Simpan template Blog..
..Smoga bisa membantu..
@Andi Wong:
ReplyDeletewah makasi mas, ntar saya coba.
Wah, maap mas, widget follow nya lupa dipasang. tuh dah saya pasang di blog saya.
@CrazyPolar:
ReplyDeletesilahkan dicoba gan.. :) ..oke i will follow u... ke TKP skrg ;)
Ok Makasih Mas,.. Saya coba dulu.. maklum blogger baru. Bisa Link Exchange?? Saya ada 2 blog... http://www.rudycyber.co.cc
ReplyDeletehttp://boxofficeindo.blogspot.com Banner anda sudah saya taruh di blog ane.. trims..
@BoxOfficeIndo:
ReplyDeleteOke.. Link Exchange...skrg sung sy pasang di blogrollku..silahkan check di abjad B dan R gan.. ;)
penuh sekali blognya mas
ReplyDelete@mawardi:
ReplyDeleteapa yg penuh sob.. :D
Gan saya kok jadi g ngudeng ea...udah tak coba 2 kali gagal trus.....itu kode di atas setelah di COPAS perlu di edit lagi ea tata letaknya...mohon bantuan
ReplyDeletehttp://warisansylva.blogspot.com/
gan ni yg saya coba kok mleset dr perkiraan ea,,kira2 salahna dmn ea ???
ReplyDeletehttp://img219.imageshack.us/img219/69/14345762.jpg
http://img257.imageshack.us/img257/1659/62765147.jpg
bagus banget mas... bantu saya yang lagi belajar ya......
ReplyDeletehebat bro!!
ReplyDeleteLink exchange bro!!!!
@Warisan:
ReplyDelete..oke nanti saya bantu... tungu sbentar ya..:)
@acep miftahul anwar:
ReplyDeleteiya sob.. akan dibantu... ;)
@si-stmik-mdp2010:
ReplyDeleteOke Link Exchange ya.. ;)
Terima kasih info bloggernya .. cara menjelaskannya cukup detail dan mudah dipahami.
ReplyDeletenumpang copy...
ReplyDeleteLangkah kedua nya kok tidak ada kode script di edit html aku yah..??
ReplyDeletetolong saya gan.;)
salam, ana buat pake css menu generator (www.mycssmenu.com) dgn script html d laman elemen (cm klo d laman edit html lupa apa pake script jg/tdk), tp ketika kursor diarahkan k menu, bagian bawahnya sprti postingan &widget malah turun, apanya yang salah, ya? mohon dilihat
ReplyDeleteAnak'nya komeng keren Blogging'nya....
ReplyDelete@Ahmad:
ReplyDeletebaguslah kalo mudah dipahami.. :)
@vj Not-i:
ReplyDeletepasti ada...kn cuma kode body script.. coba dicentang dulu expand template widget blognya..
@derdekind:
ReplyDeleteoww.. ehm.. kayaknya kamu masukin script menunya ke bagian posting.. bukan di header... coba di check lagi gan..cari bagian header menu... atau bisa jg setingan CSS-nya ada yang salah.. kayaknya widht sm high = brp gituu..
@Zainal Mubarox:
ReplyDelete:D haha.. bisa aj gan..
nice tutorial ni..
ReplyDeletegan uda saya follow balik tu..
tukarin link yu..?
keren bgt.......sukses dah
ReplyDelete@arsitektur blogger:
ReplyDeleteberes gan.. udh sy FOLLOW n LINKmu sdh trpasang.. :)
@rickyMJ:
ReplyDeletethx gan.. ;)
wah aq jd malu nich,kan aq ru buat blog tuch,belum ada postingan,cuma lagi ngedit tampilannya doank
ReplyDeletehehhehe
@rickyMJ:
ReplyDeletegkppa..riz.. tdk ada bedanya blogger pemula dg blogger senior.. kebetulan kami saja yang duluan blogging..otomatis ilmu bloggernya jadi tahu duluan.. :)
Kren gan Postingan y',,, V' msih bnyak yang mw d pljari,,, tlong bmbingannya ya,,,,
ReplyDeleteplease visit my blog
www.syahrulhadi.blogspot.com
@Syahrul Hadi:
ReplyDeletemudah2an sy bisa membantu gan.. :)
msh perlu bnyk belajar neh ane bro,,, ckckckkk
ReplyDeletekeren2,,,, :-)
@Cysers:
ReplyDeletemari sma2 saling sharing knowledge ttng blogspot..
Wah keren banget artikelnya, sayang di pasang di blogku gak bisa.
ReplyDelete@budi2610:
ReplyDeletegk bisa ya.. emg sih ada bbrp template blog yg kdg gk bisa dipasang widget tertentu...
kk masa galat sih....
ReplyDeletenamanya sama aja boong dunk
kk ecaknyo
numpang lapak ye...
http://agocheateryph.blogspot.com
bagaimana cara memberi link adf.ly di blog
ReplyDelete?
gan kok di tpt saya ga ada header wraper ato bodynya ya?mohon bantuannya
ReplyDeletema kasih..keren menu nya..tapi nyoba lom berhasil..hehe
ReplyDeleteWaaahhhhh.. T.O.P.B.G.T mas....
ReplyDeletesaluutt sallutt buat bang ecaknyo.... :D
ijin copas bang.... :)
salam kenal dari kingkong... ;)
dah aku fooloow gan, infonya berguna banget buat alu yg masi pemula.
ReplyDeletethanks gan.
jangan lupa followbck yah.
gb
ruwet banget =))
ReplyDelete:-L
ReplyDeleteGan ko saya drop down nya di bawah terus gi mna cara naruh drop downnya ke atas gan...
ReplyDeletehahah maaf masih newbie
wah rumit juga nih caranya ya, kalo mau nyoba harus save template dulu biar aman. btw thanks tipsnya sob.
ReplyDeletegan nga ketemu kode < body > nya
ReplyDeletemas saya menemukan kode yang salah mas...karena saya cobak error... kode "]]>" ada dua... jadinya error... jadi saya hapus saja yang satunya... alhamdulillah sukses gan.... makasih gan...
ReplyDeletekok we malah di bawah menunya gimana gan please check dulu ya :D :D
ReplyDelete:))
ReplyDeletethank artikelnya keren bangeet
ReplyDeletewah bagus oom...
ReplyDeletemampir dan do follow yah...
mantap gan. mksh ye
ReplyDeleteMasih bingun gan...
ReplyDeletethanks gan,
ReplyDeleteane udah coba dan udah berhasil,
cuma yang saya mau tanyakan,
gimana caranya pengen menu di dalem menu barnya itu aga ketengah, yang saya masih ada dipinggir??
mohon penjelasannya ..
gan di blog saya ini :
ReplyDeletediv id='header-wrapper'>
ga ada
ne juga ga da :
]]></b:skin>
mohon bimbingan nya :)
thankz :) :D
sangat bagus tapi q blum paham gan,..........=))
ReplyDelete:-t
ReplyDeletegan sudah saya follow,, follow back yaww http://ade-nophiette.blogspot.com
ReplyDeletemantap sob.....
ReplyDeletekunjung balik http://majasari31.blogspot.com
coba dulu sob,,,,
ReplyDeletemampir ya di mari :
Tips KOmputer. Download lagu. Info Terbaru. thanks!
informasi menarik dropdown. terima kasih
ReplyDeleteane nga bisa hannn...
ReplyDeletetapi nice share..
kunjungi blog kami yaaaa...
http://kmkosipil.blogspot.com
makasih bos..
ReplyDeletesaya langsung ke TKP nih