Hi! 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.
Hi Jen! You can personalize a Rise course by inserting a logo, adding a cover photo, choosing an accent color, and changing fonts. Just click Settings in the upper right corner of the course editor and use the following options on the Theme tab. More on Rise customization can be found here!
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.
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.
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.
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.
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):
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.
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.
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 ;)
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.
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.
There's no way to get it back into Rise. Needing to edit the css like has been described here is due to the fact that we can't currently access things like this in Rise.
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.
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.
That's an interesting point! Right now, there isn’t a way to do that in Rise 360. Would you be up for logging a feature request to tell us more about your specific needs?
In the meantime, if there’s anything else I can do to help, please let me know!
It would be super nice to have customization capabilities for the welcome/title page -- At least a place to add custom CSS and HTML. The Content pages are great and have all those fancy blocks but the welcome page could use some love.
24 Replies
Hi Jen! You can personalize a Rise course by inserting a logo, adding a cover photo, choosing an accent color, and changing fonts. Just click Settings in the upper right corner of the course editor and use the following options on the Theme tab. More on Rise customization can be found here!
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!
Thanks, these are both helpful responses! I'm not looking to "void the warranty" but it's good to know what is possible and what is not.
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.
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
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
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.
I would love this also, it looks like the default font is the dark grey and yes, 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):
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.
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.
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 ;)
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
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.
Thank you all for the clarification on how to export files. Does anyone know how to import the files after you make adjustments to the CSS?
If it is for use on an LMS then you need to compress all of the files/folders back into a zip file.
Note: Do not just zip the containing folder as this will not work. You need to zip all of the contents within the containing folder.
I appreciate the feedback, Stuart! That makes perfect sense.
Hate to keep bothering you, but can you provide me with step-by-step instructions on how to import you updates back into Rise?
Thanks again!
There's no way to get it back into Rise. Needing to edit the css like has been described here is due to the fact that we can't currently access things like this in Rise.
Hi,
There is a blue line that appears under the heading of the lesson title. It's not as long as most of the course titles.
Can you tell me, is there a way to change the length of this line?
Thank you.
Or can the line under the title even be removed?
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.
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.
Hi Steven,
That's an interesting point! Right now, there isn’t a way to do that in Rise 360. Would you be up for logging a feature request to tell us more about your specific needs?
In the meantime, if there’s anything else I can do to help, please let me know!
This post was removed by the author
Want custom css in Rise like this? Most of your needs can be resolved by adding some custom css.
Youtube: Rise + Custom CSS
Youtube: Before vs After
It would be super nice to have customization capabilities for the welcome/title page -- At least a place to add custom CSS and HTML. The Content pages are great and have all those fancy blocks but the welcome page could use some love.
This discussion is closed. You can start a new discussion or contact Articulate Support.