How to Set Courses Archive Page Layout in List as Default

If you’re looking to change the layout of your Courses Archive page to display in a list view by default, it’s straightforward to accomplish.

How to Set Courses Archive page in the List Layout?

Here’s a step-by-step guide to help you make this change using JavaScript:

Navigate to the Customizer:

Go to your WordPress dashboard.
In the sidebar menu, click on Appearance.
From the drop-down menu, select Customize.

Access Custom CSS & JS:

In the Customizer, find the section labeled Custom CSS & JS.
Click on Custom JS to open the JavaScript editor.

Note: If you don’t know more about Custom CSS, read the How to Use Custom CSS in Your Online Course article.

Add the JavaScript Code. Copy the following JavaScript code & Paste this code into the Custom JS editor:

setCookie('course_switch', 'list-layout');
function setCookie(key, value) {
var expires = new Date();
expires.setTime(expires.getTime() + (value * 24 * 60 * 60 * 1000));
document.cookie = key + '=' + value + ';expires=' + expires.toUTCString();
}

Publish the Changes:

After pasting the code, make sure to save or publish the changes.
This will ensure that the Courses Archive page will now default to a list layout instead of a grid layout.

ThimPress Development Team

Learn More from ThimPress Knowledge Base Articles: