#mOendo do Revés

  • Política de cookies
  • Política de Privacidade
  • enred@ndo
  • xOsse

Crear unha barra de navegación en blogger

Posted on 21 Outubro 2008 by xOsse dorrío Posted in blogosfera

Despois de moito tempo decidinme a introducir novas modificacións no meu blog e como é costume, cada cambio que fago cóntovolo. Agora decidín colocar unha barra de navegación cun menú para que sirva de guia a os usuarios do blog ou para dirixilos ós sitios que o autor do blog, neste caso eu, máis lle interese.

1.- Empezamos creando duas novas “variables” que utilizaremos máis adiante para dar cor ó texto dos menús e ó fondo, así dende a pestaña “Fontes e cores” poderemos modificar a súa cor. Colocanse debaixo das demáis “variables”:

<Variable name=”colormenu” description=”Menu Color”
type=”color” default=”#FFFFFF” value=”#ffffff”>
<Variable name=”colorbgmenu” description=”Menu bg Color”
type=”color” default=”#FFFFFF” value=”#B10245″>

2.- Diseñamos a barra adaptándoa á configuración do noso blog e ó lugar en que queremos situala (todo o ancho do blog (body) ou so na parte principal do blog (main); eu optarei por esta segunda opción). Estes parámetros podemos colocalos en calquera lugar do código HTLM entre <head> y < :/head>, así que eu poreino despois de “description”:

/*– (Menú) –*/

#nav {
clear:both;
margin:1px auto 1px auto;
width: 966px;
height:30px;
background: url(http://xosse.dorrio.googlepages.com/fnd_marc_prev2.GIF) repeat-x;
overflow:hidden;
}

#nav_l {
float:left;
width:966px;
margin:0px; padding:0px;
overflow:hidden;
height:30px;
}

.menu {
float:left;
margin:5px 1px;
padding:3px;
width: 400px;
}

.menu li {
display: inline;
list-style: none;
margin:0;
padding:0;
}

.menu ul, .menu ol {
display: inline;
list-style: none;
margin:0;
padding:0 10px 0 0;
}

.menu a, .menu a:visited {
color: $colormenu;
font-weight: bold;
margin:0;
padding: 3px 10px 3px 10px;
text-decoration: none;
}

.menu a:hover {
background: $colorbgmenu;
text-decoration: none;
font-weight: bold;
border:1px solid #fff;
}

#subscribe {
float: right;
width:192px;
height:32px;
margin:4px 4px 3px 4px;
}

.rss {
float:left;
margin:7px 5px 5px 0px;
width:500px;
}

.rss ul {
margin: 0; padding: 0 2px;
}

.rss li {
background: url(http://bp2.blogger.com/_Zuzii37VUO4/R2iVYyjZEeI/AAAAAAAACew/
TXSgAsWEBLA/s1600/rss.gif) no-repeat 0 3px;
margin: 0 2px 0 0;
padding: 3px 0 3px 20px;
list-style: none;
font-size: 12px;
color:$colormenu;
display: inline;
font-weight: bold;
}

.rss li a {
font-size: 12px;
color:~$colormenu;
}

En negrilla van algúns dos parámetros que podedes modificar o voso gusto (todos son modificables pero estes prsentan menos problemas)

3.- So nos queda introducir o seguinte código no blog e farémolo nalgún lugar entre <body> y </body>. Se queremos que ocupe todo o corpo poremolo ó inicio; para que ocupe so a parte principal farémolo en ‘main’. Como a miña barra irá debaixo do título, expando a “plantilla de artiluxios” e pego o código seguinte debaixo do widget ‘title’:

<!– menu –>
<div id=’nav’>
<div id=’nav_l’>
<div class=’menu’><ul>
<b><li class=’Inicio’><a alt=’Inicio‘ expr:href=’data:blog.homepageUrl’>Inicio</a></li>
<li class=’page_item page-item-2′><a href=‘dirección http://…‘ title=‘Nome da dirección‘>título da ligazón</a></li>
<li class=’page_item page-item-2′><a href=’dirección http://…‘ title=’título da dirección‘>Nome da ligazón</a></li>
<li class=’page_item page-item-2′><a href=’dirección http://…‘ title=’título da dirección‘>nome da ligazón</a></li></b>
</ul></div>
<!– menu –>

