Template Window Gray

 Meu primeiro template no Blog,  simples mais com algumas ferramentas instaladas no Template. Espero que gostem, ele foi baseado no template Picture Window do Blogger. Abraços !!!



 

Menu Acordion

Vá  em Design > Elementos da Página > Menu Acordion e faça as mudanças:


<h3 class="mypets">LINK 1</h3>
<div class="thepet">

AQUI DENTRO O QUE QUISER
</div>

<h3 class="mypets">LINK 2</h3>
<div class="thepet">
AQUI DENTRO O QUE QUISER
</div>

<h3 class="mypets">LINK 3s</h3>
<div class="thepet">
AQUI DENTRO O QUE QUISER
</div>

<h3 class="mypets">LINK 4s</h3>
<div class="thepet">
AQUI DENTRO O QUE QUISER
</div>

<h3 class="mypets">LINK 5s</h3>
<div class="thepet">
AQUI DENTRO O QUE QUISER
</div>

<h3 class="mypets">LINK 6s</h3>
<div class="thepet">
AQUI DENTRO O QUE QUISER
</div>

<h3 class="mypets">LINK 7s</h3>
<div class="thepet">
AQUI DENTRO O QUE QUISER
</div>
___________________________




Menu horizontal com efeito expansivel com imagens

Vá  em Design > Elementos da Página > Menu Horizontal e faça as mudanças:


<ul id="navigation">


<li class="link1"><a href="ENDEREÇO DO LINK 1"><span>LINK 1</span></a></li>
<li class="link2"><a href="ENDEREÇO DO LINK 2"><span>LINK 2</span></a></li>
<li class="link3"><a href="ENDEREÇO DO LINK 3"><span>LINK 3</span></a></li>
<li class="link4"><a href="ENDEREÇO DO LINK 4"><span>LINK 4</span></a></li>
<li class="link5"><a href="ENDEREÇO DO LINK 5"><span>LINK 5</span></a></li>
<li class="link6"><a href="ENDEREÇO DO LINK 6"><span>LINK 6</span></a></li>
<li class="link7"><a href="ENDEREÇO DO LINK 7"><span>LINK 7</span></a></li>
<li class="link8"><a href="mailto:ENDEREÇO DO EMAIL"><span>Email</span></a></li>


</ul>


<style>


ul#navigation .link1 a{
background-image: url(ENDEREÇO DA IMAGEM DO LINK 1);}


ul#navigation .link2 a {
background-image: url(ENDEREÇO DA IMAGEM DO LINK 2);}


ul#navigation .link3 a {
background-image: url(ENDEREÇO DA IMAGEM DO LINK 3);}


ul#navigation .link4 a {
background-image: url(ENDEREÇO DA IMAGEM DO LINK 4);}


ul#navigation .link5 a {
background-image: url(ENDEREÇO DA IMAGEM DO LINK 5);}


ul#navigation .link6 a {
background-image: url(ENDEREÇO DA IMAGEM DO LINK 6);}


ul#navigation .link7 a {
background-image: url(ENDEREÇO DA IMAGEM DO LINK 7);}


ul#navigation .link8 a {
background-image: url(ENDEREÇO DA IMAGEM DO EMAIL);}

0 comentários:

Postar um comentário