I'm building a course Rise and I use the Continue button a few times throughout. We're on a push for accessibility and need our branding and contrast to be used quite often. Because of the restraints in Rise for buttons, I'm trying to import a button from Storyline. I've found a way to make it LOOK like it should in Rise, but how do I make it STOP the course in Rise as the embedded Continue button does?
What trigger settings should I use from Storyline?
I don't believe it's possible to have Rise pass information to a Storyline block, at least not without getting into the realm of custom JavaScript.
I think the simpler solution for your needs would be to customise the CSS, so any 'Continue' blocks you include will use your colour of choice. This is more trouble than it should be but not too complex.
First you want to customise the below, changing the emboldened part to whatever hex colour you want to use for the button.
Once you've exported your course from Rise, open up index.html in a text editor, like Notepad. If you search for "brand" it should take you to the <style> section where branding colour rules live.
Simply paste your extra style rule in the same place, on a new line, and your 'Continue' blocks should now be a custom colour. (Hopefully; I haven't tested this for real, just using Chrome's developer tools.)
Naturally you'll need to manually repeat this process whenever you republish a course.
Thanks for the quick response! Like most companies, we have a few different colors that we want to use to brand. If we could have the ability to change the button color as well as all the text options (size, color, bold, etc.), that would be great!
Also, the ability to change the button size or have it automatically change the size for text would be great!
Besides having the Continue button displaying at all time, I have another questions.
Is there anyway to change the text colour from white to black or any other colour? For my module I have to use a colour palette due the branding requirements. However, on the yellow palette that I have to use, the Continue text in white fails contrast requirements for accessibility. Please advice. Thanks, Stef.
I can understand how white text on a yellow background isn't ideal and would fail accessibility requirements. I'll bring this up with my team, and I'll let you know if we make any changes that will help!
That will be wonderful. We are having a huge issue because of this as our branding colours are yellow and our modules are failing the accessibility contrast due to the lack of color options for the Continue button. Thanks.
10 Replies
Hi Neal,
A button in a Storyline Block won't restrict navigation the same way a Continue button will in Rise 360.
Tell me more about the customization options you need for the Continue button, and I'll pass your request to my team!
I don't believe it's possible to have Rise pass information to a Storyline block, at least not without getting into the realm of custom JavaScript.
I think the simpler solution for your needs would be to customise the CSS, so any 'Continue' blocks you include will use your colour of choice. This is more trouble than it should be but not too complex.
First you want to customise the below, changing the emboldened part to whatever hex colour you want to use for the button.
.brand--background[role="button"] { background-color: #000000 !important; }Once you've exported your course from Rise, open up index.html in a text editor, like Notepad. If you search for "brand" it should take you to the <style> section where branding colour rules live.
Simply paste your extra style rule in the same place, on a new line, and your 'Continue' blocks should now be a custom colour. (Hopefully; I haven't tested this for real, just using Chrome's developer tools.)
Naturally you'll need to manually repeat this process whenever you republish a course.
Hi Alyssa,
Thanks for the quick response! Like most companies, we have a few different colors that we want to use to brand. If we could have the ability to change the button color as well as all the text options (size, color, bold, etc.), that would be great!
Also, the ability to change the button size or have it automatically change the size for text would be great!
Thanks again, Alyssa!
Hey Sam,
Thanks for the great info! I was wondering if we could do that and we will definitely try it out. Much appreciated sir!
Thanks for the insight, Sam! I'll be sure our team sees your request!
Being able to brand the Continue button both with colours and logo’s would make Rise a much better sell to specific customers requests...
Cookies should read colours
Hi there,
Besides having the Continue button displaying at all time, I have another questions.
Is there anyway to change the text colour from white to black or any other colour? For my module I have to use a colour palette due the branding requirements. However, on the yellow palette that I have to use, the Continue text in white fails contrast requirements for accessibility. Please advice. Thanks, Stef.
Hi Stef,
I can understand how white text on a yellow background isn't ideal and would fail accessibility requirements. I'll bring this up with my team, and I'll let you know if we make any changes that will help!
That will be wonderful. We are having a huge issue because of this as our branding colours are yellow and our modules are failing the accessibility contrast due to the lack of color options for the Continue button. Thanks.
This discussion is closed. You can start a new discussion or contact Articulate Support.