dicas blog
Home » , , » Tutorial Instalando Menu css drop down parra blog e bloggers

Tutorial Instalando Menu css drop down parra blog e bloggers

0
Hoje  trago   um  menu  que  customizei   no adobe Dreamweaver , e  que  ficou   bom  é muito  bom  ter   sub categorias  no   menu  quando  estamos   falando   de  blogs  grades   que   tem  muito  conteúdo  para  deixar    a   casa  bem  organizada.  para que  os  visitantes  encontrem  com   mas   facilidade  o  que  procuram,  um  menu  com  sub  categorias   ajuda  muito   nessa   hora  e  deixa   seu  blog  bem   organizado combinado  com  seu  trabalho. Isso  facilita  a  pesquisa  poupando  tempo  do  visitante,   sem precisar  ficar   pesquisando   muito,  isso  pode  ser   muito constrangedor  nos  dias   de  hoje  tempo  é   o que  nos  falta,  então  deixa   de
  papo  e  vamos  a   instalação  que é  bem  simples   em  duas  partes   de   seu   HTML  do blog .

 
Menu drop down com  sub  categorias no  blog

 
Copie  o código  abaixo  e  cole e  cole   acima  disso  ]]></b:skin>



Demo


Você  encontrara margin-top: 60px;  para  subir  ou  descer  o  menu

2 Segunda  parte links do menu

Se voce  estiver usando algum modelo de template do “designer de modelo do blogger”,a tag referente ao cabeçalho é: <header>
Se você quiser instalar um menu acima do cabeçalho, basta localizar a tag : <header> e colar o código dos  links  do menu acima desta tag.

 
Se você  quiser que o seu menu fique abaixo do cabeçalho, instale o código dos links do menu ABAIXO da tag: </header>


Copie o código  abaixo  e  veja como adicionar  seus  links  e testos   no exemplo  logo abaixo.


<div id='Ricardomenu'>
<ul>
   <li class='active '><a href='index.html'><span>Home</span></a></li>
   <li class='has-sub '><a href='#'><span>categorias</span></a>
      <ul>
         <li><a href='#'><span>Produto 1</span></a></li>
         <li><a href='#'><span>Produto 2</span></a></li>
         <li><a href='#'><span>Produto 2</span></a></li>
         <li><a href='#'><span>Produto 2</span></a></li>
         <li><a href='#'><span>Produto 1</span></a></li>
         <li><a href='#'><span>Produto 2</span></a></li>
         <li><a href='#'><span>Produto 2</span></a></li>
         <li><a href='#'><span>Produto 2</span></a></li>
      </ul>
   </li>
   <li><a href='#'><span>dicas</span></a></li>
   <li><a href='#'><span>facebook</span></a></li>
   <li><a href='#'><span>template</span></a></li>
   <li><a href='#'><span>dinheiro</span></a></li>
   <li><a href='#'><span>adsense</span></a></li>
   <li><a href='#'><span>tutorial</span></a></li>
   <li><a href='#'><span>twitter</span></a></li>
   <li><a href='#'><span>contato</span></a></li>
</ul>
</div>
 
Se você esta  usando  templates que não  são   originais  do blog procure,  pelos  códigos  abaixo.  

Se você deseja colocar acima do Cabeçalho

procure pelo código <div id='header-wrapper'> e cole logo abaixo dele 

Se você deseja colocar abaixo do Cabeçalho

procure pelo código <div id='content-wrapper'> e cole logo abaixo dele o código

 
Obs: os códigos  variam  de   template  para template  e  podem  estar  um  pouco  diferente

 
nos links  onde  Você   encontrar uma hashtg  # referisse  a o link destinos coloque  no  lugar delas

duvidas  é     perguntar   espero  ter   ajudado 


0 comentários:

Postar um comentário