Você está na página 1de 5

Si utilizas plantillas pre diseadas o dinmicas, es muy probable este tutorial NO te funcione Si quieres aplicarlo, ves al men plantilla

a y cambia tu plantilla actual a sencilla

Si no encuentras en el html de tu plantilla el cdigo ]]></b:skin> busca slo /b:skin Revisa este tutorial y as entenders porqu ocurre

Para buscar cdigo dentro de la plantilla html debes utilizar Ctrl y F a la vez si tienes un PC Command y F a la vez si tienes un Mac

Si quieres cambiar el tipo de fuente, sustituye lo marcado en color rojo font:normal 12px Helvetica, sans-serif; margin: 0; por la fuente que t elijas, por ejemplo font:normal 12px century gothic; margin: 0; Eso s, debes de tener instalada previamente la tipografa que hayas elegido, mira este tutorial

Si quieres crear una pestaa donde queden agrupadas todas los posts con una etiqueta determinada, por favor, mira este y este tutorial Si quieres cambiar el color de la barra, cambia el valor all donde dice background: #bdbfbf; por el color que necesites background: #949494; Este tutorial te averiguar el cdigo de color que quieres

Si te queda la barra muy pegada a la cabecera haz lo siguiente, cambia

border-top: 0px solid; por el valor que necesites, por ejemplo border-top: 10px solid; Sigue las instrucciones tal cual las explico en el vdeo, si no te sale por favor, borra y vuelve a empezar Si necesitas un diseo ms personalizado de lo que en el vdeo tutorial te muestro, por favor, escribe a massana.laura@gmail.com y pdele presupuesto. Ella es diseadora grfica profesional e informtica y seguro, podr ayudarte Recuerda SIEMPRE antes de empezar hacer una copia de seguridad Descrgate este documento en tu ordenador para as, poder seleccionar el cdigo que ves aqu abajo

Paso 1 <div class='region-inner header-inner'>

Paso 2 <div id='mbwnavbar'> <ul id='mbwnav'> <li> <a href='#'>Pagina Principal</a> </li> <li> <a href='#'>Sobre mi</a> </li> <li> <a href='#'>Categoria 1</a> <ul> <li><a href='#'>Categoria 1.1</a></li> <li><a href='#'>Categoria 1.2</a></li> </ul> </li>

<li> <a href='#'>Categoria 2</a> <ul> <li><a href='#'>Categoria 2.1</a></li> <li><a href='#'>Categoria 2.2</a></li> </ul> </li> </ul> </div>

Paso 3 ]]></b:skin>

Paso 4 /**MBW Navgation bar**/ #mbwnavbar { background: #bdbfbf; width: 850px; color: #FFF; margin: 0px; padding: 0; position: relative; border-top:0px solid; height:35px; } #mbwnav { margin: 0; padding: 0; } #mbwnav ul { float: left; list-style: none; margin: 0; padding: 0; } #mbwnav li { list-style: none;

margin: 0; padding: 0; border-left:1px solid #333; border-right:1px solid #333; height:35px; } #mbwnav li a, #mbwnav li a:link, #mbwnav li a:visited { color: #FFF; display: block; font:normal 12px Helvetica, sans-serif; margin: 0; padding: 9px 12px 10px 12px; text-decoration: none; } #mbwnav li a:hover, #mbwnav li a:active { background: #028490; color: #FFF; display: block; text-decoration: none; margin: 0; padding: 9px 12px 10px 12px; } #mbwnav li { float: left; padding: 0; } #mbwnav li ul { z-index: 9999; position: absolute; left: -999em; height: auto; width: 160px; margin: 0; padding: 0; } #mbwnav li ul a { width: 140px; } #mbwnav li ul ul { margin: -25px 0 0 161px; } #mbwnav li:hover ul ul, #mbwnav li:hover ul ul ul, #mbwnav li.sfhover ul ul, #mbwnav li.sfhover ul ul ul { left: -999em; } #mbwnav li:hover ul, #mbwnav li li:hover ul, #mbwnav li li li:hover ul, #mbwnav

li.sfhover ul, #mbwnav li li.sfhover ul, #mbwnav li li li.sfhover ul { left: auto; } #mbwnav li:hover, #mbwnav li.sfhover { position: static; } #mbwnav li li a, #mbwnav li li a:link, #mbwnav li li a:visited { background: #028490; width: 120px; color: #FFF; display: block; font:normal 12px Helvetica, sans-serif; margin: 0; padding: 9px 12px 10px 12px; text-decoration: none; z-index:9999; border-bottom:1px dotted #333; } #mbwnav li li a:hover, #mbwnavli li a:active { background: #70b6bd; color: #FFF; display: block; margin: 0; padding: 9px 12px 10px 12px; text-decoration: none; }

Você também pode gostar