Navigare rapidă

Ultimele subiecte
» Tema noua pe Extrem Tutorials
Scris de DariusBr Astazi la 14:30
» Generator coduri html pentru culori
Scris de Tibi16 Mier 19 Apr - 16:04
» Bine v-am gasit !
Scris de Joker#King Mier 12 Apr - 12:50
» Summer v1.1 theme
Scris de MihaiExtremTutorials Mier 5 Apr - 2:44
Cuvinte-cheie

subforumuri  Metin2  cautare  menu  Bara  edit  ultimele  avatar  banner  html  navigare  animate  meniu  chenar  tema  tutorial  reclama  drop  legenda  Statistici  profil  radio  Mesaje  pentru  phpBB2  punbb  

Rainbow meniu pentru phpbb2


Salut sunt Sabin ;x si va prezint un meniu simplu si elegant

Previzualizare live Click aici

[Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine]

1.intrati in PA > Afisare > Template-uri > General > overvall_header
cautati acest cod si stergeti-l


Cod:

<table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
              <tr>
                  <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
              </tr>
            </table>

Acum cautati acest cod


Cod:
 <table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center">
      <tr>
        <td class="bodyline">

Dupa el adaugati


Cod:
 <table id="main-nav" cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
              <tr>
                  <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
              </tr>
            </table>
Inregistrati si publicati template-ul


2.Personalizare in CSS


Cod:

#main-nav {
  background: #2A2A2A;
background: rgb(244,244,244); /* Old browsers */
background: -moz-linear-gradient(top,  rgb(244,244,244) 0%, rgb(255,255,255) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(244,244,244)), color-stop(100%,rgb(255,255,255))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgb(244,244,244) 0%,rgb(255,255,255) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgb(244,244,244) 0%,rgb(255,255,255) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgb(244,244,244) 0%,rgb(255,255,255) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgb(244,244,244) 0%,rgb(255,255,255) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f4f4', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */

border-bottom: 1px solid #CDCDCD;
  border-top: 1px solid #CDCDCD;
text-shadow: 0px 0px 2px black;
color: white;
  position: relative;
  bottom: 9px;
  border-radius: 0px 0px 10px 10px;
height: 35px;
  border: 1px solid white;
  box-shadow: 0px 0px 5px black
}


3.Mergem in pa/afisare/administrare imagini si adaugam imaginile dorite la meniul de navigare


[Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine]

4.Intram iar in pa/afisare/antet si nagigare si selectam:



[Trebuie sa fiti inscris si conectat pentru a vedea aceasta imagine]

5.Intram iar in CSS si personalizam meniul : fontul/boldarea/culoarea



Cod:

a.mainmenu {
  

    text-decoration: none;
  font-size: 12px;
  font-style: arial;
font-weight: 800;


}



a[href="/forum"]{
color: #84A724;
  border-left: 1px solid green;
}

a[href="/faq"]{

  color: green;


  
}

a[href="/memberlist"]{


}

a[href="/portal"]{
  color: #1278BB;
}


a[href="/calendar"]{
  color: #BB1248;
}

a[href="/gallery/index.htm"]{
}


a[href="/search"]{
  color: #FF5E00;

}


a[href="/groups"]{
  color: #C128C1;
}


a[href="/profile?mode=editprofile"]{
  color: #018AA9;
}



a[href="/privmsg?folder=inbox"]{
  color: #E0C923;
}



a[href="/register"]{
  color: #E03323;
}

a.mainmenu:last-child {
  color: #FF5E00;
}



Tutorial scris de [Trebuie sa fiti inscris si conectat pentru a vedea acest link]

Copyright Extrem-Tutorials.com - Nici o parte a acestui tutorial nu poate fi reprodusa fara acordul autorului.

Comentariile utilizatorilor
Administrator
avatar
la data de Lun 24 Sept - 7:52
Madross Administrator
Conectat
Frumos tutorial si elegant meniu,felicitari!
Membru ET
avatar
la data de Lun 24 Sept - 15:52
Milky. Membru ET
Conectat
Pe langa meniu imi place foarte mult si tema de pe forumul de la previzualizare. Felicitari!
Membru dedicat
avatar
la data de Lun 24 Sept - 19:31
mr.franta Membru dedicat
Conectat
[Trebuie sa fiti inscris si conectat pentru a vedea acest link] a scris:Pe langa meniu imi place foarte mult si tema de pe forumul de la previzualizare. Felicitari!

multumesc pentru apreciere.acea tema cand o sa fie gata o sa o distribui pe data de 15 octombrie


Winsper a scris:Frumos tutorial si elegant meniu,felicitari!

Mutumesc winsper
Membru premium
avatar
la data de Joi 27 Sept - 14:34
Hissae2 Membru premium
Conectat
Felicitari,este foarte frumos meniul.
Membru veteran
avatar
la data de Mar 16 Oct - 20:00
Raykim Membru veteran
Conectat
Mutat in sectiunea corespunzatoare!
Vizitator
avatar
la data de Dum 21 Oct - 17:01
Vizitato Vizitator
Conectat
Acest tutorial castiga concursul
Membru dedicat
avatar
la data de Dum 21 Oct - 17:05
mr.franta Membru dedicat
Conectat
Multumesc wanse..sa vedem acum..
Vizitator
avatar
la data de Dum 21 Oct - 17:06
Vizitato Vizitator
Conectat
Eu as spune ca acest tutorial s-ar putea realiza si pe punBB, iti cer permisiunea de a incerca sa fac un asemenea tutorial pe punBB.
Membru dedicat
avatar
la data de Dum 21 Oct - 17:07
mr.franta Membru dedicat
Conectat
Merge pe toate versiunile,poti incerca
Membru ET
avatar
la data de Dum 21 Oct - 18:35
Soricelul Membru ET
Conectat
Bun tutorialul, bravo!