Mybb Menü Yapımı Dersi / By OnLiNe

[OnLiNe]

Merhaba arkadaşlar bu aralar herkes menü yapma peşinde koşuyor bende daha kolay bir şekilde yapabileceğiniz bir menü yapma dersi hazırladım.

Gerekli malzemeler: 2 adet menü resmi boyutları size kalmış kod içerisinde ayarlayabilirsiniz.Şu boyutta da resimler olabilir.


Öncelikle Admin kp >> Şablonlar >> Header >> Headere girererek oradaki menü kodunu siliyoruz ve şu kodu ekliyoruz.

Kod: Tümünü Seç Tümünü Kopyala

<div id="cssmenu">
    <div id="menulink">
                  <li><a href="{$mybb->settings['bburl']}" title="Anasayfa">ANASAYFA</a></li>
                  <li><a href="portal.php" rel="nofollow" title="Portal">PORTAL</a></li>
                  <li><a href="memberlist.php" rel="nofollow" title="Üyeler">ÜYE LİSTESİ</a></li>
                  <li><a href="misc.php?action=help" rel="nofollow" title="Yardım ?">YARDIM</a></li>
                  <li><a href="calendar.php" rel="nofollow" title="Takvim">TAKVİM</a></li>
                  <li><a href="#" rel="nofollow" title="Reklam">REKLAM</a></li></div>

Daha sonra Admin kp >> Temalar >> Kullanılan Tema >> Css Oluştur >>

Css başlığına şunu yazıyoruz.

Kod: Tümünü Seç Tümünü Kopyala

cssmenu.css

Geneli işaretliyoruz >> Kendi İçeriğimi Yaz ve şu kodu ekliyoruz.

Kod: Tümünü Seç Tümünü Kopyala

#cssmenu {
    height:35px;
        width: 592px;
    margin: auto auto;
    overflow:hidden;
        background: url(http://c1303.hizliresim.com/17/j/l3wu3.png);
    text-transform:uppercase;
    -webkit-border-top-left-radius: 2px;
    -webkit-border-top-right-radius: 2px;
    -moz-border-radius-topleft: 2px;
    -moz-border-radius-topright: 2px;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
}
    
#menulink {
    margin: 0px auto;
        width: 100%;
    padding:0px 0px;
    }
    
#menulink li {
    float: left;
    list-style: none;
    margin: 0;
    margin-top: -5px;
    padding: 0;
    }
    
#menulink li a {
    color: lightblue;
    display: block;
        margin: 0;
    padding: 15px 15px 18px 15px;
    position: relative;
        border-right: 1px solid rgba(255, 255, 255, 0.22);
    font-size: 15px;
        font-weight: bold;
        font-family: "Arial";
    }

#menulink li a:hover, #menulink li a:active {
    color: white;
    background: url(http://c1303.hizliresim.com/17/j/l3wum.png);
}

kaydediyoruz.

Menümüz hazır hale gelmiştir.Cssmenu.css den menü içeriğini kendinize göre ayarlayabilirsiniz.


Bunlardan benden..





Anlatım kodlama bana aittir.

[LastWorld]

Müthişsiniz . Rep+

[OnLiNe]

Rep için teşekkür ederim.

[ASi]

Eline Sağlık Kardeşim...

[OnLiNe]

Rica ederim.Yorumlarınızı Bekliyorum...

[TaaRRuz]

Kod: Tümünü Seç Tümünü Kopyala

<div id="cssmenu">
    <div id="menulink">
                  <li><a href="{$mybb->settings['bburl']}" title="Anasayfa">ANASAYFA</a></li>
                  <li><a href="portal.php" rel="nofollow" title="Portal">PORTAL</a></li>
                  <li><a href="memberlist.php" rel="nofollow" title="Üyeler">ÜYE LİSTESİ</a></li>
                  <li><a href="misc.php?action=help" rel="nofollow" title="Yardım ?">YARDIM</a></li>
                  <li><a href="calendar.php" rel="nofollow" title="Takvim">TAKVİM</a></li>
                  <li><a href="#" rel="nofollow" title="Reklam">REKLAM</a></li></div>

Bu kodda eksikler var mesela normalde

ile başlaması gerekir menünün.Daha sonra

[Şükrü K.]

Ellerine Sağlık Dost. :)

[OnLiNe]

Kod: Tümünü Seç Tümünü Kopyala

