crear-tema-hijo-wordpress

 

Crear un tema hijo o tema child es muy recomendable cuando hacemos modificaciones en los archivos de nuestro tema en WordPress.

Los escenarios más habituales son:

  • Queremos implementar código de seguimiento de herramientas como Google Analytics, Google Tag Manager o el Pixel de Facebook.
  • Queremos hacer modificaciones estructurales en nuestro Theme, habitualmente modificando el código HTML o PHP.

El tema hijo nos va a permitir mantener nuestros cambios, ya que sus archivos se priorizan sobre el tema padre (el tema que estamos modificando), y nos va a llevar apenas unos minutos configurarlo.

Crear tema child  en WordPress de forma manual

Podemos crear nuestro tema hijo en unos sencillos pasos manualmente sin necesidad de cargar nuestra página con código no necesario de plugins y reduciendo el riesgo por sus potenciales vulnerabilidades.

1. En nuestro panel de WordPress veremos nuesto theme activo accediendo a Apariencia > Temas. Lo que vamos a hacer es crear un nuevo tema que podremos activar desde esta sección.

Un pequeño consejo, si estas utilizando un tema y te encuentras con varios en esta sección te animo a que elimines el resto, no queremos cargar nuestro servidor con más recursos de los necesarios.

 

wordpress-crear-tema-hijo-paso-1

Apariencia ➜ Temas

 

2.  Accederemos al gestor de archivos de nuestro sitio web, el proveedor de alojamiento o hosting te facilitará el acceso para que entres ya sea a través de un administrador de archivos (En nuestro caso cPanel, uno de los más utilizados en la industria) o a través del protocolo FTP (FileZilla por ejemplo es uno de los softwares gratuitos más populares ).

 

wordpress--crear-tema-hijo-paso-2

En cPanel pulsaremos en “Administrador de Archivos”

 

3. Dentro del Administrador de Archivos seguiremos la siguiente ruta a través de las carpetas: Public_html > wp-content > themes. Aquí encontraremos las carpetas que guardan todos los contenidos de nuestros temas.

 

wordpress-crear-tema-child-paso-3

 

4. Crearemos una nueva carpeta con el nombre que queramos para nuestro tema hijo, en nuestro caso vamos a nombrarlo como Rankyra, el nombre de nuestra agencia de marketing y publicidad para Amazon.

 

COMO-CREAR-UN-TEMA-HIJO-EN-WORDPRESS-PASO-4

Pulsamos sobre “+Carpeta” y creamos la de nuestro tema hijo

 

5. Entraremos ahora en la carpeta que hemos creado para nuestro tema hijo y crearemos un archivo con el nombre style.css. Se trata del archivo que va a recoger los estilos visuales de nuestro theme.

 

COMO-como-crear-tema-hijo-wordpress-paso-5

Pulsamos sobre “+Archivo” y creamos el style.css

 

6. Pulsamos clic derecho sobre el archivo style.css recién creado y pegamos lo siguiente, cambiando la información según corresponda:

 

como-instalar-un-tema-hijo-en-wordpress-paso-6

Debemos escribir correctamente el “Theme Name” y el “Template”

 

/*
Theme Name: nombre de la carpeta de tu tema child
Theme URI: http://tuweb.com
Version: 4.0
Description: Tema hijo de rttheme18
Author: Tu
Author URI: http://tuweb.com
Template: Nombre EXACTO de la carpeta de tu tema padre
*//*—————– Cambios a partir de aquí ——————————-*/

 

7. Crearemos ahora el segundo y último archivo que necesitaremos para que nuestro tema child funcione, el functions.php.

 

wordpress-child-theme-paso-7

Creamos el archivo functions.php

 

8. Clic derecho sobre nuestro recién creado functions.php y pegamos el siguiente código:

 

crear-tema-hijo-paso-8

<?php
function my_theme_enqueue_styles() {

 $parent_style = 'parent-style';

 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 ),
 wp_get_theme()->get('Version')
 );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
?>

 

9. Enhorabuena, ya tenemos nuestro tema hijo creado en nuestro WordPress. Únicamente debemos activarlo y habremos terminado.

 

wordpress-temas-hijos-paso-9

Activamos el tema hijo que hemos creado

 

CSS adicional en temas hijos en WordPress

