Cómo crear un tema hijo (Child theme) en WordPress para disfrutar de sus beneficios

En algún momento mientras usas WordPress, es posible que necesites modificar la apariencia, el aspecto y las propiedades de la plantilla de tu sitio. E incluso puede llegar el momento en que necesites modificar el código fuente de la plantilla misma. Sin embargo, las modificaciones que realices en la plantilla de tu sitio WordPress, se perderán cuando actualices esa plantilla a una nueva versión.

La plantilla secundaria (Child theme) te ayuda a superar ese problema fácilmente, porque cuando creas una plantilla secundaria a partir de una plantilla principal (Parent theme), podrás modificar el código fuente de la plantilla secundaria como desees, y al mismo tiempo puedes actualizar la plantilla principal a una versión más reciente en cualquier momento sin perder los códigos o modificaciones que hayas realizado. En este artículo aprenderás sobre la importancia de la plantilla secundaria Child theme y los beneficios de usarla junto con la plantilla base de tu sitio, además aprenderás cómo crear una plantilla secundaria a partir de la plantilla base de tu sitio WordPress con pasos sencillos, activarla en tu sitio y personalizar su apariencia como desees.

Importancia de usar Child theme en tu sitio WordPress

Aquí están los principales beneficios y características que obtienes si creas una plantilla secundaria Child theme a partir de la plantilla base ya instalada en tu sitio: En lugar de crear una plantilla WordPress desde cero, que es un tema tedioso y requiere mucho tiempo, podrás crear una plantilla secundaria Child theme en muy poco tiempo, sin necesidad de hacer mucho esfuerzo o poseer habilidades de programación complejas. La plantilla secundaria te ayuda a aprovechar todas las características, herramientas y opciones que ofrece la plantilla principal o la plantilla base utilizada en el sitio, esto es porque la plantilla secundaria utiliza y llama todas las funciones, características y propiedades que utiliza la plantilla principal.

Puedes actualizar la plantilla base de tu sitio en cualquier momento que haya una nueva actualización disponible, sin temor a perder las modificaciones que se hicieron a la plantilla antes de realizar la actualización, porque realmente realizaste las actualizaciones en la plantilla secundaria de tu sitio, y las actualizaciones de la plantilla base de WordPress no afectarán las modificaciones que hayas hecho. Si estás usando una plantilla secundaria y surge algún problema que cause la pérdida de la apariencia del sitio, puedes simplemente eliminar la plantilla secundaria por completo, y entonces se mostrará automáticamente el diseño y las propiedades de la plantilla base. La plantilla secundaria Child theme te ayuda a adquirir más habilidades relacionadas con la modificación de plantillas WordPress.

Lee también: ¿Qué es Child theme? ¿Y cuáles son sus usos para los propietarios de sitios WordPress?

Explicación completa para principiantes

¿Cómo funciona la plantilla secundaria Child theme? Es posible que hayas notado alguna vez al instalar una de las plantillas WordPress, la aparición de una plantilla con el mismo nombre junto a la plantilla base seguida de la palabra Child theme. La razón de nombrar la plantilla secundaria así es que hereda las características, archivos y datos de la plantilla base, así como un hijo hereda de su padre.

Por lo tanto, cuando creamos una plantilla secundaria en un sitio WordPress y la activamos, el sitio mostrará la misma apariencia y diseño de la plantilla principal. Es por eso que la idea de funcionamiento de la plantilla secundaria se basa en usar todos los archivos y códigos que existen en la plantilla principal, lo que significa que la plantilla ahora existe en dos versiones en lugar de una, por así decirlo, una de las versiones está protegida y alejada de modificaciones o cambios, y la otra versión, que es la plantilla secundaria Child theme, está lista para aplicar cualquier modificación requerida al sitio sin temor a colapsar o dañar la plantilla principal. Nota: Cuando ingresas al sitio, WordPress automáticamente muestra la plantilla secundaria si está disponible, y si no está disponible, muestra la plantilla principal o la plantilla base.

Los componentes básicos de la plantilla secundaria Child theme Cuando ingreses al administrador de archivos de tu sitio WordPress dentro del panel de control Cpanel

Y navegues por la carpeta Themes/ encontrarás dentro de ella las carpetas de todas las plantillas instaladas en tu sitio, y cuando ingreses a cualquier carpeta de una de las plantillas, encontrarás que contiene un conjunto de archivos de la plantilla como se muestra en la siguiente imagen: La imagen de arriba muestra los componentes básicos en la mayoría de las plantillas WordPress (la plantilla principal) y algunas plantillas pueden incluir archivos adicionales para más personalización.

Mientras que la siguiente imagen muestra los componentes básicos de la plantilla secundaria Child theme para que esté lista para funcionar y activarse en el sitio: Como puedes ver en la imagen de arriba, no necesitarás más de esos tres archivos para crear una plantilla WordPress secundaria Child theme, y explicaremos estos archivos en detalle dentro del artículo. A continuación hay una breve definición de ellos: Archivo Functions.php: Es un archivo de programación que se usa para conectar la plantilla principal con la secundaria, y ya hemos hablado de él en detalle anteriormente.

Archivo style.css: Es el archivo de estilos que se usa para agregar códigos para modificar la apariencia, aspecto y diseño de la plantilla (y si deseas arabizar la plantilla, es preferible que coloque los estilos de idioma árabe en un archivo de estilos separado rtl.css) Archivo Screenshot.png: Es un archivo de imagen que agregamos a la carpeta de la plantilla secundaria para que aparezca junto al nombre de la plantilla dentro del panel de control de WordPress como se muestra en la siguiente imagen: Por lo tanto, la plantilla secundaria contiene solo muy pocos archivos, porque no creamos una plantilla completamente nueva, sino que la plantilla secundaria hereda o usa todos los archivos y códigos de la plantilla base (principal), por lo que la plantilla principal debe estar instalada en el sitio también para que funcione correctamente.

