Estructura clave de WordPress para crear un tema

Home » Blog » Estructura clave de WordPress para crear un tema

En un artículo anterior comente que para crear un tema solo se necesita 1 fichero: style.css, siendo esto cierto (puedes probarlo y veras que sale en el gestor de temas del administrador y te deja activarlo) no tiene sentido ya que saldrá una pantalla en blanco, ya que no hemos configurado ninguna visualización. Para lo que necesitamos crear los ficheros clave de nuestro tema.

index.php

Es el fichero principal dentro de la lógica, este fichero es el que consulta WordPress en último lugar si no entiende que mostrar. Si, es el principal aunque sea el último porque si no encuentra un fichero que mostrar que cumpla su lógica (WordPress se basa en las URLs para identificar que contenido mostrar) muestra el contenido de index.php.

header.php

El header.php es un fichero que incluye todo aquel código fuente de la cabecera que se comparte entre todas las páginas del tema. La cabecera de un tema es siempre el contenido que va entre las etiquetas <head></head> de HTML y luego dependiendo del tema es diferente, siendo bastante habitual la zona del logotipo, menús, etc.  Hay que tener en cuenta que el código fuente puede ser siempre el mismo pero el contenido no, como: En el código fuente llamamos a un Widget que es el que se encarga de gestionar esa zona, o tenemos una función que modifica ese contenido, en el header.php tendremos la llamada, y siempre será igual.

Es importante dentro de este fichero, y dentro de las etiquetas <head> incluir la función: wp_head(), esta función se encarga de cargar los css y otros ficheros que en un plugin se indica que se carguen en la cabecera. Si al instalar un plugin no nos carga sus estilos, comprueba que el tema tenga esta función en su fichero header.php.

Para introducir el header php en otra plantilla se usa la función de WordPress get_header(). Que es lo que en php sería un include.

footer.php

Su funcionamiento es igual que el header.php pero para la parte final de la web.

Es importante dentro de este fichero, y justo antes del </body> incluir la función: wp_footer(), esta función se encarga de cargar los js y otros ficheros que en un plugin se indica que se carguen en el footer. Si al instalar un plugin no nos carga sus scripts, comprueba que el tema tenga esta función en su fichero footer.php.

Para introducir el footer.php en otra plantilla se usa la función de WordPress get_footer(). Que es lo que en php sería un include.

sidebar.php

Este fichero siendo importante es el menos habitual en los ficheros, el header.php y el footer.php son necesarios, pero el sidebar se suele usar en determinadas páginas, aquellas en las que se necesita dividir una página en 2, siendo una de ellas el lateral y que habitualmente es donde se ponen los widgets.

Para introducir el sidebar.php en otra plantilla se usa la función de WordPress get_sidebar(). Que es lo que en php sería un include.

En ocasiones es necesario tener varios sidebar por ejemplo porque tengo 2 laterales uno en la izquierda y otro en la derecha. Podemos crear sidebar adicionales en functions.php:

add_action( 'widgets_init', 'crear_sidebar' );
function crear_sidebar() {
register_sidebar( array(
'name' => __( 'Nombre Sidebar', 'theme-slug' ),
'id' => 'sidebar-1',
'description' => __( 'Explicación sidebar', 'theme-slug' ),
'before_widget' => '<li id="%1$s" class="widget %2$s">',
'after_widget' => '</li>',
'before_title' => '<h2 class="widgettitle">',
'after_title' => '</h2>',
) );
}

Lo que hacemos es registrar el sidebar con el identificador exclusivo (hay que evitar el conflicto con otros plugins y temas) y desde este momento aparecerá en la sección Widgets del adminsitrador.

Y ya solo queda indicar que se visualice en las plantillas que queramos usarlo:

<?php dynamic_sidebar('sidebar-1');?>

Ejemplo index.php

<?php get_header(); ?>
<div>Contenido principal</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>


Foto de Iñigo Mezo Alvarez

IÑIGO MEZO ALVAREZ (IMAcreste)


Comentarios

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Las reseñas son opiniones que las personas dejan en la página local de Google. Si son positivas, estas reseñas ayudarán a mejorar la confianza y credibilidad de una marca.

Participa en nuestro sorteo enviando un email con tu nombre y el asunto «Sorteo AUDITORÍA SEO». Se realizara un sorteo cada mes.

Evaluación EXCELENTE
A base de 7 reseñas
Gran profesional y muy competente, le contratamos para cambiar la web y mejorar el posicionamiento y gracias a su asesoramiento ha mejorado.
jorge martinez
jorge martinez
16/05/2024
Contactamos con Iñigo para el diseño web de nuestra tienda online y estamos encantados. Su asesoramiento, seguimiento y trato han sido excepcionales. Un verdadero crack. Recomendado al 100%. No dudes en ponerte en contacto con el.
erlantz rique
erlantz rique
19/02/2024
Un acierto quien elija a Iñigo. Autentico profesional, se preocupó en todo momento que entendiera el funcionamiento de la web. Me explicó todo las veces necesarias hasta entenderlo. Se preocupó y acertó en que la web tuviera lo que le pedí y lo hizo con creces. Muy contento con el servicio prestado. Una vez realizado el trabajo, cualquier duda que tengo me sigue ayudando. Lo recomiendo sin temor a equivocarme.
Jose Marlasca
Jose Marlasca
06/02/2024
Compromiso, implicación e innovación en los proyectos. Atento a las necesidades e incansable en la búsqueda de soluciones. Muy buena opción.
Jabier Fuertes Udaondo
Jabier Fuertes Udaondo
07/01/2024
Si buscas a alguien que además de hacer un diseño web moderno, responsivo y adaptado a tu sector, te explique por qué plantea el diseño web de esa manera y que te explique y ayude en posicionar tu web lo mejor posible en base a los objetivos fijados, ese es Iñigo Mezo y os lo recomiendo al 100%
Asier Hermoso
Asier Hermoso
03/01/2024
Genial trabajar con él! Además de ser muy buen profesional, experto y responsable, a destacar tanto su implicación en cada proyecto, así como su trato siempre cercano y su paciencia infinita ;) Un crack!!
itxaso zubia
itxaso zubia
15/12/2023
El plugin gratuito para integrar productos de Prestashop en Wordpress muy sencillo de utilizar y muy bien documentado, os felicito.
Fernando Cózar
Fernando Cózar
02/11/2023