How to place large logo on top of page?

More
3 months 3 weeks ago #207782 by ricardo
I'm trying to place a large logo on top of the page. I want it to look like the attached example. In previous versions I used to modify the template.css file and added something like

img#logo {
float: right;
margin-left: 5px;
width: 850px;
height: 140px;
background: url(new_logo.png) 0 0 no-repeat;
}

But I cannot figure out how to do it now. Any help would be much appreciated.


I'm using a copy of the vanilla theme and LS Version 3.19.1+191009.
Attachments:

Please Log in to join the conversation.

LimeSurvey Partners
More
3 months 3 weeks ago #207790 by paulfiner
On the right hand side of the Theme editor page next to your copy of Vanilla, there should be a button 'Theme options'.
There is a section labelled 'Logo' and you can upload an image using the button at the very bottom. Then just select the image in the popup.
You might need to style it with CSS to centre it though.
The following user(s) said Thank You: DenisChenu, tpartner

Please Log in to join the conversation.

More
3 months 3 weeks ago #207812 by ricardo
Thanks, I tried that. However, when I upload the logo, it is reduced to a tiny image on the top left of the page.

Please Log in to join the conversation.

More
3 months 3 weeks ago #207814 by tpartner
That will be some CSS rule(s). Can you activate a sample survey so we can see?

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com

Please Log in to join the conversation.

More
3 months 3 weeks ago #207816 by ricardo

Please Log in to join the conversation.

More
3 months 3 weeks ago - 3 months 3 weeks ago #207817 by tpartner
Try adding something like this to the end of custom.css:

.STEM_Explora .logo-container > img {
    max-height: none;
    width: auto;
    margin: 0 auto;
}

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com
Last edit: 3 months 3 weeks ago by tpartner.

Please Log in to join the conversation.

More
3 months 3 weeks ago #207818 by tpartner
...and this to center it...

.STEM_Explora .navbar-header,
.STEM_Explora .navbar-brand {
    float: none;
}

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com
The following user(s) said Thank You: ricardo

Please Log in to join the conversation.

More
3 months 4 days ago #208590 by adridg
Hi,
I´m trying the same but it is not working...
Here my survey: pesquisainst.trt2.jus.br/limesurvey/index.php/635629?lang=pt-BR

Thanks

Please Log in to join the conversation.

More
3 months 4 days ago #208592 by holch
So solution to your problem, but you should use the PNG format instead of the JPEG format for your logo. The JPEG compression makes it looking very bad quality, washed out.

I answer at the LimeSurvey forum in my spare time, I'm not a LimeSurvey GmbH employee.
No support via private message.
The following user(s) said Thank You: adridg

Please Log in to join the conversation.

More
3 months 4 days ago #208593 by Joffm
Hi,
please never say something like

I´m trying the same but it is not working...


It is never the same. So please show what you tried.

And @ricardo obviously used a theme called "STEM_Explora" while you seem to use one called "Vanilla_II".

Did you adapt this?

Joffm


Volunteers are not paid.
Not because they are worthless, but because they are priceless
The following user(s) said Thank You: DenisChenu, adridg

Please Log in to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now