Forum Discussion
Increase the Size of the Logo on the Cover Page
Rise seems to insert the logo at a fixed size on the cover page. Is it possible to make it larger? It appears quite small even on smartphones.
Good news, everyone! Now in Rise 360, you can crop your logo to decrease white space and increase its size to customize your cover page branding.
Have a look at these logo enhancements under Theme > Cover Page, and let us know if you have any questions!
Hi John,
Good morning!
The Rise logo feature has a fixed size, but removing any whitespace surrounding it before upload should help make your logo appear as large as possible. I might even recommend incorporating your logo within your Cover Photo.
Since Rise is responsive, the logo will be automatically scaled up or down to fit the maximum height on the specific device used, while keeping the appropriate aspect ratio at the same time.
I hope this helps!
- JohnCurranCommunity Member
Thanks Katie. I guessed this was the case. It's just the logo is rendered quite small even on a smartphone screen. It's way too small on the desktop view! And you know clients are when it comes to their logo.... ;-)
- StuartMarshall-Community Member
I think the logo actually stays the same size on all devices. You can change the size (after exporting the course) by editing css file if you are comfortable doing that. You just need to tweak what is already there for
.overview__logo>img
to include a width and height value. I do this to have our logo display at the size I upload (174x140px). You might want to experiment with different sizes to see what suits your logo. Here is the code I use:.overview__logo>img {
display: block;
height: 140px;
width: 174px;
}- JohnCurranCommunity Member
Stuart - where do I find the CSS to edit the logo size? Thanks in anticipation.
- ShailendraKu342Community Member
Thanks!
- JohnCurranCommunity Member
Cool....I might just be able to do that. Thanks Stuart.
- JohnCurranCommunity Member
Where do I edit the CSS? Took a look in Chrome using developer tools but can't find it.
- JohnCurranCommunity Member
I can only find three CSS files in the published output (see screenshot) but can't find 'overview_logo' in any.
- DonaldKernsCommunity Member
The CSS file that controls this is main.bundle.css - it is located in \lib folder on a web-only export or in \scormcontent\lib folder in on a SCORM export (once you unzip the downloaded zip file).
- IainAnderson-97Community Member
Hi John, when you email me the course for me to import in I can take a look as well. I also might see what else I can do.
- StuartMarshall-Community Member
It's in the main.bundle.css file. Just open that up in a text editor and search for
overview__logo>img
. Note that it is 2 underlines between 'overview' and 'logo'. - JohnCurranCommunity Member
Great....thanks Stuart!