1. Halo Guest, pastikan Anda selalu menaati peraturan forum sebelum mengirimkan post atau thread baru.

Cara membuat sub menu di blogspot ???

Discussion in 'Blogger/Blogspot' started by richskrenta, Mar 16, 2009.

Tags:
Page 2 of 2
  1. enursa

    enursa Newbie

    Joined:
    Mar 28, 2011
    Messages:
    24
    Likes Received:
    0
    Tinggal atur di CSS nya gan....

    Trus tambahain code...

    <ul>
    <li><a href="#">Software</a>
    <ul>
    <li><a href="">sub menu 1</a></li>
    <li><a href="">sub menu 2</a></li>
    <li><a href="">sub menu 3</a></li>
    <li><a href="">sub menu 4</a></li>
    <li><a href="">sub menu 5</a></li>
    <li><a href="">sub menu 6</a></li>
    </ul>
    </li>
    </ul>

    Semoga bermamfaat
     
    enursa, Mar 28, 2011
    #21
  2. masroy

    masroy Hero

    Joined:
    Jun 26, 2010
    Messages:
    613
    Likes Received:
    572
    Location:
    Bumi Alloh
    search aja di gugel. banyak kok yang bahas kek gini. kalo aku sih, seneng pake yang udah jadi aja. kekeke...
     
    masroy, Mar 28, 2011
    #22
  3. teknikamedia

    teknikamedia Newbie

    Joined:
    Apr 5, 2011
    Messages:
    7
    Likes Received:
    0
    Location:
    Ngayogyokarto
    wew... manjatt...manjatt..... ternyata pada mbahas menu pepohonan... klo aku biasanya maen di template download'an terus tak edit dalemannya... hehhehhe /:):-$
     
    teknikamedia, Apr 5, 2011
    #23
  4. nnttoo

    nnttoo Super Hero

    Joined:
    Apr 16, 2010
    Messages:
    1,260
    Likes Received:
    620
    Nih Tak kasih Sub menu yang modal CSS aja tanpa Javascript
    udah pasang kode style CSS nya di tempatnya,, moda udah pada tahu tempatnya,,,
    mau nyobain kopi aja semua ke file.html pake notpade, trus jalankan di browser ni kodenya,,,


    HTML:
    <html>
<head>
<style type="text/css">
/* begin Menu */
/* menu structure */

.adsense-id-menu a, .adsense-id-menu a:link, .adsense-id-menu a:visited, .adsense-id-menu a:hover
{
    text-align:left;
    text-decoration:none;
    outline:none;
    letter-spacing:normal;
    word-spacing:normal;
}

.adsense-id-menu, .adsense-id-menu ul
{
    margin: 0;
    padding: 0;
    border: 0;
    list-style-type: none;
    display: block;
}

.adsense-id-menu li
{
    margin: 0;
    padding: 0;
    border: 0;
    display: block;
    float: left;
    position: relative;
    z-index: 5;
    background:none;
}

.adsense-id-menu li:hover
{
    z-index: 10000;
    white-space: normal;
}

.adsense-id-menu li li
{
    float: none;
}

.adsense-id-menu ul
{
    visibility: hidden;
    position: absolute;
    z-index: 10;
    left: 0;
    top: 0;
    background:none;
}

.adsense-id-menu li:hover>ul
{
    visibility: visible;
    top: 100%;
}

.adsense-id-menu li li:hover>ul
{
    top: 0;
    left: 100%;
}

.adsense-id-menu:after, .adsense-id-menu ul:after
{
    content: ".";
    height: 0;
    display: block;
    visibility: hidden;
    overflow: hidden;
    clear: both;
}
.adsense-id-menu, .adsense-id-menu ul
{
    min-height: 0;
}

.adsense-id-menu ul
{
    background-image: url(images/spacer.gif);
    padding: 10px 30px 30px 30px;
    margin: -10px 0 0 -30px;
}

.adsense-id-menu ul ul
{
    padding: 30px 30px 30px 10px;
    margin: -30px 0 0 -10px;
}





/* menu structure */

.adsense-id-menu
{
    padding: 12px 6px 0px 6px;
}

