Admin Guide About Customizations

Introduction

Introduction to DesignPLUS Customizations

What are Customizations?

Customizations help you provide unique, themed content for your institutional users to access in the DesignPLUS Sidebar, as well as adjust settings.

These customizations include but are not limited to:

Account Settings
Themes Style that applies to all page elements
Content block templates Placeholders for content that include titles, icons, etc.
Banner, Heading, and Link Grid Styles
Icon Categories
Policies Verbiage set at the institutional level and refreshed upon a page Edit/Save
Banner images & Image files Images saved in the customization course's Files can be accessed and imported into other courses
Templates Preconfigured pages of content that users can edit & Snippets Chunks of HTML content that can be inserted anywhere
Questions Custom text for commonly used questions that can be easily inserted into the RCE
Primary Tutorials Your institution can create Tutorials that users drop into their pages and work with and User Guides Your institution can create User Guides that will be searchable by users inside the Sidebar

You may have just one Primary Customizations course, or many Extended or Shared Customizations courses. Since this course (or these courses) reside on your Canvas instance, you can modify, add, remove, or further define the template items that users can access in the Sidebar at any time.

How does it work?

Custom CSS

The Custom CSS is where all of the style comes in for the content you create. The custom CSS file that is uploaded to Canvas does the following:

Brings in the core styles behind the Design Tools preconfigured themes and other components
Lists the institution specific colors that will be used as defaults for DesignPLUS content

The CSS added by Cidi Labs contains color variables that set institutional branding colors and then it points to the main Cidi Labs CSS files that are housed on our AWS server. This enables us to provide fixes and updates to the core files without the need for the file to be modified at the institution level.

Custom JavaScript

This is where all of the functionality for the DesignPLUS Sidebar is brought into Canvas. The custom JavaScript configuration code that is uploaded to Canvas does the following:

Builds the DesignPLUS sidebar
Adds/Edits/Removes content in the rich content editor
Transforms things like accordions and progress bars
Identifies the Primary Customizations Course
Limits access to the DesignPLUS tools (optional)

The JavaScript added by Cidi Labs contains the customization course ID and default institutional settings. It also points to the main Cidi Labs JavaScript files that are housed on our AWS server. This enables us to provide fixes and updates to the core files without the need for the file to be modified at the institution level.

The JavaScript searches for template content in the Primary Customizations course, and (if available) any Extended Customizations courses.

A Note for Legacy Sidebar Users:

Since the release of the new DesignPLUS sidebar in 2023, there are customization options that are the same as the legacy version as well as several new options for customization, including:

Account Settings - many settings that were previously controlled directly in the JavaScript file can now be adjusted on a page in this course.
Banner, Heading, and Link Grid styles - custom styles for banner title, banner image, headings, and link grid (navigation block) can now be created and saved.
Themes - custom themes can now easily be created without editing the CSS file
Icon categories - groups of icons can be stored in custom categories
Image files - images saved in the customization course's Files can be accessed and imported into other courses
Questions - the new questions tool is similar to the objectives tool in that custom question text can be saved and easily inserted into the RCE
Primary Tutorials and User Guides - institutions can now create their own documentation in guides and tutorials available to users in the sidebar.

Customization Levels

What are the different customization levels?

DesignPLUS allows for predefined styles and content to be loaded in the sidebar while editing a page in the account/sub-account associated with the customization course. There are several levels of customization available. Each layer simply adds another expander to the custom content or style options.

Primary

Canvas course installed at the root level in Canvas.

Applies to all courses & users.

Extended

Canvas courses installed in the sub-accounts.

Additional customizations to all courses within the sub-account

Shared

Canvas course(s) shared with specific users.

Additional customizations available to users who opt in.

Course-Level

Page pulled into any course from Canvas Commons.

Additional customizations for teachers & designers inside a specific course.

To set up an extended or shared customizations course, view the instructions on the page called Extended Customizations Setup. If you'd prefer assistance, you can send a request to support@cidilabs.com and we are happy to walk you through the process to setup your first Extended or Shared Customizations course.

Primary Customization Course

When your institution installs DesignPLUS, we include a Primary Customizations course in the installation, generally at the root level in Canvas.

This course is where you'll build content and styles that should be available to your entire institution.

Extended Customization Courses

If your institution would like, you may also create Extended Customizations courses at the sub-account levels in Canvas.

These courses allow you to create content and styles that will be visible only to certain programs, departments, subject areas, etc.

Shared Customization Courses

If you find you need to limit customizations to a specific audience that is a subset of the users in a sub-account or that needs to extend beyond the limits of a sub-account, you may opt for a Shared Customizations course.

These courses allow you to create content and styles that will be visible to select users.

Course-Level Customizations

In addition to utilizing Customizations courses, we offer many of our Customizations pages in the Canvas Commons, which any and all DesignPLUS users can pull into their own individual courses. Learn more in the DesignPLUS User Guide: Course Level Customizations.

These courses allow any teacher/designer in a Canvas class - regardless of their access or lack thereof to a customizations course - to create content and styles that are unique to a particular course, and available to any teacher/designer in that course.

Comparing Customizations Levels

The table below will help you understand the differences between these levels of customization.

Attributes	Primary Customizations	Extended Customizations	Shared Customizations	Course Customizations	User Customizations
Scope where customizations are available	Institution-wide (if installed at root account)	Sub-account only	User only	Course only	User only
Account Settings such as hiding launch button or limit by role.	Yes	Yes. If present, the Extended account settings will overwrite the Primary account settings.	No	No	No
Enable/disable tools	Yes	Yes	No	No	Yes, only enable/disable advanced tools
Custom styles for themes, headings, link grids, and banner titles.	Yes	Yes	Yes	Yes	Yes, add themes to user favorites
Custom button styles	No	No	No	No	Yes, create and save button styles
Custom color palettes	Yes	Yes	Yes	Yes	Yes, use the User Favorites in the Colors section of Style Editor tool
Custom content blocks	Yes	Yes	Yes	Yes	No
Custom tutorials and user guides	Yes	Yes	Yes	Yes	No
Custom HTML snippets, objectives, and questions	Yes	Yes	Yes	Yes	No
Custom icon categories	Yes	Yes	Yes	Yes	No
Custom policy and template pages	Yes	Yes	Yes	Yes	No
Image tool from files	Yes, must import into current course	Yes, must import into current course	Yes	Yes	Yes, must import into current course
Style Editor saved styles	Yes	Yes	Yes	Yes	Yes
Customization pages must be published	Yes	Yes	Yes	No	N/A
Course visibility must be set to Institution or Public	Yes	Yes	No	No	N/A

Learn More

You can learn more about individual tools and their features in the DesignPLUS User Guide.

Troubleshooting

Why aren't my customizations working?

If customizations are not loading as expected, check some of these common issues:

the JavaScript in your institution's Canvas theme has been altered
the course ID for your customization course changed if it was reset
the page name does not have the proper prefix in square brackets (e.g. [Themes])
the page or course is unpublished (except for course-level customizations)
the course visibility settings are incorrect

Contact support@cidilabs.com for assistance if needed.