Si estamos creando un tema hijo para un tema en el que hemos trabajado sus estilos a través  del “CSS adicional” deberemos copiarlos y pegarlos en el CSS adicional de nuestro tema hijo.

 

crear-un-child-theme-en-wordpress-facil

Clic en “Personalizar” y vamos a “CSS adicional”

 

CTRL+A para seleccionar todo el código en el CSS adicional de nuestro tema padre, lo copiamos con CTRL+C y activamos el tema hijo. Pegamos el código en el CSS adicional y tendremos todos los cambios aplicados en nuestro nuevo tema.

 

Crear imagen para nuestro tema hijo

Si lo deseamos podemos añadir una imagen en nuestro tema hijo, únicamente debemos de añadir una imagen en formato .png o .jpg con el nombre screenshoot.

 

child-theme-en-wordpress-paso-a-paso

Subimos un archivo de imagen screenshot.jpg

 

Si estas trabajando con WordPress esto te puede interesar:

¿Sabías que una buena formación puede ahorrarte mucho tiempo, además de dinero y frustración en tu trabajo?

He preparado algo muy especial para ti, con este curso adquirirás todos los conocimientos básicos para crear y gestionar blogs, tiendas online y páginas de empresa para tus proyectos y los de tus clientes de manera eficiente y eficaz.

 

Curso WordPress (Básico)

349,00

Valorado con 0 de 5
Leer más

 

41 Responses to Cómo crear un Tema Hijo en WordPress
  1. amoxicillin dose for adults

    amoxicillin dose for adults

  2. will neurontin help tooth pain

    will neurontin help tooth pain

  3. can citalopram cause weight loss

    can citalopram cause weight loss

  4. simultaneous determination of ezetimibe and simvastatin in pharmaceutical preparations by mekc

    simultaneous determination of ezetimibe and simvastatin in pharmaceutical preparations by mekc

  5. depakote 500 mg side effects

    depakote 500 mg side effects

  6. contrave 60 comprimidos

    contrave 60 comprimidos

  7. augmentin for diverticulitis

    augmentin for diverticulitis

  8. cozaar for high blood pressure

    cozaar for high blood pressure

  9. wet finger method effexor withdrawal

    wet finger method effexor withdrawal

  10. diltiazem toxicity

    diltiazem toxicity

  11. flomax side effects skin

    flomax side effects skin

  12. flexeril 20mg

    flexeril 20mg

  13. ddavp test von willebrand

    ddavp test von willebrand

  14. diclofenac cream

    diclofenac cream

  15. aspirin anti inflammatory

    aspirin anti inflammatory

  16. aripiprazole tablets

    aripiprazole tablets

  17. amitriptyline and alcohol

    amitriptyline and alcohol

  18. a nurse will instruct a patient taking allopurinol to take each dose

    a nurse will instruct a patient taking allopurinol to take each dose

  19. bupropion pregnancy

    bupropion pregnancy

  20. ashwagandha for stress

    ashwagandha for stress

  21. does buspar work

    does buspar work

  22. how long does celebrex last

    how long does celebrex last

  23. baclofen withdrawal symptoms

    baclofen withdrawal symptoms

  24. 5ml semaglutide

    5ml semaglutide

  25. protonix 40 mg

    protonix 40 mg

  26. actos mecanicos

    actos mecanicos

  27. estimation of repaglinide

    estimation of repaglinide

  28. does abilify make you sleepy

    does abilify make you sleepy

  29. what are the side effects of robaxin

    what are the side effects of robaxin

  30. acarbose onset

    acarbose onset

  31. Cómo crear un Tema Hijo en WordPress | Álvaro Boes

    https://van-dreuten.de/test/

  32. remeron effexor

    remeron effexor

  33. voltaren cream prescription

    voltaren cream prescription

  34. synthroid dizziness

    synthroid dizziness

  35. spironolactone 3 times a day

    spironolactone 3 times a day

  36. venlafaxine morning or night

    venlafaxine morning or night

  37. typical dose of tamsulosin

    typical dose of tamsulosin

  38. ivermectin 1 cream 45gm

    ivermectin 1 cream 45gm

  39. sitagliptin ketoacidosis

    sitagliptin ketoacidosis

  40. tizanidine muscle relaxant

    tizanidine muscle relaxant


[top]

Deja un Comentario

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