• Saltar a la navegación principal
  • Saltar al contenido principal
Código Genesis

Código Genesis

Tutoriales de WordPress y Genesis Framework

  • Empieza aquí
  • Cuenta
    • Suscripción
    • Perfil
    • Actualizar tarjeta
    • Favoritos
    • Salir
  • Suscribirse
  • Acceder

Mostrar un listado de lecciones de un curso en WordPress mediante un shortcode

Aprende en este tutorial cómo enseñar un listado de lecciones pertenecientes a un curso en WordPress mediante código, sin plugins.

En Código Génesis contamos con varios suscriptores que venden su propios cursos online y una de las preguntas que más se repite entre ellos es cómo gestionar las lecciones de los cursos.

¿Te encuentras en una situación parecida?

Hay dos soluciones posibles:

  1. Crear un CPT jerárquico, de forma que los cursos sean los «padres» y las lecciones los «hijos». Esta es la opción más sencilla.
  2. Generar dos CPT, uno para «cursos» y otro para «lecciones» para luego relacionarlos entre ellos. Esto resulta algo más complejo.

En este tutorial vas a ver la primera solución: cómo usar un CPT jerárquico para mostrar todas las lecciones «hijas» de forma sencilla.

Este sería el resultado final:

Ejemplo de página principal de un curso con el listado de lecciones.

¿Te interesa? Sigue leyendo. 😉

Pasos para insertar un listado con las lecciones de un curso en WordPress

1. Crea el CPT de cursos

Si ya has creado el CPT de cursos siguiendo el tutorial para hacerlo mediante código, asegúrate de que en el array de argumentos del CPT tienes esta línea:

'hierarchical' => true,

Además, comprueba que el array de ‘supports’ incluye el argumento ‘page-atributes’, por ejemplo:

'supports'              => array( 'title', 'editor', 'excerpt', 'thumbnail', 'custom-fields', 'page-attributes' , 'genesis-cpt-archives-settings', 'genesis-seo', 'genesis-scripts', 'genesis-layouts', 'genesis-rel-author', ),

Ambas opciones son imprescindibles para poder agregar las lecciones como «hijas» del curso.

Si aún no has creado el CPT, añade este código a un fichero llamado cpt-cursos.php:

Para ver este código y los otros 1837 snippets de esta web,
identifícate o suscríbete aquí.

Ahora coloca este archivo dentro de una carpeta llamada cpt-cursos dentro de la carpeta /plugins/.

Una vez hecho, podrás activarlo desde el apartado de plugins como con cualquier otro.

2. Genera el shortcode para mostrar las lecciones del curso

A continuación, necesitas generar la forma de mostrar los elementos «hijo» de los cursos, en este caso, las lecciones.

Para ello, añade este snippet al final del fichero functions.php o a tu plugin de funcionalidades:

Para ver este código y los otros 1837 snippets de esta web,
identifícate o suscríbete aquí.

Este código usa la función wp_list_pages para mostrar las entradas «hijas» del CPT curso.

Además, utiliza add_shortcode para que se muestren donde quieres con solo poner [lecciones].

Ya casi lo tienes.

3. Asigna las lecciones como «hijas» del curso

Por último, crea las lecciones y selecciona su curso padre correspondiente en el apartado de «Atributos de página».

Elegir el curso «padre» de la lección.

La estructura final sería algo así:

Estructura de curso «padre» con lecciones «hijas».

Si quires ir un poco más allá y optimizar tu flujo de trabajo a la hora de crear cursos, podrías crear una plantilla de bloques para el CPT con la estructura de un párrafo de texto introductorio + el shortcode de [lecciones].

Visualización en el editor de bloques de WordPress.

Conclusiones

Si quieres mostrar un listado de la lecciones que incluye un curso sin tener que añadirlas a mano ni recurrir a un plugin, ahora ya sabes cómo hacerlo mediante código.

¿Tienes alguna pregunta o quieres darme una sugerencia para próximos tutoriales? Déjala en los comentarios (esta opción es exclusiva para suscriptores).

CPT PHP Shortcode WordPress

Nahuai Badiola

Desarrollador web especializado en WordPress y Genesis Framework. CEO de Código Genesis y cofundador de OsomPress (temas y plugins para WordPress).

Para dejar dudas o preguntas sobre este código, puedes identificarte o suscribirte.

  • Empieza aquí
  • Sobre Código Genesis
  • Preguntas frecuentes
  • Contacto

Aviso legal · Política de privacidad · Política de cookies · Condiciones de contratación
Copyright © 2023 · Código Genesis

¿Has olvidado tu contraseña?