LINKS PROMOVIDOS:

deixadisso
Seu machista
...kkkk
AS BARATINHAS #39
AS BARATINHAS #39...
...Conteúdo (+18)
Lindas mulheres de óculos
Lindas mulheres de óculos
(+18)
40 MOTIVOS PARA CONHECER UMA UNIVERSIDADE AMERICANA
40 motivos para conhecer
uma universidade americana



Menu Personalizado Expansível no Blogger


Nesta postagem estarei mostrando para vocês este menu da qual muito gente já tem não no blogger, porém, alguns ainda tem a dúvida de como coloca-lo no blogger. Todos os créditos são para Video Aulas - Tutorial de Computer Tech.




Para coloca-lo no blogger é bem simples... Entre em "Modelo" - "Editar HTML", dê um Ctrl + F e procure pela tag
</head>
Ou
<head>
Tendo encontrado a tag, cole ABAIXO dela o seguinte código
<style type='text/css'>.texthidden {display:inline}.shown {display:block}</style><script type='text/javascript'>document.write('<style>.texthidden {display:none} </style>');</script><script type='text/Javascript'>function expandcollapse (postid) {whichpost = document.getElementById(postid);if (whichpost.className=="shown") {whichpost.className="texthidden";}else {whichpost.className="shown";}}</script>
<style type='text/css'>
#dolphincontainer{position:relative;height:43px;color:#f06214;background:#ffffff;
width:100%;font-family:Helvetica,Arial,Verdana,sans-serif;}
#dolphinnav{position:relative;height:34px;font-size:12px;text-transform:uppercase;
font-weight:bold;background:#F06214 url() repeat-x bottom left;
padding:0 0 0 20px;}
#dolphinnav ul{margin:0;padding:0;list-style-type:none;width:auto;float:left;}
#dolphinnav ul li{display:block;float:left;margin:0 1px;}
#dolphinnav ul li a{display:block;float:left;color:#ffffff;text-decoration:none;
padding:0 0 0 20px;height:33px;}
#dolphinnav ul li a span{padding:12px 20px 0 0;height:21px;float:left;}
#dolphinnav ul li a:hover{color:#000000;
background:transparent url() repeat-x bottom left;}
#dolphinnav ul li a:hover span{display:block;width:auto;cursor:pointer;}
#dolphinnav ul li a.current,#dolphinnav ul li a.current:hover{color:#FCD9B6;
background:#ffffff url() no-repeat top left;line-height:275%;}
#dolphinnav ul li a.current span{display:block;padding:0 18px 0 0;width:auto;
background:#805E5E url() no-repeat top right;height:33px;}
</style>
Tendo feito isto, pode salvar e fechar a seção editar html.

Agora, entre em "Layout" - "Adiconar um gadget" - "HTML/JavaScript" e cole o seguinte código
<a href="javascript:void(0);" onclick="expandcollapse('favoritos1')"><img border="0" src="http://i49.tinypic.com/imkolf.png" /></a>

<ul id="favoritos1" class="texthidden">
<li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
</ul>


<a href="javascript:void(0);" onclick="expandcollapse('favoritos2')"><img border="0" src="http://i48.tinypic.com/30m2s7d.png" /></a>

<ul id="favoritos2" class="texthidden">
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
</ul>


<a href="javascript:void(0);" onclick="expandcollapse('favoritos3')"><img border="0" src="http://i46.tinypic.com/28lyiyb.png" /></a>

<ul id="favoritos3" class="texthidden">
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
</ul>


<a href="javascript:void(0);" onclick="expandcollapse('favoritos4')"><img border="0" src="http://i47.tinypic.com/eur57o.png" /></a>

<ul id="favoritos4" class="texthidden">
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
</ul>


<a href="javascript:void(0);" onclick="expandcollapse('favoritos5')"><img border="0" src="http://i49.tinypic.com/2880ffd.jpg" /></a>

<ul id="favoritos5" class="texthidden">
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
</ul>


<a href="javascript:void(0);" onclick="expandcollapse('favoritos6')"><img border="0" src="http://i50.tinypic.com/2vx0whz.png" /></a>

<ul id="favoritos6" class="texthidden">
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
</ul>


<a href="javascript:void(0);" onclick="expandcollapse('favoritos7')"><img border="0" src="http://i49.tinypic.com/70ccib.png" /></a>

<ul id="favoritos7" class="texthidden">
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
</ul>


<a href="javascript:void(0);" onclick="expandcollapse('favoritos8')"><img border="0" src="http://i45.tinypic.com/e9c1a1.png" /></a>

<ul id="favoritos8" class="texthidden">
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
<li><a href="http://www.blogger.com/LINK%20DO%20MARCADOR" target="_blank">NOME DO MARCADOR</a></li>
</ul>
Faça as modificações no código.

Tendo feita as modificações no código, basta salvar e pronto!!!

Cursos Online com Certificado - Cursos 24 Horas
Menu Personalizado Expansível no Blogger Menu Personalizado Expansível no Blogger Reviewed by Muca on 10/16/2013 08:26:00 AM Rating: 5

Quer fazer parceria? - Faça parte dos nossos parceiros agora!