Imágen destacada Child themes
Carlos Calvo

Carlos Calvo

¿Necesitas un tema hijo (Child Theme)?

Cuando tu tema tiene actualizaciones disponibles, esas actualizaciones a veces pueden hacer que sus ajustes de diseño y personalizaciones desaparezcan.

Esto se debe a que el nuevo código del tema sobrescribirá cualquier código anterior, incluído el que hayas agregado durante cualquier personalización.

Vamos a hablar de si necesitas o no un tema hijo o (Child theme)

Para aclararlo: esto no afecta la configuración que has realizado en el personalizador de WordPress. Pero sí afecta a cualquier CSS personalizado adicional u otro código que puedas haber agregado a tu web. Y aunque no seas programador, créeme, en algún momento necesitarás agregar algún código personalizado.

Para solucionar este problema de actualizaciones de temas que sobrescriben las personalizaciones, los desarrolladores de WordPress pueden crear lo que se llama un tema hijo o child theme. Esto es un poco como una extensión de tu tema que se encuentra sobre tu tema principal, y está en el tema hijo donde coloca el código personalizado. Lo bueno es que este tema hijo se encuentra fuera de tu tema principal, por lo que cuando se actualiza el tema principal, tu código adicional externo personalizado está seguro.

Todo esto es genial en teoría … pero crear y mantener los temas hijo no es muy amigable para los no programadores. Necesitas pelearte con los archivos en el servidor y todas esas cosas engorrosas.

Así que en este post aprenderás:
  1. Las 3 razones por las que podrías necesitar un tema hijo.
  2. La alternativa más fácil y amigable a los temas hijo que logra el mismo resultado final: las actualizaciones seguras de los temas que no perderán sus personalizaciones.

¿Qué pasa cuando las opciones que trae tu plantilla no cubren lo que necesitas?

Si bien tu tema viene con muchas configuraciones y opciones incorporadas, puede llegar un momento en que, por el motivo que sea, esas opciones que viene  incorporadas  con el tema no son suficientes.

Imagina que quieres lograr algo que no es posible con el personalizador o la configuración de tu tema. Algo que sucederá.

Por ejemplo:

CSS: Alguien en un grupo de Facebook te da un código CSS personalizado para solucionar un problema de estilo en particular.

Código: Tal vez le pidas ayuda al soporte de tu tema, y te dan un fragmento de código personalizado.

Archivos y plantillas: O digamos que contratas a un programador para que te ayude con una característica compleja. Deben agregar algunos archivos de plantilla o javascript adicionales al tema para lograr esa característica.


¿Entonces, cuál es el problema?

Digamos que tú o un programador editan los archivos y carpetas importantes en el servidor. Y todo se queda bien. Tus problemas están resueltos, al menos por ahora…

Porque… la próxima vez que el tema tenga una actualización en espera … y actualices el tema … ese proceso sobrescribirá todos tus cambios. 100% todo desaparecido.

¡Nada bueno!

Para solucionar este problema, WordPress tiene un sistema de “temas hijo o child themes”. Es un conjunto especial de archivos en el servidor donde agregas el código para este tipo de modificaciones.

El problema con los temas hijo es que tienes que ser un desarrollador para configurarlos y usarlos.

No necesitas un tema hijo

La buena noticia es que probablemente no necesites un tema hijo en absoluto.

Regresemos a los 3 motivos por los que puedes necesitar agregar código personalizado a tu tema.

1. CSS

Para agregar código CSS adicional, simplemente instala y usa el fantático plugin Simple CSS  (https://wordpress.org/plugins/simple-css/).

Una vez instalado, verás una nueva opción debajo de Apariencia en el panel de administración. Haz click ahí, y obtendrás un editor de CSS en blanco, directamente en WordPress. Te enseñaré algunos ejemplos de cómo usar este plugin en otro post. Pero cualquier código CSS que agregues aquí no se verá afectado por las actualizaciones del tema.

2. Código

Si te dan algún código para copiar y pegar, tal vez por el soporte de tu tema, o por alguien en un grupo de soporte, y se te indica que lo agregues a tu archivo de funciones del tema hijo, simplemente usa el fantástico plugin Code Snippets https://wordpress.org/plugins/code-snippets/.

Una vez activado, tienes un nuevo panel llamado Snippets. Aquí es donde se agrega cada fragmento de código. Es brillante. No solo mantiene organizados todos tus fragmentos de código, sino que en realidad comprueba el código, para ver si está escrito correctamente. Si no lo está, te lo dirá y no te permitirá romper tu sitio. Me encanta este plugin.

Y cualquier código que agregues aquí tampoco se verá afectado por las actualizaciones del tema.

3. Plantillas

La única razón por la que podrías necesitar crear un tema hijo, o mejor dicho, que lo necesite crear un programador, por si tiene que agregar más archivos, como nuevas plantillas de temas o javascript adicional, y esas cosas.

La cuestión es que los 2 temas que recomiendo Generatepress y Astra  tienen muchas funciones integradas, como hooks (ganchos), que reducen seriamente la posibilidad de que cualquiera tenga que crear nuevas plantillas, a diferencia de la mayoría de los otros temas. Y si un programador realmente necesita crear un child theme (tema hijo) en el futuro. Entonces lo pueden hacer ellos mismos fácilmente.


Resumen

En este post has aprendido que las actualizaciones de temas pueden sobrescribir el CSS personalizado u otro código que agregues a tu tema.

Sabes que los temas hijo o child themes son la respuesta tradicional a este problema, pero que son realmente para los programadores.

En vez de eso puedes usar el plugin Simple CSS para agregar CSS personalizado, y el plugin Code Snippets para añadir  código personalizado que te hayan dado para agregar  al archivo functions.php de tu tema hijo.


Recomendaciones para hacer

En tu web de inicio

  1. Instala y activa el plugin Simple CSS (https://wordpress.org/plugins/simple-css/).
  2. Instala y activa el plugin Code Snippets (https://wordpress.org/plugins/code-snippets/).

Ahora está todo configurado y listo para que puedas agregar cualquier código CSS personalizado o funciones de código de manera correcta en el futuro.

 

¿Te gustó el artículo? Por favor, compártelo

Dejar un comentario

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