Nota: En la siguiente explicación crearemos una plantilla secundaria de la famosa plantilla Sydney, y puedes aplicar la misma explicación a cualquier plantilla WordPress para crear una plantilla secundaria de la misma manera. Pasos para crear una plantilla secundaria (Child theme) Puedes crear una plantilla secundaria (Child theme) para cualquier plantilla WordPress instalada en tu sitio mediante los siguientes pasos fácilmente y sin necesidad de poseer habilidades de programación avanzadas, pero es preferible que tengas una buena base en el manejo de códigos de programación en los siguientes idiomas HTML – CSS – PHP.

También te recomendamos que hagas una copia de seguridad de tu sitio antes de crear una plantilla secundaria de cualquier plantilla WordPress que tengas.

Crear una carpeta para la plantilla secundaria dentro del administrador de archivos

El primer paso para crear la plantilla secundaria Child theme es crear una carpeta con el nombre de la plantilla dentro del administrador de archivos de tu sitio, donde puedes acceder al administrador de archivos del sitio haciendo clic en File Manager desde el panel de control de hosting cPanel: Después de ingresar al administrador de archivos, puedes acceder a la carpeta Public_html, luego a la carpeta de instalación de WordPress de tu sitio, después abre la carpeta Wp-content, y finalmente abre la carpeta Themes que contiene todas las carpetas de las plantillas WordPress instaladas en el sitio: Como se muestra en la imagen anterior, cuando ingreses a la carpeta Themes encontrarás la opción para crear una nueva carpeta en la parte superior de la página Folder+, selecciónala y luego nombra la nueva carpeta como Child o cualquier otro nombre que desees. Crear el archivo style.css

Para la plantilla secundaria Los pasos siguientes son crear los archivos básicos de la plantilla secundaria, que son el archivo style.css y el archivo functions.php. Después de crear la carpeta Child de la plantilla secundaria, ingresa a ella y haz clic en el botón Crear nuevo archivo file en la parte superior izquierda de la pantalla, se abrirá una ventana

emergente, escribe el nombre del archivo de estilos (style.css) y luego haz clic en el botón Crear nuevo archivo Después de eso se creará el archivo style.css dentro de la carpeta Child correctamente. Ahora haz clic con el botón derecho del ratón en el nombre del archivo y selecciona Edit o Editar, para abrir la página de edición del archivo style.css.

Pega el siguiente texto dentro de él: /*

Theme Name:

Child Theme URI: http://example.com

Description: Esta es una plantilla secundaria de la plantilla principal base Author:

WordPress en Árabe Author URI: http://example.com

Template: sydney Version:

1.0.0 */ */ Una vez que pegues este texto dentro del archivo style.css y guardes el archivo, notarás que aparece el nombre de la plantilla dentro del panel de control de WordPress < Apariencia <

Plantillas. Y antes de que veamos el aspecto de la plantilla dentro del panel de control de WordPress, déjame explicarte brevemente el texto anterior que consta de 7 líneas de la siguiente manera: Theme Name: Aquí escribimos el nombre de la plantilla como deseamos que aparezca dentro del panel de control de WordPress, en este ejemplo le dimos el nombre Child y puedes darle cualquier nombre que desees. Theme URI: En esta línea escribimos el enlace del sitio web de la plantilla si está disponible y por supuesto es una línea de formato y no afecta el funcionamiento de la plantilla en absoluto.

Description: En esta línea escribe una breve descripción de la plantilla, este texto descriptivo aparece solo en la página de información de la plantilla. Author: En esta línea puedes escribir el nombre del desarrollador de la plantilla y este nombre también aparece en la página de información de la plantilla, y no afecta el funcionamiento de la plantilla de ninguna manera. Author URI: Pones el enlace del sitio web del desarrollador de la plantilla.

Template: Esta es la línea más importante de todas, donde escribimos el nombre de la plantilla principal o la plantilla base para la que deseas crear una plantilla secundaria, y debes escribir el nombre de la plantilla exactamente como aparece en el nombre de la carpeta en el administrador de archivos de WordPress. Version: Aquí puedes escribir la versión actual de la plantilla.

Es una información secundaria también y no afecta su funcionamiento. Entonces, a través de explicar las funciones de los códigos del archivo style.css, podemos decir que la línea que escribe el nombre de la plantilla Template es la línea más importante, así que ten mucho cuidado al escribir el nombre de la plantilla base para la que deseas crear una plantilla secundaria porque esto garantiza que aparezca la plantilla secundaria correctamente.

Por lo tanto, ingresa a la carpeta Themes en el administrador de archivos del sitio, verifica el nombre de la plantilla como aparece en el nombre de la carpeta y escríbelo exactamente como es y con la misma combinación de mayúsculas y minúsculas, porque si escribes el nombre con letras mayúsculas en lugar de minúsculas, la plantilla secundaria no funcionará contigo. Crear el archivo functions.php para la plantilla secundaria De la misma manera que creaste el archivo style.css, ingresa a la carpeta de la plantilla secundaria nuevamente y crea otro archivo llamado functions.php:

Después de eso, abre la página de edición Edit del archivo functions.php: Luego pega el siguiente código dentro del archivo: