Menú en cabecera

HI! Aquí Kuma en otro día más de vida  ...si ya sé sonó depresivo . DON'T WORRY! No estoy en mi etapa emo 😂

Últimamente no me anima ir a la academia para las lecciones de inglés. ¿POR QUÉ? Pues porque the teacher solo hace hora y no hacemos clases!! AAAAAAAH!!! Sinceramente ando pensando en desgraciarme con ese hombre 😡😝

Bueno ya ¡A lo de hoy! ¡COMENCEMOS!

CATEGORIA CATEGORIA CATEGORIA CATEGORIA

Antes debo ACLARAR que el código del menú no es mio, así que al final dejo los créditos respectivos. Sin embargo, el método que empleé para posicionar lo en la cabecera es 100% mio.

Primer Código

1. Desde la opción Tema de Blogger, clic en el botón  Personalizar 
2. Clic en Opciones avanzadas y buscamos Agregar CSS.
3. Copia y pega el siguiente código. Clic en  Aplicar al blog 

/* Menu en Cabecera ----------------------------------------------- */ @-webkit-keyframes agitado { from {-webkit-transform: rotate(10deg);} to {-webkit-transform: rotate(-10deg);} } @-moz-keyframes agitado { from {-moz-transform: rotate(10deg);} to {-moz-transform: rotate(-10deg);} } @-o-keyframes agitado { from {-o-transform: rotate(10deg);} to {-o-transform: rotate(-10deg);} } a.menu { display: inline-block; font-family: 'Arial'; font-size: 14px; background: #ff00bf; /*Color menu*/ padding: 2px; text-align: center; border-radius: 5px; border: 1px dashed #000; color: #fff; /*color texto*/ cursor: pointer; text-shadow: 2px 2px 2px #000; width: 100px; text-decoration:none; } a.menu:hover { color: #4fffa6; /*color texto al pasar cursor*/ -webkit-animation-name: agitado; -webkit-animation-duration: .01s; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; -webkit-animation-direction: alternate; -moz-animation-name: agitado; -moz-animation-duration: 0.1s; -moz-animation-timing-function: linear; -moz-animation-iteration-count: infinite; -moz-animation-direction: alternate; -o-animation-name: agitado; -o-animation-duration: 0.1s; -o-animation-timing-function: linear; -o-animation-iteration-count: infinite; -o-animation-direction: alternate; }

Segundo Código

1. Ahora desde la opción Diseño de Blogger, clic en + Agregar un gadget
2. Elige HTML/JavaScript
3. Copia y pega el siguiente código. Clic en  Guardar 

<!--MENU--> <div style='position: absolute; top: -80px; margin-left: 0px;'> <a class='menu' href='URL'>CATEGORIA</a> <a class='menu' href='URL'>CATEGORIA</a> <a class='menu' href='URL'>CATEGORIA</a> <a class='menu' href='URL'>CATEGORIA</a> </div> <!--END MENU-->

Datos Modificables:

• Para agregar otra categoría más, antes de </div> agrega el siguiente código  <a class='menu' href='URL'>CATEGORIA</a> 
• Vale esta parte es mía  style='position: absolute; top: -80px; margin-left: 0px;'  top es la distancia vertical y margin-left es la distancia horizontal. Modifica para ubicar el menú a tu gusto.

Y eso fue todo!

Crédito: menú original