Personalizar fondo menú horizontal

Ya tengo una barra de menú para mi blog. Hasta el momento contenía 3 pestañas (Inicio - Blogger - Photoshop) pero he añadido dos más (HTML y CSS.).Las pestañas están centradas en una barra horizontal bajo el título del blog y está ya personalizado su contenido (texto con el nombre de las páginas)...

Read More

Personalizar menú horizontal

Ahora voy a ver cómo puede mejorar su aspecto añadiéndole bordes.Realizo previamente una copia de seguridad del blog porque voy a modificar el código HTML de la plantilla.Voy al menú de Blogger y selecciono Plantilla - Editar HTML. Me posiciono sobre cualquier punto de la nueva ventana y hago clic...

Read More

Crear menú horizontal

Menú horizontal en un blog Se puede hacer mediante las herramientas que ofrece Blogger o bien con código CSS.Voy a empezar por la forma más sencilla, es decir, con los gadgets y páginas de Blogger.Por el momento mi blog está tratanto temas de photoshop y blogger, y estas serán las dos pestañas que incluiré en el menú de contenidos, a parte de la pestaña que me permita posicionarme en la página principal.Lo primero que hago es añadir un...

Read More

Marcos para fotos

    Después vamos a EDICIÓN HTML y con Ctrl+F abrimos el buscador y buscamos .post-body img, nos saldrá algo como esto: .post-body img, .post-body .tr-caption-container, .Profile img, .Image img, .BlogList .item-thumbnail img {padding: $ (image.border.small.size); background: $(image.background.color); border: 1px solid $(image.border.color); -moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1); -webkit-box-shadow: 1px...

Read More

Como insertar iconos sociales

Añadir los iconos con HTML- Dirígete al apartado de diseño de Blogger y haz "Añadir un gadget" en el lugar donde quieras colocarlos.- Escoge la opción de "HTML/Javascript"- Pon un título tipo "seguir", "contactar", "otros canales"...., copia el siguiente código para cada una de tus redes sociales y guarda. Pongo el ejemplo con mi Twitter<a href="https://twitter.com/2ndfunniest" target="_blank"><img src="https://sites.google.com/site/2ndfunniestthing/twitter.png"...

Read More

Sidebar

TÍTULO DE GADGET SIDEBAR CON LÍNEA SENCILLA ANTES Y DESPUÉS: .sidebar h2 { font-family: 'Arial' !important; font-size:12px !important; color: #666; text-transform: uppercase; letter-spacing: 2px; text-align: center; padding-top: 5px; padding-bottom: 5px;}.sidebar h2:before { font-size: 20px; ...

Read More

Menús

FONDO DEL MENÚ CON WASHI-TAPE: .PageList { text-align:center !important; } .PageList li { display:inline !important; float:none !important; } .tabs-inner .section:first-child { margin: -10px 0px 30px 0px; } .tabs-inner .section:first-child ul { border-top: 0px solid #000; border-bottom: 0px dotted...

Read More