Watch below video for a quick tour of the Element theme:

Summary

Refined Data Solutions has produced an all new, responsive, and user-friendly theme called Element. This theme is fresh and provides site administrators with the ability to quickly and easily brand their site to encompass their organization’s goals and culture. Each setting in the Element theme can be accessed by navigating to site administration >>>> appearance >>>> themes>>>> element.

Please be aware that any changes made to the theme will immediately appear to all end users.

General settings

The general settings are where to insert logos and images for the branding of the site as well as where to determine how to display the enrolled courses menu.

General settings include:

the logo of the theme. This logo is changed by entering an URL to a public image. A transparent png will work best.
the favicon of the site and theme. This favicon is changed by entering an URL to a public image.
the background image for banners that appear on internal pages of the site. The recommended banner size is 1920px by 210px.
the ability to override the background image for banners with a course image on course pages.

The enrolled courses menu settings includes:

the option to display enrolled courses to end users in the custom menu
the ability to change the terminology of the “my courses” to another selection from the dropdown menu. The other options include “my units”, “my modules”, and “my webinars”.

Homepage slideshow

The frontpage slideshow is a great way to brand and welcome your users to the new Elements theme. The slideshow contains three image spots.

Before a user logs into the LMS, the slideshow appears at the top of the page displaying any designated images. This feature can be used as an opportunity to brand the site, but can also be customized with images to fit any needs.

Each slideshow spot can be updated by navigating to site administration >>>> appearance>>>> themes >>>> element >>>> slideshow. The background, icon, large text and small text captions can all be updated to fit the brand and culture of your organization.

Once a user is logged into the site, the slideshow no longer displays on the homepage. This is because the slideshow takes up a majority of the page, which is great for branding the frontpage. However, not displaying the slideshow on the homepage allows for an improved look and feel to the end user.

Marketing blocks

The marketing blocks in the Element theme is where to highlight specific initiatives within the Refined Training platform. The size of the marketing blocks displays at 300px by default. To change the size of the blocks navigate to site administration >>>> appearance >>>> themes>>>> element >>>> marketing.

RT NOTE: If clearing the textbox of a specified size, the block will always default to 300px. If the value of the textbox is left blank, it is the same as setting the value to 0.

The marketing page is where to update the callout text and the text and size of each marketing block.

The callout text can be edited using a WYSIWYG editor and appears on the frontpage as the header above all the marketing blocks. A secondary callout text appears below the marketing blocks.

Each marketing block itself can have its own defined size and text that is editable using a WYSIWYG editor. Refined Data Solutions recommends that each marketing block have the same size for the best appearance.

This is how the callout text and the marketing blocks appear to the end user:

Statistics

The statistics blocks appear at the bottom of the front page and can track statistical data that can be displayed to the end user. There are four statistics spaces available.

To edit the statistics blocks, navigate to site administration >>>> appearance >>>> themes>>>> element >>>> statistics. Here, add any HTML to track any statistics. Clients can place any HTML in the statistics block to pull dynamic information. The HTML is not limited to statistical data, but can be used to display links or other information. The example below displays a sample code of static information.

The background image of the statistics block can also be specified and customized. The recommended size for the background image is 1920px by 1080px.

The footer appears at the bottom of the screen and is where to provide any footnote information, social link icons, and/or an additional callout text box.

Navigate to site administration >>>> appearance >>>> themes >>>> element >>>> footer to edit footer information.

Enter text for a footnote

There is also a hidden footer image and text that appears after the end user scrolls to the bottom of the page. The image and text can be entered in the callout 3 text box.

This is how the hidden footer appears to the end user.

Enter social link URLs for Facebook, Twitter, YouTube, Instagram, or LinkedIn

Course summary and contact information

When creating a course, a course summary and contact information for the teacher can be added on the course setting page. When this information is added to a course, an “i” icon appears to the right of the course name on the course image located on the front page. If the end user clicks the “i” icon, the summary and/or contact information will appear.

Iconic category thematic refinements

Iconic categories allow the assignment of an icon to a category. This is great for visually organizing categories of courses and assign a single course to multiple categories. This feature was designed to display directly below the header on the Elements theme front page as well as on all course pages.

To adjust the location of the iconic categories on the frontpage, navigate to the front page and turn editing on >>>> select edit settings of iconic categories from the gear icon in the block >>>> select middle within the ‘where this block appears’ section in the ‘default region’, and the ‘on this page’ section in the ‘region’ settings.

This will place the iconic categories block in the center of the page with the banner above on the frontpage only as shown in the example below. The iconic categories block functions the same as all Moodle blocks and can be configured similarly. The recommended size for the icons is 256px by 256px. Refined Data Solutions recommends that all iconic categories are made the same size for the best display results.

The iconic background color can be defined so the images are transparent. A minimum of four icons is required to display for the best end user experience.

Learn more about icon categories here.

IT Client Support

Element theme

Table of contents