<div id="cssmenu">
    <div id="menulink">
                  <li><a href="{$mybb->settings['bburl']}" title="Anasayfa">ANASAYFA</a></li>
                  <li><a href="portal.php" rel="nofollow" title="Portal">PORTAL</a></li>
                  <li><a href="memberlist.php" rel="nofollow" title="Üyeler">ÜYE LİSTESİ</a></li>
                  <li><a href="misc.php?action=help" rel="nofollow" title="Yardım ?">YARDIM</a></li>
                  <li><a href="calendar.php" rel="nofollow" title="Takvim">TAKVİM</a></li>
                  <li><a href="#" rel="nofollow" title="Reklam">REKLAM</a></li></div>

Bu kodda eksikler var mesela normalde <ul> ile başlaması gerekir menünün.Daha sonra </div> 'ler kapatılmamaış.Bunun özel bir sebebi var mı? Yani bu şekilde yapınca farklı bir çıktı mı elde ediyoruz?

<ul> ve <li> birbirine benzer kodlar bu şekilde kodladım yani kodda eksik yok.

[meta the god]

Teşşekürler Kardeşim :)

Destek Forumunun Tek Coderi Sensin :)

[Zoom]

Aslında yeni css eklemek yerine varsayılan menu css koduna biraz ekleme yaparak daha güzel yapabiliriz aynı şey çıkar yine ortaya ama :)

[OnLiNe]

Rica ederim.

[TaaRRuz]

Kod: Tümünü Seç Tümünü Kopyala

<div id="cssmenu">
    <div id="menulink">
                  <li><a href="{$mybb->settings['bburl']}" title="Anasayfa">ANASAYFA</a></li>
                  <li><a href="portal.php" rel="nofollow" title="Portal">PORTAL</a></li>
                  <li><a href="memberlist.php" rel="nofollow" title="Üyeler">ÜYE LİSTESİ</a></li>
                  <li><a href="misc.php?action=help" rel="nofollow" title="Yardım ?">YARDIM</a></li>
                  <li><a href="calendar.php" rel="nofollow" title="Takvim">TAKVİM</a></li>
                  <li><a href="#" rel="nofollow" title="Reklam">REKLAM</a></li></div>

Bu kodda eksikler var mesela normalde

ile başlaması gerekir menünün.Daha sonra

[OnLiNe]

Kod: Tümünü Seç Tümünü Kopyala

<div id="cssmenu">
    <div id="menulink">
                  <li><a href="{$mybb->settings['bburl']}" title="Anasayfa">ANASAYFA</a></li>
                  <li><a href="portal.php" rel="nofollow" title="Portal">PORTAL</a></li>
                  <li><a href="memberlist.php" rel="nofollow" title="Üyeler">ÜYE LİSTESİ</a></li>
                  <li><a href="misc.php?action=help" rel="nofollow" title="Yardım ?">YARDIM</a></li>
                  <li><a href="calendar.php" rel="nofollow" title="Takvim">TAKVİM</a></li>
                  <li><a href="#" rel="nofollow" title="Reklam">REKLAM</a></li></div>

Bu kodda eksikler var mesela normalde <ul> ile başlaması gerekir menünün.Daha sonra </div> 'ler kapatılmamaış.Bunun özel bir sebebi var mı? Yani bu şekilde yapınca farklı bir çıktı mı elde ediyoruz?

<ul> ve <li> birbirine benzer kodlar bu şekilde kodladım yani kodda eksik yok.

Kodda eksik var.Mesela bunu bir scriptte çalıştırman zor.Çünkü normalde menu kodları:

Kod: Tümünü Seç Tümünü Kopyala

<ul>
<li><a href="#">Link Adı</a></li>
</ul>

Evet sadece bu şekilde çalışıyor ama kod çakışması için açılış ve kapanış tagları önemli.Bende sandım ki farklı bir amaç için bu şekilde yazdın.Yani bu şekilde farklı birşeyi daha sağlıyorsun sandım.O yüzden sordum.Her neyse onun dışında anlatım güzel eline sağlık.

Teşekkür ederim.

[Furkomm]

Eline sağlık :).

[OnLiNe]

Teşekkürler.

[OnLiNe]

Güncel..

[Kamil55]

teşşekürler çok iyisin işinde ve rütbendede hakkını yememek için rep verioyum

[OnLiNe]

teşşekürler çok iyisin işinde ve rütbendede hakkını yememek için rep verioyum

Rica ederim.

[Kamil55]

ve imzandaki menü yapım dersi çok yakında kaldır bence

[OnLiNe]

ve imzandaki menü yapım dersi çok yakında kaldır bence

Unutmuşum teşekkürler hatırlattın :)