[umbrella_ld_course_info]
This Applies to
Summary
This shortcode allows parent members to view the progress of their child member’s LearnDash courses. The shortcode is used in combination with our [umbrella_list_children] shortcode.
Shortcode Examples
To use [umbrella_ld_course_info] you’ll need to set up two pages:
- One page that has [umbrella_ld_course_info] on it
- One page that has [umbrella_list_children] on it
Page 1: Create a page with a permalink such as “/child-progress-page/” and place the shortcode [umbrella_ld_course_info] on the page. You can add a page title, but nothing else needs to be on this page.
Page 2: Create a page that has the shortcode below on the page. This shortcode lists all the children a parent member has and in this case, also includes a button. The button is the key part that makes the entire setup work.
Looking at the button, you can see the link is “/child-progress-page?contact_id={{contact.id}}” The page it’s linking to is the first page we created. At the end, the special code simply merges the child’s contact ID in the URL when clicked. For example, in your browser, it would look something like this: “/child-progress-page?contact_id=123”
[umbrella_list_children]
[memb_contact contact_id={{contact.id}} fields=FirstName]
<a href="/child-progress-page?contact_id={{contact.id}}">View LearnDash Progress</a>
%%disconnect.button%%
[/umbrella_list_children]
The [umbrella_list_children] shortcode will display the table below. When a parent clicks the “View Progress” button for a specific child, they’ll be redirected to another page and the child’s Infusionsoft Contact ID will be added to the URL.
[umbrella_ld_course_info] will see that contact ID in the URL and use that to display the LearnDash course information as you see below:
Additional Information
- Only the parent of the child in question can see the child’s progress. This means that even if you share the link to the progress page – it won’t work unless the person viewing is logged in under your (the parent) account.
- The output of the [umbrella_ld_course_info] shortcode is a LearnDash function, so modifications to their [ld_course_info] template will take effect here as well. This can be used for advanced styling changes.
For CSS to style the [umbrella_ld_course_info] output, you can use the code below and modify it as needed.
#ld_course_info #course_progress_details span.learndash-profile-course-title, #ld_course_info #course_progress_details span.learndash-profile-course-access-label {
display: block;
}
#ld_course_info #course_progress_details span.learndash-profile-course-title {
font-size: 110%;
}
#ld_course_info #course_progress_details span.leardash-course-status-not-started {
color:#c14a41;
}
#ld_course_info #course_progress_details span.leardash-course-status-in-progress {
color: #126fa0;
}
#ld_course_info #course_progress_details span.learndash-profile-course-access-label {
opacity: 0.6;
}
For a more advanced, styled [umbrella_list_children] shortcode, use the code below:
<style>
table {
font-family: arial, sans-serif;
border-collapse: collapse;
width: 100%;
}
td, th {
border: 1px solid #dddddd;
text-align: left;
padding: 8px;
}
tr:nth-child(even) {
background-color: #dddddd;
}
</style>
<table>
<tr>
<th>First</th>
<th>Last</th>
<th>Email</th>
<th>LearnDash</th>
<th>Disconnect</th>
</tr>
[umbrella_list_children]
<tr>
<td>[memb_contact contact_id={{contact.id}} fields=FirstName]</td>
<td>[memb_contact contact_id={{contact.id}} fields=LastName]</td>
<td>[memb_contact contact_id={{contact.id}} fields=Email]</td>
<td><a href="https://yourwebsite.com/child-progress-page/?contact_id={{contact.id}}">
<input type="button" value="View Progress" />
</a></td>
<td>%%disconnect.button%%</td>
</tr>
[/umbrella_list_children]
</table>
[umbrella_ld_course_info]
This Applies To
