Inspeccionar el código Html, para hacer modificaciones de diseño en nuestro sitio Web, es algo común; existen varias herramientas, sin embargo, en este artículo, veremos el uso de Firebug para modificar un theme WordPress.
En los siguientes videos realizaremos algunos cambios a la plantilla Twenty Sixteen de WordPress.
1- Generalidades de Firebug
En el siguiente video se explica algunas generalidades de Firebug, básicamente usaremos los tabs de Html y CSS. El tab de Html nos ayuda con la inspección de código Html y a través del Tab CSS vemos todos los archivos de estilos que carga nuestro sitio.
2- Cambio de Colores
En el siguiente video cambiaremos los colores de fondo de los títulos de los Widgets de la barra lateral, así como los fondos de los títulos de las entradas.
3- Cambio de Posición
En el siguiente video veremos un ejemplo práctico de cómo realizar modificaciones sólo para las entradas, cambiaremos la posición de la metadata del artículo que se muestra en la parte lateral.
4- Media Queries
En el siguiente video veremos algo de diseño responsive, ocultando elementos sólo para dispositivos móviles en las entradas. Puedes ver otro ejemplo similar de media queries en el siguiente artículo: Cambiar logo en la versión móvil.
5- Conclusión
Espero que los videos anteriores te hayan ayudado a tener un mejor entendimiento de cómo usar esta herramienta para realizar modificaciones en tu theme WordPress, este sólo el primer paso, te sugiero complementarlo con el estudio de CSS.
Artículos Relacionados
(3 votos, promedio: 5,00 de 5)
Cargando…
Tu sitio es una joya que no había descubierto.
Llevo un buen rato estudiando información que ofreces, y ya me he suscrito.
Gracias por tan buen material, en español la información que se ofrece es muy repetitiva y quizá demasiado demasiados sitios repiten contenidos básicos. Realmente para temas avanzados eres el único sitio, que yo conozca, que ofrece tan buena información
Hola Carlos, gracias por tu comentario :).
PD. Si tienes alguna sugerencia de algún tema me lo puedes comentar por el formulario de contacto.
Gracias,
seguro que algo soy capaz de sugerírte, cuenta con ello 😉
Gracias por tu Buen trabajo. Solo me estoy iniciando.
Hola Jesus, te sugiero también revisar la sección de cursos: https://decodecms.com/cursos/