JADE webs

Diseño web con Wordpress

  • Hosting
  • WordPress
  • Blogging
  • Diseño
  • Fotografía
  • SEO
  • Copywriting

Qué es un child theme (tema hijo) y por qué deberías utilizarlos

12/07/2017 por Esther Deja un comentario

¿Qué es un child theme?

 

Empecemos por el principio, como ya sabes el theme o tema de tu blog es la apariencia visual que tiene, puedes diseñarlo tú, descargar uno gratuito o uno de pago.

En cualquiera de los casos, lo más seguro es que en algún momento quieras cambiar algo en cuanto al diseño del mismo, si es un diseño que te has hecho tu desde 0, no hay problema.

Pero… esto no es lo más habitual ¿Verdad?

Lo más normal es que tengas un tema hecho por otros, en ese caso, lo mejor, es crear un tema hijo, así no se modifica el código original.

Y te preguntarás ¿por qué no modificar el código original si no me gusta una parte en concreto del diseño?

Pues querid@ porque si en algún momento el creador del diseño publica una actualización del tema, perderás todo el trabajo y tiempo invertido en ponerlo a tu gusto.

Por supuesto podrías no actualizar el tema ya jamás, pero no es lo más recomendable…

Esto lo podemos solucionar creando un tema hijo o child theme que te dejará importar todos los estilos del tema padre y añadir las modificaciones que necesitas en tu diseño.

 

¿Cómo crear un child theme?

 

En la carpeta de Temas de tu WordPress: wp-content/themes, tienes que crear la carpeta que usarás para tu child theme.

Imagina que tu tema se llama «tutema_wp», pues el tema hijo lo puedes llamar «child_tutema_wp» (o de cualquier otra manera, vaya, pero así tu ubicarás con más facilidad).

carpeta tema hijo

En la carpeta «child_tutema_wp» tienes que crear una hoja de estilo CSS, que será la que te gestione los estilos del nuevo diseño, llamada style.css.

En la hoja de estilo, tendrás que añadir el código de cabecera, con los datos de tu tema:

/*Theme Name: Nombre del tema hijo
Theme URI: URL del tema (probablemente tu web)
Version: Nº de versión por el que vas
Description: Descripción, por ejemplo, tema hijo del tema que sea.
Author: Nombre del autor
Author URI: URL del autor (probablemente tu web de nuevo)
Template: carpeta donde está el tema padre
*/

Asegúrate de poner bien el nombre de la carpeta donde está el tema padre, ejem, fallos más tontos se habrán visto…

Hoja de estilo tema hijo

Después, también dentro de la carpeta del tema hijo, creamos el archivo functions.php

Y ahí añadimos esta función para importar la hoja de estilo del tema padre:

<?php
add_action( ‘wp_enqueue_scripts’ , ‘my_theme_enqueue_styles’ );
function my_theme_enqueue_styles() {
wp_enqueue_style( ‘carpeta_del_tema_padre‘, get_template_directory_uri() .’/style.css’ );
}
?>

En mi caso queda tal que así:

Functions.php tema hijo

Ahora, solo te queda acceder a tu escritorio de WordPress, ir a Apariencia, Temas y allí verás el nombre de tu child theme.

Actívalo y si todo está correcto, ahora al volver a la web, la verás exáctamente igual que estaba antes (salvo los ajustes que se hacen a través de aparencia>Personalizar que tendrás que volver a hacerlos), ya que estamos importando los estilos del tema padre y aún no hemos modificado nada en el hijo.

Bueno, pues ya tienes activado tu child theme, ahora puedes añadir nuevas especificaciones a la página de estilos o hacer copias de los archivos php del tema y modificarlos sin arriesgarte a perderlo todo durante una actualización.

 

¿Que ventajas tiene trabajar con child themes?

 

    • Vas a poder personalizar las hojas de estilos CSS del tema.  El nuevo archivo style.css prevalecerá sobre el original del tema padre.

 

    • Cualquier archivo del tema activo que quieras modificar, por ejemplo, si quieres hacer modificaciones en la cabecera, copiarías el archivo header.php a la carpeta del tema hijo y en esa copia harías los cambios que quisieras.

 

    • Puedes utilizar el nuevo archivo de funciones (functions.php)  para añadir código de plugins nuevos o personalizaciones para el tema.

 

    • WordPress da prioridad en la carga siempre al tema hijo y en el caso del archivo functions.php no requiere una copia o importación del archivo del tema activo (padre) por lo que las modificaciones o añadidos a functions.php en el child theme tendrán prioridad.

 

  • Si realizamos cambios que afectan a la estética del sitio web y la pifiamos, simplemente renombrando, eliminando o comentando los cambios del archivo afectado del tema hijo, recuperaremos el estado anterior a los cambios.

 

Pues así a grosso modo, esto es lo básico sobre los Child Themes o Temas Hijo.

Qué es un tema hijo

Guardar

Guardar

Puedes compartir el post en:

Publicado en: Wordpress

Deja una respuesta Cancelar la respuesta

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

Responsable » Esther Calvo.
Finalidad » Moderación de los comentarios en el blog.
Legitimación » Tu consentimiento.
Destinatarios » Los datos que me facilitas estarán ubicados en los servidores de Webempresa. Ver política de privacidad de Webempresa.
Derechos » Podrás ejercer tus derechos de Acceso, Rectificación, Limitación o Suprimir tus datos enviando un email a esther@jadewebs.com.

Bienvenid@!

¡Hola! Soy Esther, adicta a la tecnología y al buen diseño en general.

Soy diseñadora web y a través de este blog quiero ayudarte a dar el paso hacia el blogging profesional y convertir tu hobby en un modo de vida. Leer más…

Copyright © 2020 · JadeWebs · Contactar

Política de Privacidad | Política de Cookies | Aviso legal
Esta página utiliza cookies para proporcionar una experiencia mejor al recordar tus preferencias en visitas posteriores. Haciendo clic en 'Aceptar todas', aceptas el uso de todas las cookies. No obstante, puedes visitar 'Ajustes' para personalizar este consentimiento.
AjustesAceptar todo
Manage consent

Privacy Overview

This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may affect your browsing experience.
Necessary
Siempre activado
Necessary cookies are absolutely essential for the website to function properly. These cookies ensure basic functionalities and security features of the website, anonymously.
CookieDuraciónDescripción
cookielawinfo-checkbox-analytics11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Analytics".
cookielawinfo-checkbox-functional11 monthsThe cookie is set by GDPR cookie consent to record the user consent for the cookies in the category "Functional".
cookielawinfo-checkbox-necessary11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookies is used to store the user consent for the cookies in the category "Necessary".
cookielawinfo-checkbox-others11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Other.
cookielawinfo-checkbox-performance11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Performance".
viewed_cookie_policy11 monthsThe cookie is set by the GDPR Cookie Consent plugin and is used to store whether or not user has consented to the use of cookies. It does not store any personal data.
Functional
Functional cookies help to perform certain functionalities like sharing the content of the website on social media platforms, collect feedbacks, and other third-party features.
Performance
Performance cookies are used to understand and analyze the key performance indexes of the website which helps in delivering a better user experience for the visitors.
Analytics
Analytical cookies are used to understand how visitors interact with the website. These cookies help provide information on metrics the number of visitors, bounce rate, traffic source, etc.
Advertisement
Advertisement cookies are used to provide visitors with relevant ads and marketing campaigns. These cookies track visitors across websites and collect information to provide customized ads.
Others
Other uncategorized cookies are those that are being analyzed and have not been classified into a category as yet.
GUARDAR Y ACEPTAR