Does anyone have a solution for centering your logo on the first screen of a Rise course? The default location of an inserted Branding logo is left justified to the text in the body. I want the logo to center of the text in the body.
Hi there, I was initially confused but I think you are wanting to have this on the first screen below the heading and above text/menu.
I think the best fix you can do is have a wide white image, and then put your Porsche logo in that. Might need to play around with it, and remember it will appear differently depending on where the course is being used e.g. laptop, phone, iPad etc.
I don't think there is an easy way to do this within Rise.
However, if you are familiar with CSS, you can change it after you export it (either in a SCORM zip file for LMS or Web) Once you've downloaded the zip file, you'll have to unzip the file and navigate to scormcontent folder > lib folder > open main.bundle.css in notepad. Find (Ctrl+F if using Windows) the part of the code that reads overview__logo>img{display:block} and add the margin code so it reads overview__logo>img{display:block; margin-left: auto; margin-right: auto;}
You'll have to re-zip the file if you exported for LMS (Scorm package) but your logo will show up in the center. There are pros and cons to changing the code versus the image, just a matter of preference, tools, time, etc.
3 Replies
Hi there, I was initially confused but I think you are wanting to have this on the first screen below the heading and above text/menu.
I think the best fix you can do is have a wide white image, and then put your Porsche logo in that. Might need to play around with it, and remember it will appear differently depending on where the course is being used e.g. laptop, phone, iPad etc.
I don't think there is an easy way to do this within Rise.
However, if you are familiar with CSS, you can change it after you export it (either in a SCORM zip file for LMS or Web) Once you've downloaded the zip file, you'll have to unzip the file and navigate to scormcontent folder > lib folder > open main.bundle.css in notepad. Find (Ctrl+F if using Windows) the part of the code that reads overview__logo>img{display:block} and add the margin code so it reads overview__logo>img{display:block; margin-left: auto; margin-right: auto;}
You'll have to re-zip the file if you exported for LMS (Scorm package) but your logo will show up in the center. There are pros and cons to changing the code versus the image, just a matter of preference, tools, time, etc.
Thank you Louis! That is definitely a perfect solution.