.adsense-id-nav
{
    position: relative;
    height: 39px;
    z-index: 100;
}

.adsense-id-nav .l, .adsense-id-nav .r
{
    position: absolute;
    z-index: -1;
    top: 0;
    height: 39px;
    background: #ff0000;
}

.adsense-id-nav .l
{
    left: 0;
    right:0px;
}

.adsense-id-nav .r
{
    right: 0;
    width: 874px;
    clip: rect(auto, auto, auto, 874px);
}


/* end Menu */

/* begin MenuItem */
.adsense-id-menu ul li
{
    clear: both;
}

.adsense-id-menu a
{
    position:relative;
    display: block;
    overflow:hidden;
    height: 27px;
    cursor: pointer;
    text-decoration: none;
    margin-right: 2px;
    margin-left: 2px;
}


.adsense-id-menu a .r, .adsense-id-menu a .l
{
    position:absolute;
    display: block;
    top:0;
    z-index:-1;
    height: 81px;
    background: #000ff;
}

.adsense-id-menu a .l
{
    left:0;
    right:4px;
}

.adsense-id-menu a .r
{
    width:408px;
    right:0;
    clip: rect(auto, auto, auto, 404px);
}

.adsense-id-menu a .t 
{
font-family: Arial, Helvetica, Sans-Serif;
font-size: 12px;
font-style: normal;
font-weight: normal;
    color: #DDE0DC;
    padding: 0 9px;
    margin: 0 4px;
    line-height: 27px;
    text-align: center;
}

.adsense-id-menu a:hover .l, .adsense-id-menu a:hover .r
{
    top:-27px;
}

.adsense-id-menu li:hover>a .l, .adsense-id-menu li:hover>a .r
{
    top:-27px;
}

.adsense-id-menu li:hover a .l, .adsense-id-menu li:hover a .r
{
    top:-27px;
}
.adsense-id-menu a:hover .t
{
    color: #232622;
}

.adsense-id-menu li:hover a .t
{
    color: #232622;
}

.adsense-id-menu li:hover>a .t
{
    color: #232622;
}


.adsense-id-menu a.active .l, .adsense-id-menu a.active .r
{
    top: -54px;
}

.adsense-id-menu a.active .t
{
    color: #0C0E0C;
}


/* end MenuItem */

/* begin MenuSubItem */
.adsense-id-menu ul a
{
    display:block;
    text-align: center;
    white-space: nowrap;
    height: 20px;
    width: 180px;
    overflow:hidden;
    line-height: 20px;
    margin-right: auto;
    background: #ccc;
    background-position: left top;
    background-repeat: repeat-x;
    border-width: 0px;
    border-style: solid;
}

.adsense-id-nav ul.adsense-id-menu ul span, .adsense-id-nav ul.adsense-id-menu ul span span
{
    display: inline;
    float: none;
    margin: inherit;
    padding: inherit;
    background-image: none;
    text-align: inherit;
    text-decoration: inherit;
}

.adsense-id-menu ul a, .adsense-id-menu ul a:link, .adsense-id-menu ul a:visited, .adsense-id-menu ul a:hover, .adsense-id-menu ul a:active, .adsense-id-nav ul.adsense-id-menu ul span, .adsense-id-nav ul.adsense-id-menu ul span span
{
    text-align: left;
    text-indent: 12px;
    text-decoration: none;
    line-height: 20px;
    color: #474024;
font-family: Arial, Helvetica, Sans-Serif;
font-size: 12px;
font-style: normal;
font-weight: normal;
}

.adsense-id-menu ul ul a
{
    margin-left: auto;
}

.adsense-id-menu ul li a:hover
{
    color: #F8F7F1;
    background-position: 0 -20px;
}

.adsense-id-menu ul li:hover>a
{
    color: #F8F7F1;
    background-position: 0 -20px;
}

.adsense-id-nav .adsense-id-menu ul li a:hover span, .adsense-id-nav .adsense-id-menu ul li a:hover span span
{
    color: #F8F7F1;
}

.adsense-id-nav .adsense-id-menu ul li:hover>a span, .adsense-id-nav .adsense-id-menu ul li:hover>a span span
{
    color: #F8F7F1;
}


