Mostrando postagens com marcador modelo de menu horizontal. Mostrar todas as postagens
Mostrando postagens com marcador modelo de menu horizontal. Mostrar todas as postagens

modelo de menu horizontal para blog

Modelo de menu horizontal ,
para blogger:

tutorial:

cole acima ]]></b:skin>
de




o código:
 ▼
  
/* Menu */

#menu {
    height: 70px;
}

#menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

#menu li {
    display: inline;
}

#menu a {
    display: block;
    float: left;
    width: 140px;
    height: 45px;
    padding-top: 25px;
    text-transform: lowercase;
    text-decoration: none;
    text-align: center;
    letter-spacing: -2px;
    font-size: 30px;
    color: #B8BD52;
}

#menu a:hover {
    color: #1A1A1A;
    background: url(endereço de sua imagem) no-repeat;
}







Salve!


 Querendo que o menu fique acima do cabeçalho  do template:



Depois,
em editar html...
...encontre  por 
 <header>
e
acima de
<header>
cole:




Optando por colocar 
o código do menu 
no 
"lay-out" do template,
...clica em  
"adicionar
gadget"...

...em seguida:


copie
cole
o código,


<div id='menu'>
        <ul>
            <li class='first'><'URL DO LINK'>Home</a></li>
            <li><a expr:href='
URL DO LINK'>LINK</a></li>
            <li><a expr:href='
URL DO LINK'>LINK2</a></li>
            <li><a href='
URL DO LINK' title='título DO LINK'>título DO LINK</a></li>
            <li><a href='
URL DO LINK' title='título DO LINK'>título DO LINK</a></li>
         
         
         
        </ul>
    </div>
    </div>










confira, um modelo, clicando  
a seguir :

►demontração◄





Querendo que o menu fique abaixo do cabeçalho  (header)  
no template do blog :


copie e cole acima de </header>  o código:




<div id='menu'>
        <ul>
            <li class='first'><'URL DO LINK'>Home</a></li>
            <li><a expr:href='
URL DO LINK'>LINK</a></li>
            <li><a expr:href='
URL DO LINK'>LINK2</a></li>
            <li><a href='
URL DO LINK' title='título DO LINK'>título DO LINK</a></li>
            <li><a href='
URL DO LINK' title='título DO LINK'>título DO LINK</a></li>
         
         
         
        </ul>
    </div>
    </div>



----------------------------------------------------------------------------------------

...</header> se quiser seu menu abaixo do cabeçalho, 
... <header> se quiser seu menu acima do cabeçalho,


►exemplos 
de modelos 
de imagem:

Você escolhe os seus modelos 
de imagens
preferidos!



Estes são os meus:

1.
 

URL da imagem: "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgU3DojgPZdwOOS2KPreaZPJO5UG49H-cv5bcLTHpNy2ETO2CIuGI5gJeK13fdfGL108jkfkMOgfCt4wb2JCTMw35rQIGWSgPhPqxWxl3-IiRqfctHvtWhmo8qp-lV8JLVB0YkN_q8rAxGG/s320/naturaazul03.jpg"




2.
URL da imagem= " https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgr8VyizGy6XbfFxu4WnIbNqW8ZA643K_s4id0OZt94gJAYU5KJjS3mFeSax0_tUA3QkS4508IrooxuykGC5Of6pMz7ocmJqrce4YkBBgZf00HZotMKCx0SLlcE_ceYcmsCNoT_U36qNRoC/s320/naturaferrugem03.jpg"















Twitter Facebook Google Plus LinkedIn RSS Feed Email