<div class=’rss’><ul>
<li><a expr:href=’data:blog.homepageUrl + “feeds/posts/default”‘>Post</a> (RSS)</li>
<li><a expr:href=’data:blog.homepageUrl + “feeds/comments/default”‘>Comentarios</a> (RSS)</li>
</ul>
</div>
</div><!– nav_l –>
</div>

blogs
« Zeitgeist: Addendum
LEO, LEO,.. »
Chíos de @xOsse

etiquetaxe

actualidade axentes de emprego BNG caciquismo CEO Comicios Electorais crise financeira debate denuncia dicionario político emprego empresa Encontro Irmandiño enquisas ensaio Feijóo folk Fraude de Lei galegas 2009 GALEGO Galiza Gavilanes globalización laboral La Región Leo Leo lingua mass media medio ambiente municipais 2007 nacionalismo opinións Ourense política PP psicoloxía social PSOE Quintana relatos SEAGA sei o que fixestes Touriño xOsse dorrío Xunqueira de Ambía Xunta de Galicia

arquivo de mOendo

Outubro 2008
M T W T F S S
 12345
6789101112
13141516171819
20212223242526
2728293031  
« Set   Nov »

Pages

  • Política de cookies
  • Política de Privacidade
  • enred@ndo
  • xOsse

Archives

  • Decembro 2020
  • Outubro 2018
  • Xullo 2018
  • Febreiro 2017
  • Abril 2016
  • Xuño 2015
  • Maio 2015
  • Marzo 2015
  • Decembro 2014
  • Novembro 2014
  • Outubro 2014
  • Setembro 2014
  • Decembro 2013
  • Abril 2013
  • Setembro 2012
  • Maio 2012
  • Abril 2012
  • Marzo 2012
  • Febreiro 2012
  • Novembro 2011
  • Outubro 2011
  • Setembro 2011
  • Agosto 2011
  • Xullo 2011
  • Xuño 2011
  • Maio 2011
  • Abril 2011
  • Marzo 2011
  • Febreiro 2011
  • Xaneiro 2011
  • Decembro 2010
  • Novembro 2010
  • Outubro 2010
  • Setembro 2010
  • Agosto 2010
  • Xullo 2010
  • Xuño 2010
  • Maio 2010
  • Abril 2010
  • Marzo 2010
  • Febreiro 2010
  • Xaneiro 2010
  • Decembro 2009
  • Novembro 2009
  • Outubro 2009
  • Setembro 2009
  • Agosto 2009
  • Xullo 2009
  • Xuño 2009
  • Maio 2009
  • Abril 2009
  • Marzo 2009
  • Febreiro 2009
  • Xaneiro 2009
  • Decembro 2008
  • Novembro 2008
  • Outubro 2008
  • Setembro 2008
  • Agosto 2008
  • Xullo 2008
  • Xuño 2008
  • Maio 2008
  • Abril 2008
  • Marzo 2008
  • Febreiro 2008
  • Xaneiro 2008
  • Decembro 2007
  • Xullo 2007
  • Xuño 2007
  • Maio 2007
  • Abril 2007
  • Marzo 2007
  • Febreiro 2007
  • Xaneiro 2007
  • Decembro 2006
  • Novembro 2006
  • Outubro 2006
  • Setembro 2006
  • Agosto 2006
  • Xullo 2006
  • Xuño 2006

Categories

  • actualidade (144)
  • blogosfera (15)
  • cultura (59)
    • poesía (4)
    • relatos (11)
  • dicionario político (76)
  • dicionario xurídico (6)
  • Eleccións Galegas 2009 (41)
  • libros (22)
  • lingua galega (11)
  • política estatal (37)
  • política internacional (25)
  • política laboral (41)
  • política local (74)
  • política nacional (191)
  • vídeos (50)

WordPress

  • Iniciar sesión
  • WordPress
© #mOendo do Revés