LifterLMS: Course Progress Bar Shortcode
Adds a [wpide_llms_progress] shortcode that shows the logged-in student's progress through a course as an accessible bar with a percentage.
Opens WPIDE on
Code
if ( ! function_exists( 'llms_get_student' ) ) {
return;
}
add_shortcode( 'wpide_llms_progress', function ( $atts ) {
$atts = shortcode_atts( array( 'course_id' => 0 ), $atts, 'wpide_llms_progress' );
$course_id = absint( $atts['course_id'] );
if ( ! $course_id ) {
$post_id = get_the_ID();
$course_id = 'lesson' === get_post_type( $post_id ) ? (int) get_post_meta( $post_id, '_llms_parent_course', true ) : ( 'course' === get_post_type( $post_id ) ? $post_id : 0 );
}
$student = llms_get_student();
if ( ! $course_id || ! $student || ! $student->is_enrolled( $course_id ) ) {
return '';
}
$percent = (int) round( (float) $student->get_progress( $course_id, 'course' ) );
return sprintf(
'<div class="wpide-llms-progress"><div role="progressbar" aria-valuenow="%1$d" aria-valuemin="0" aria-valuemax="100" aria-label="%2$s" style="height:10px;border-radius:5px;background:rgba(127,127,127,.25);overflow:hidden"><div style="width:%1$d%%;height:100%%;background:currentColor"></div></div><p style="margin:.4em 0 0;font-size:.9em">%3$s</p></div>',
$percent,
esc_attr( get_the_title( $course_id ) . ' progress' ),
esc_html( sprintf( '%d%% complete', $percent ) )
);
} );
Notes
On a course or lesson page it uses that course; elsewhere add course_id="123".
How to add this snippet
- Install WPIDE on your WordPress site (it is free) and open Code Snippets.
- Use snippet above adds it from the library in one click. Or copy the code into a new snippet with the same code type.
- It is added inactive: review the code and settings, then switch it on.