/* end MenuSubItem */

  </style>
</head>
<div class="adsense-id-nav">
                    <div class="l"></div>
                    <div class="r"></div>
                    <ul class="adsense-id-menu">
                        <li>
                            <a href="#" class=" active"><span class="l"></span><span class="r"></span><span class="t">Home</span></a>
                        </li><li><span class="adsense-id-menu-separator"></span></li>
                        <li>

                            <a href="#"><span class="l"></span><span class="r"></span><span class="t">Menu Item</span></a>
                            <ul>
                                <li><a href="#">Menu Subitem 1</a></li>
                                <li><a href="#">Menu Subitem 2</a></li>
                                <li><a href="#">Menu Subitem 3</a></li>
                            </ul>
                        </li><li><span class="adsense-id-menu-separator"></span></li>

                        <li>
                            <a href="#"><span class="l"></span><span class="r"></span><span class="t">About</span></a>
                        </li>
                    </ul>
                </div>
</html>
    Sok Di pelajari sendiri,,
     
    nnttoo, Apr 5, 2011
    #24
  5. riFFrizz

    riFFrizz Super Hero

    Joined:
    Jan 7, 2011
    Messages:
    1,531
    Likes Received:
    325
    Location:
    Kotareyog
    nggak bisa kayaknya kalok di blogspot, kecuali kalok dibuat dari tempaltenya, walaupun sebenernya tingkat kategorinya sejajar, kalok di wp kan ada kategori, sub kategori, CMIIW
     
    riFFrizz, Apr 5, 2011
    #25
  6. nnttoo

    nnttoo Super Hero

    Joined:
    Apr 16, 2010
    Messages:
    1,260
    Likes Received:
    620
    Loh yang di tanyain itu Sub Menu apa Sub Kategory sih??? Kalau di Blogspot itu setahu saya gak ada Category maupan Tag,, adanya Label,, entah itu persamaanya label itu apa,, yang jelas,, Permaling Label itu gak di index ama Google,, karena nantinya permalinknya kayak gini /search/label/nama labelnya,, sedangkan directory search itu dah di block duluan gak akan di index ama google,
     
    nnttoo, Apr 7, 2011
    #26
  7. DollarsHunter$$$

    DollarsHunter$$$ Banned

    Joined:
    Mar 25, 2011
    Messages:
    504
    Likes Received:
    671
    Location:
    ALEXIS CROWN KING KROZ, etc
    submenu kan gampang tinggail add new page aja selesai... perkara
     
    DollarsHunter$$$, Apr 10, 2011
    #27
  8. mullenmullen

    mullenmullen Newbie

    Joined:
    Jul 10, 2011
    Messages:
    3
    Likes Received:
    0
    gan, ane baru gabung ni...mohon diterima ya....:">
    ane udah nyoba tu tutorial yang dikasih di atas, tapi jadi berantakan menu nya gan di blog ane

    ane kan udah buat page baru, nah ane mau nanya juga ni buat nambah sub pagenya bisa gak kira2 di blog spot?
     
    mullenmullen, Jul 10, 2011
    #28
  9. pitnat

    pitnat Ads.id Pro

    Joined:
    Sep 22, 2011
    Messages:
    406
    Likes Received:
    10
    Location:
    Strategis

    Ini baru master Coding2
    Makasih gan, ane langsung praktek:kiss:
    Tapi belum diedit2 sesuai Salero Bundo

    Ni hasilnya...
    Code:
    http://bloguntukpercontohan.blogspot.com
    [​IMG]
    kalo yg ini rada mudeng, kalo thread agan yg auto post php aisuwer mumet :ha?:
    Sering2 share ya Master, terutama untuk hack blogger, ane ikutin terus loh thread enete :komunis:
     
    pitnat, Dec 20, 2011
    #29
  10. LaskarRungkut

    LaskarRungkut Newbie

    Joined:
    Jul 16, 2009
    Messages:
    18
    Likes Received:
    0
    liat liat dulu
     
    LaskarRungkut, Dec 24, 2011
    #30
Page 2 of 2

Share This Page