Child Themes en WordPress: cómo y por qué usarlos

Publicado: 2016-04-29

El objetivo principal de WordPress es dar a las personas el poder de crear, modificar y mejorar sus propios sitios o blogs. Esto es algo para lo que, hace apenas una década, necesitabas contratar a un diseñador/desarrollador profesional.

Hoy en día, puede cuidar su sitio por su cuenta y puede hacer que se vea como desee.

Pero, ¿qué pasa si quieres ir más allá de lo que te permite hacer el Personalizador de WordPress ? ¿Qué sucede si desea modificar algo sobre su tema actual de WordPress de una manera un poco más personalizada?

Bueno, ahí es donde entran en juego los temas infantiles.

¿Por qué usar temas secundarios?

Empecemos por la otra cara de la moneda:

La desventaja número 1 si *no* usa un tema secundario y, en su lugar, realiza cualquier modificación en su tema actual (normal), es que todas esas modificaciones desaparecerán si alguna vez actualiza el tema.

Ahora, lo que quiero decir con modificaciones :

  • cualquier edición de código manual realizada en cualquiera de los archivos PHP del tema,
  • cualquier modificación al archivo style.css ,
  • cualquier archivo nuevo que haya colocado en el directorio del tema (esto incluye archivos PHP, archivos CSS, incluso gráficos, literalmente todo); este es un problema común si tiene plantillas de página personalizadas.

Entonces, solo para enfatizar esto una vez más, todo lo anterior desaparecerá tan pronto como actualice su tema.

Pero ¿por qué es esto malo?

Bueno, el problema tal vez no sea tan brutal si el tema que usas no se ha actualizado como nunca. Sin embargo, la mayoría de los temas de WordPress de calidad tienden a actualizarse con un poco más de frecuencia. Y eso es especialmente válido para los temas predeterminados en WordPress (por ejemplo, Twenty Fifteen): se actualizan cada vez que se lanza una nueva versión del núcleo de WordPress.

En una situación como esa, no querrá perderse todas las cosas nuevas y los parches que vienen con esas actualizaciones. Efectivamente, hacen que su sitio web funcione correctamente con las nuevas versiones de WordPress y también mejoran la seguridad de todo (corrección de errores y agujeros de seguridad comunes).

Pero hay más El uso de temas secundarios también le brinda un valor agregado en forma de una mejor organización del trabajo.

Aquí está la cosa, si intenta editar algo dentro de su tema actual de WordPress, es más que fácil estropear algo. Por ejemplo, puede borrar accidentalmente alguna línea de código importante, o incluso un archivo completo, etc.

Con los temas secundarios, todas las modificaciones están mucho mejor organizadas. Cada archivo que está en el directorio del tema secundario contiene solo su propio código, por lo que ya no debe preguntarse: "¿He modificado el archivo X o no?"

Cómo construir tu primer tema hijo

Esta parte es realmente fácil y apenas requiere codificación. Primero, sin embargo, algunas pautas generales:

  • Cada tema puede ser un tema principal. En otras palabras, puede crear un tema secundario para cualquier tema que ya tenga.
  • Los temas secundarios dependen de que los padres hagan la mayoría de sus "cosas". De la manera más básica, un tema hijo en blanco toma todo su código, diseño, estilo, etc. directamente del padre sin alterar nada.
  • Un tema hijo requiere la presencia del padre para poder funcionar. Una vez que elimine el tema principal, su tema secundario ya no funcionará.
  • Como se mencionó anteriormente, puede actualizar el tema principal y no perder ninguna de sus modificaciones.
  • En cualquier caso, puede cambiar al tema principal en cualquier momento y volver a la versión original de su tema.

Ahora, en el cómo hacerlo. Un tema hijo solo necesita un puñado de cosas:

  • un nuevo directorio dentro wp-content/themes , y con un nombre/slug único, como quieras llamarlo,
  • un archivo de hoja de estilo dentro de ese nuevo directorio: style.css ,
  • y un archivo functions.php .

Aquí hay un tema secundario de ejemplo que construí para el tema predeterminado anterior de WordPress: Twenty Fifteen. Empecé creando un directorio llamado t15-child :

niño

A continuación, creé dos archivos nuevos en ese directorio y los llamé style.css y functions.php :

niño-tema-dir

Primero editemos el archivo style.css . Aquí está el mío:

 /* Theme Name: T15 child KK Theme URI: http://karol.cc/ Author: Karol K Author URI: http://karol.cc/ Template: twentyfifteen Description: My child of twentyfifteen Version: 1.0.0 License: GNU General Public License v2.0 License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: t15-child */

Nada demasiado elegante, como puedes ver. Las dos líneas cruciales allí han sido resaltadas:

  • Nombre del tema : el nombre del nuevo tema secundario, tal como aparecerá en wp-admin, en Apariencia / Temas .

niño-tema

  • Plantilla : la línea más importante aquí, apunta al tema principal por su slug.

Luego, vayamos al archivo functions.php . Las únicas cosas que tengo allí son:

 <?php function theme_enqueue_styles() { $parent_; wp_enqueue_style($parent_style, get_template_directory_uri().'/style.css'); wp_enqueue_style('child-style', get_stylesheet_directory_uri().'/style.css', array($parent_style)); } add_action('wp_enqueue_scripts', 'theme_enqueue_styles');

Esta es solo una nueva función simple. Se encarga de dos cosas:

  • obtiene la hoja de estilo original del tema principal y
  • “activa” el nuevo archivo style.css , para que pueda realizar más modificaciones al diseño del tema en ese archivo.

Otras cosas importantes a tener en cuenta:

  • En este momento, puede modificar su nuevo archivo style.css libremente. Cualquier clase nueva que coloque allí, o cualquier clase antigua que modifique, afectará su sitio web y su apariencia.
  • Puede agregar otros archivos PHP al directorio de su tema secundario. Esos archivos pueden ser completamente nuevos, por ejemplo, para nuevas plantillas personalizadas, o pueden reemplazar los archivos estándar del tema principal. Por ejemplo, puede crear una versión completamente nueva del archivo single.php para manejar la forma en que se muestran las publicaciones de su blog.
  • Todo lo que coloque en su nuevo archivo functions.php se ejecutará de manera similar a cómo funciona el archivo functions.php nativo en el tema principal.

¿Ya creaste tu tema hijo?

En esta etapa, su trabajo está hecho y ahora tiene un tema secundario básico que puede usar para realizar más modificaciones en su sitio web. O simplemente puede usar este nuevo tema secundario para asegurarse de que los ajustes que ya haya hecho se mantendrán en las futuras actualizaciones del tema principal.

¿Cuál es tu opinión aquí? ¿Está planeando usar un tema secundario en su sitio o blog de WordPress?