Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Add sequential topic numbers to [uo_dashboard] shortcode
/**
* By default, the Uncanny Owl Toolkit's [uo_dashboard] shortcode does not apply
* topic numbers to its output. This code will add topic numbers via CSS.
*
* These styles should be copied & pasted to a child theme or the "Additional CSS"
* area of the WordPress Customizer. They will add sequential numbers to all topics
* that are displayed via the Uncanny Owl [uo_dashboard] shortcode.
*
* This works best when also using lesson numbers. This will create the following structure:
*
* 1. Lesson 1
* 1.1 Topic 1
* 1.2 Topic 2
* 1.3 Topic 3
* 2. Lesson 2
*
* ...and so on.
*
* Add Lesson Numbers --> https://gist.github.com/davewarfel/e9a7b76fc89f00656d90a721eb9bf079
*
* Feel free to adjust the margin or add additional custom styles.
*
* .learndash.dashboard is needed to target the [uo_dashboard] shortcode output only.
*/
/* LEARNDASH 3.0 */
.ultp-dashboard-lesson__topics {
counter-reset: uo-dash-topics;
}
.ultp-dashboard-topic__name a::before {
counter-increment: uo-dash-topics;
content: counter(uo-dash-lessons) "." counter(uo-dash-topics) " ";
}
/* LEARNDASH LEGACY */
.learndash.dashboard #learndash_lesson_topics_list {
counter-reset: topic-counter;
}
.learndash.dashboard #learndash_lesson_topics_list .topic_item span:before {
counter-increment: topic-counter;
content: counter(lesson-counter) "." counter(topic-counter);
margin-right: 5px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment