Learn in this tutorial how to display the navigation between lessons in a CPT that you have created in Genesis, with a little bit of code.
OsomCode has several subscribers who sell their own courses online and one of the most repeated questions among them is how to manage the lessons of the courses.
Do you find yourself in a similar situation?
There are two possible solutions:
- Create a hierarchical CPT, so that courses are the “parents” and lessons are the “children”. This is the simplest option.
- Generate two CPTs, one for “courses” and one for “lessons”, and then relate them to each other. This is a bit more complex.
In this tutorial you are going to see the first solution: how to use a hierarchical CPT so that you can navigate between all the “child” lessons in a simple way.
This would be the final result:
Interested? Read on.
Steps to add a navigation between the lessons of a course in Genesis
1. Create the course CPT
If you have already created the course CPT by following the tutorial to do it through code, make sure that in the CPT arguments array you have this line:
'hierarchical' => true,
Also, check that the array of ‘supports’ includes the argument ‘page-attributes’, for example:
'supports' => array( 'title', 'editor', 'excerpt', 'thumbnail', 'custom-fields', 'page-attributes' , 'genesis-cpt-archives-settings', 'genesis-seo', 'genesis-scripts', 'genesis-layouts', 'genesis-rel-author', ),
Both of these options are a must in order to add lessons as “children” of the course.
2. Assign lessons as “children” of the course
Finally, create the lessons and select their corresponding parent course in the “Page attributes” section.
The final structure would look something like this:
3. Adds navigation at the bottom of the course lessons
If you already have all the above set up, all you have to do is add this snippet to the end of the functions.php file:
With this code you add the HTML markup of the navigation in the
genesis_entry_footer hook and use conditional tags to display it only in the “child” entries of the CPT course.
In this case the text that will be displayed will be “Previous lesson” and “Next lesson”, but you can customize it as you like.
If you want to make it easier to navigate between lessons in a CPT that you have created yourself, now you know how to do it using code.
Any questions? I read you in the comments.
And if you want to give me any suggestion for future tutorials, leave it in the contact form. Advantages of being a subscriber. 😉