G
gatuso
Alfa
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
1.- Blogger-> Plantilla-> Edicion HTML->
2.- Buscamos la siguiente linea (Ctrol + F)
3.- Justo por debajo de
pegamos la siguiente linea (Ctrol + F)
4.-Ahora en la plantilla buscamos la siguiente linea (Ctrol + F)
5.- Just por encima de
pegamos el siguiente código CSS
6.- Guardamos los cambios realizados y ahora agregaremos el menu en un gadget
7.-Luego, ingresamos de nuevo a Blogger-> Diseño-> Añadir un gadget-> HTML/Javascript
8.- en el Gadget pegamos el codigo HTML del menu.
9.- Guardamos nuestro gadget y listo.
Ahora que si deseas modificar el icono lo harias en esta linea:
Para modificar el menu, en esta linea :
¿Como obtengo mas iconos?
Ingresando en esta pagina: Font Awesome Icons
Anexo imagen:
Espero les sea util. Saludos.
2.- Buscamos la siguiente linea (Ctrol + F)
HTML:
<head>3.- Justo por debajo de
HTML:
<head>
HTML:
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"/>4.-Ahora en la plantilla buscamos la siguiente linea (Ctrol + F)
HTML:
]]></b:skin>5.- Just por encima de
HTML:
]]></b:skin>
HTML:
#site-nav {background-color:#333}
.index #site-nav {border-bottom:1px solid #222;}
#site-nav ul,
#site-nav li {
margin:0;
padding:0;
list-style:none;
height:35px;
}
#site-nav li {
float:left;
display:inline;
position:relative;
height:auto;
}
#site-nav a {
display:block;
line-height:35px;
border-left:1px solid #444;
border-right:1px solid #222;
color:#aaa;
text-decoration:none;
padding:0 1.8em;
}
#site-nav li.depan a {border-left:none}
#site-nav li a:hover,
#site-nav li:hover > a {color:#666}6.- Guardamos los cambios realizados y ahora agregaremos el menu en un gadget
7.-Luego, ingresamos de nuevo a Blogger-> Diseño-> Añadir un gadget-> HTML/Javascript
8.- en el Gadget pegamos el codigo HTML del menu.
HTML:
<nav id="site-nav"><ul>
<li><a href="URL"><i class="fa fa-home"></i>Inicio</a></li>
<li><a href="ingresa tu url aqui"><i class="fa fa-cog"></i>La casa del vector</a></li>
<li><a href="ingresa tu url aqui"><i class="fa fa-search"></i>Elija su comida</a></li>
<li><a href="ingresa tu url aqui"><i class="fa fa-bell"></i>Flash para todo el mundo</a></li></ul></nav>9.- Guardamos nuestro gadget y listo.
Ahora que si deseas modificar el icono lo harias en esta linea:
HTML:
<i class="....."></i>
HTML:
<li><a href="URL"><i class="fa fa-cog"></i> Otro menu</a></li>¿Como obtengo mas iconos?
Ingresando en esta pagina: Font Awesome Icons
Anexo imagen:
Espero les sea util. Saludos.
Última edición:
