2017

cu reduceri

Cum sa adaugi un meniu orizontal pe blog

Meniul este unul din cele mai importante parti a unui site sau blog, el oferind vizitatorilor un acces mult mai usor la continutul blogului

In optiunile pe care Blogger le are nu se numara,si posibilitatea de a face pagini statice.
In acest caz trebuie sa facem singuri acest lucru,modificand codul sablonului, lucru care nu e chiar usor pentru cineva care nu se pricepe.

Pentru a usura munca vreau sa va arat o cale destul de usoara de a va pune meniu pe blog, doar cu o mica modificare a coduli html.

Pentru inceput mergeti Aspect --> Editati Html si cautati urmatoarea linie de cod:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

Dupa ce ati gasit-o (folositi Ctrl+F) schimbati pe 1 cu 3 si pe no cu yes, apoi salvati sablonul.

Mergeti la pagina "Elemente de pagina" si veti observa acum ca aveti posibilitatea de a aduga un obiect gadget deasupra header-ului.

Clik pe Adaugati un element gadget si alegeti optiunea html/JavaScript. Copieaza urmatorul cod html de mai jos si lipestel in campul pentru continut.

COD HTML:

<style type="text/css">

#meniu {
margin-left:-40px;
}

#meniu ul li{
display:inline;
list-style-type: none;
font-size:120%;
font-weight: bold;
padding:0px;
margin:0px;
}

#meniu li a{
margin:2px;
padding:5px 10px 5px 10px;
color:#ffffff;
background-color:#2D0089;
border:1px solid #FF6702;
}

#meniu li a:hover {
color: #ffffff;
background: #3CC3FD;
}
</style>

<div id="meniu">
<ul>
<li><a href="http://url-ul tau">Acasa</a></li>
<li><a href="http://url-ul tau">Feed</a></li>
<li><a href="http://url-ul tau">Contact</a></li>
<li><a href="http://url-ul tau">Informatii</a></li>
</ul>
</div>


Inlocuiti ce este scris cu rosu "http://url-ul tau" cu url-ul paginilor care va intereseaza, iar ce este cu albastru inlocuiti-le cu numele paginilor alese
Salvati editarea si gata avesti instalat meniul pe blog.
De asemenea ai posibilitatea de a modifica anumiti parametri cum ar fi: textul mai mic sau mai mare,sau vrei ca meniul sa apara in partea stanga sau dreapta.

Aeste modificari le explic mai jos,am copiat din nou codul html si am notat in dreptul fiecarui parametru ce se poate modifica.

Exemplu de modificari cod:

#meniu ul li{
display:inline;
list-style-type: none;
font-size:120%; - modifica marimea textului in procente
font-weight: bold; - face textul bold; pentru text normal inlocuiti bold cu normal
padding:0px;
margin:0px;
}

#meniu li a{
margin:2px; - mareste distanta intre texte
padding:5px 10px 5px 10px; - pune o distanta intre text si bordura care inconjuara textul; sus - dreapta - jos - stanga
color:#ffffff; - modifica culoarea textului
background-color:#2D0089; - modifica fundalul textului
border:1px solid #FF6702; - pune o bordura in jurul textului; 1 = grosimea bordurii; #FF6702 = culoarea bordurii
}

#meniu li a:hover {
color: #ffffff; - modifica culoarea textului la mouseover(atunci cand treceti mouse-ul peste text
background: #3CC3FD; - modifica fundalul textului la mouseover
border:1px solid #FF6702; - modifica bordura la mouseover
}


Daca intampini vre-o problema atunci lasati un comentariu si voi incerca sa te ajut.

10 comentarios:

  1. Problema mea este că, deşi am pus gadgetul Pagini sub antet, meniul este tot vertical şi nu orizontal. :)

    RăspundețiȘtergere
  2. Salut Talitha daca acesta este blogul tau http://incep-sa-pierd.blogspot.com/ in acest caz header-ul este mai mic in latime decat marinea meniul-ui si din acest motiv iti apare pe verticala,trebuie sa mareti header-ul sau sa renunti la o optiune din meniu.

    RăspundețiȘtergere
  3. Mulţumesc foarte mult pentru răspuns.

    RăspundețiȘtergere
  4. cum pot adauga in menu orizontal va rog, lista mea de bloguri sau arhiva articolelor scrise. mii de multumiri!

    RăspundețiȘtergere
  5. Victor nu am inteles intrebarea! revino cu o explicatie.

    RăspundețiȘtergere
  6. Am creat un meniu pe orizontala cu ajutorul indrumarilor pentru care va sunt recunoscator si as dori ca unul butoanele din acest menu sa contina ce am adaugat in dreapta la widget- adica un buton sa zicem "Arhiva" alt buton din meniu sa te trimita la "Blogurile mele" etc...Cred ca e mai dificil daca nu imposibil, poate pot detalia pe o adresa de email daca aveti.

    mii de multumiri!

    RăspundețiȘtergere
  7. Victor, am inteles ce vrei tu dar este foarte complicat sa adaugi de exp: directia url de "Arhiva" , in ce priveste "Blogurile mele" este mai simplu dai click pe acel vidget "Blogurile mele" si copiezi adresa URL din bara de directie si il adaugi in meniul orizontal ori unde doresti clar cu schimbarea si a textului ce vrei sa apara. Bafta.

    RăspundețiȘtergere
  8. Am inteles. Banuiam ca e greu...Am sa mai caut. Multumesc frumos !

    RăspundețiȘtergere
  9. Am reusit sa aplic tot ce scrie in acest articol dar as vrea sa stiu cum sa pun articolele in categoria selectata

    RăspundețiȘtergere
  10. Inlocuieste in cod ce este de culoare rosie cu link-ul pagini,subpaginii sau unde vrei tu sa-ti directioneze!

    RăspundețiȘtergere

Bine ai venit!
In continuare poti lasa mesajul tau.

Multumesc