23 Replies
Dario Dabbicco

Hi Jen, there is indeed the possibility to customize some elements of Rise courses, but it requires at least a basic knowledge of:

- Firefox or Chrome page inspector

- basic HTML

- CSS rules and selectors

Of course these customizations "void the warranty" by Articulate on Rise products, so you must now what are you doing!

Stan Dormer

Hi Elizabeth,

Is there any way of setting the base colour for a font? For one of my learning programmes I need plain black for the fonts, due to accessibility reasons. However, I'm spending ages selecting and recolouring text fields which (in Roboto) first appear as a dark grey, in order to get plain black.

Steve Clark

Hi Elizabeth,

Do we have the ability to modify/add CSS classes to further style the page through Rise or are these the only options we have? We're trying to match the brand of our Rise dashboard with our website so the experience is a little more unified and was curious what limitations we have.

Thank you!

Steve Clark, Autosoft

Steve Clark

Dario,

Can you direct us to where you manage CSS in the Rise Articulate dashboard? I only see an option to edit the logo, cover photo, fonts, and accent colors, but nothing in regards to updating class styles.

For example, we would like to update the background color of the grey sidebar to blue and make the overlying icons and text white to make it more consistent with the look/feel of our company's software.

Curious to hear yours and Elizabeth's thoughts on this and if this is possible.

Thank you!

Steve Clark, Autosoft

Ashley Terwilliger

Hi Steve and Stan,

The options you see for Theme, Color, Fonts, etc. are the current set up in Rise. I've seen a few folks look at editing the CSS on their own, but that's done outside the normal Rise dashboard or features. 

If your a CSS editing pro, definitely share your steps here as I'm sure other folks may want to use that level of customization. 

Stuart Marshall
Michael Bauer

I spend a long time changing each section of each screen.

That's crazy. If you really want to change away from the dark gray then you can do this in the main.bundle.css file in the exported files. The code below is what i have. It is this body part that styles the bulk of the text in your Rise modules (your code  may differ depending on your font etc):

body {
margin: 0;
line-height: 1.5;
font-family: lato, sans-serif;
font-size: 1.6em;
color: #313537
}

The color value there (#313537) is the dark gray. If you want black you can change this to #000. I personally prefer the gray as it is much easier on the eyes.

Note though that any changes you make in the css will need to be repeated every time you export a update from Rise.

Stuart Marshall
Dario Dabbicco

Of course these customizations "void the warranty" by Articulate on Rise products, so you must now what are you doing!

You can definitely break your exported modules if you don't know what you are doing but it makes no difference to Articulate and certainly doesn't void any warranty. And if something does break when you are playing about with things then a fresh export from Rise will give you a fully working course again.

Stuart Marshall
Jen Schofield

Has anyone had the ability to do additional color customization within the Rise UI?  My SME's are looking to change the look of the side menu colors, layout, etc.

Yes all of that can get changed in the css. What exactly would you want it to do? And should your SMEs not just be concerned with the content as opposed to the look? The design is your area ;)

Stan Dormer

Stuart,

Whilst some of us might be able to change the CSS code, that doesn't work for most learning system creators.

What would be really nice is to have, in the custom settings section of a module, the ability to do a few little things: like setting the baseline colour for chosen fonts, like being able to choose a 'creator name' such as a company as a substitute for the author name, or being able to set UP a corporate colour scheme - the sort of thing that most WordPress users take for granted.

And, would I be correct in thinking that when you copy a lesson, or a module, that any customisation of the CSS will be lost (?) so you are left with a constant overhead of re-customisation of the CSS either for this or for each new export?

We love RISE and it is getting there, but we really need some extra tweaks such as those I've described, and maybe, most of all, the ability to search the learning or to print out or generate a file of the text content to satisfy organisational compliance (particularly within the financial services sector, and for accessibility reasons - where it is mandatory to produce a text file to accompany online learning to support those with disabilities) and to speed up the editing of larger productions where the lack of search and print facilities makes locating errors trickier.

Regards,

Stan

Stuart Marshall

I don't disagree Stan. Having more customisation options within Rise would be most welcome. These hacks are just for those that need them meantime. Making tweaks to the css like this isn't difficult and would be WAY quicker than changing the color of every text box in a course.

And yes it would need tweaked after every export (as i mentioned) but that would still be quicker. You could even just copy over your old main.bundle.css file over the new one.

Crystal Horn

Hey Margaret!  The lines you see under the lesson title include an accent line, and a lesson progress line:

The progress line remains visible in the lesson when scrolling down, and it grows as your learners complete each block.  The formatting for these lines is limited to what accent color you chose in your course settings.

Steven Catania

Is there anything being done to provide customization for the symbols/boxes that appear next to  or around right/wrong answers in interactions? For instance, if my accent color is red, a red check mark appears next to the right answer and it is surrounded by a red rectangle. For many people, red means wrong, even in situations like this when red is the correct answer.