Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Adding Logo

adridg
Topic Author
Offline
Junior Member

More

8 years 9 months ago #139497 by adridg

Adding Logo was created by adridg

I´m using LS Version 2.50+ Build 160718, and I want to have a logo in my survey.
I´m using "Default" template, and I would like to have my logo in the survey title, like this:
logo in the left and them the survey name
Thank you

The topic has been locked.

Joffm
Offline
LimeSurvey Community Team

More

8 years 9 months ago #139508 by Joffm

Replied by Joffm on topic Adding Logo

Hi, adridg,
to give you a first idea:
in "template.css" add the following:
#topsurveymenubar {
background: black url("../files/logo.png") no-repeat left center;
}
See screenshot.

This will not adapt to smaller screens. Here you have to add some media queries like
@media only screen and (max-width: 640px) {
#topsurveymenubar {
background: black url("../files/logo_small.png") no-repeat left center;
}
}
or similar.

Joffm

Volunteers are not paid.
Not because they are worthless, but because they are priceless

Attachments:

...enshot.678.jpg

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

8 years 9 months ago - 8 years 9 months ago #139520 by tpartner

Replied by tpartner on topic Adding Logo

You can insert the logo image in the <span class="navbar-brand"> element in startpage.pstpl.

Code:

          <span class="navbar-brand">
            <img src="{TEMPLATEURL}logo.png" alt="" style="display:inline; margin-right:5px;" />
            {SURVEYNAME}
          </span>

capture2-2-3-4-5-6-7-8-9-10-11-12-13-14-15-16-17-18-19-20-21-22-23-24-25-26-27-28.png

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Attachments:

Last edit: 8 years 9 months ago by tpartner.

The following user(s) said Thank You: johanstang

The topic has been locked.

adridg
Topic Author
Offline
Junior Member

More

8 years 9 months ago #139525 by adridg

Replied by adridg on topic Adding Logo

Joffm wrote: Hi, adridg,
to give you a first idea:
in "template.css" add the following:
#topsurveymenubar {
background: black url("../files/logo.png") no-repeat left center;
}
See screenshot.

This will not adapt to smaller screens. Here you have to add some media queries like
@media only screen and (max-width: 640px) {
#topsurveymenubar {
background: black url("../files/logo_small.png") no-repeat left center;
}
}
or similar.

Joffm

I did this, but the survey name is covering part of the logo...
pesqinst.trtsp.jus.br/limesurvey/index.p...newtest/Y/lang/pt-BR

The topic has been locked.

Joffm
Offline
LimeSurvey Community Team

More

8 years 9 months ago #139528 by Joffm

Replied by Joffm on topic Adding Logo

As I said, it is not responsive.

But Tony provided the solution.

I have to admit, I always forget the "display: inline" directive.

Volunteers are not paid.
Not because they are worthless, but because they are priceless

The following user(s) said Thank You: adridg

The topic has been locked.

RenataJ
Offline
New Member

More

7 years 3 months ago #164058 by RenataJ

Replied by RenataJ on topic Adding Logo

Hello!
I read this forum but unfortunately the solutions provided do not work in my case:dry:
I'm new to Limesurvey and this is my first survey, so I made screenshots and put arrows where I would like to have my logo (more or less). And I inserted a screenshot of the template manager.
The logo I want to insert is named: Meinlogo.png.
I'm using Version 2.72.6 and only the web-interface.

I hope someone can help me with my problem.
Thanks in advance!

Attachments:

The topic has been locked.

Joffm
Offline
LimeSurvey Community Team

More

7 years 3 months ago #164088 by Joffm

Replied by Joffm on topic Adding Logo

Hello, Rinata,
with this in "startpage.pstpl"

I get this:

Best regards
Joffm

Volunteers are not paid.
Not because they are worthless, but because they are priceless

Attachments:

The topic has been locked.

RenataJ
Offline
New Member

More

7 years 3 months ago #164095 by RenataJ

Replied by RenataJ on topic Adding Logo

Hey Joffm
Thanks, it worked as you said. Now my questions again: is it possible to move the logo to the right? And second: the progress ({PERCENTCOMPLETE} is now very narrow to the title...can this be shifted a bit downwords?
Thanks for an answer

The topic has been locked.

RenataJ
Offline
New Member

More

7 years 3 months ago #164096 by RenataJ

Replied by RenataJ on topic Adding Logo

Sorry forgot the screenshot

Attachments:

...2018-02-14.png

The topic has been locked.

Joffm
Offline
LimeSurvey Community Team

More

7 years 3 months ago #164109 by Joffm

Replied by Joffm on topic Adding Logo

Hi, to set the logo to the right, I used:

Code:

<nav class="navbar navbar-default navbar-fixed-top" id="topsurveymenubar">
<!-- Hier alle col-Größen auf 12 gesetzt -->
        <div class="navbar-header col-xs-12 col-sm-12 col-lg-12">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
<!-- Hier alle col-Größen auf 12 gesetzt -->
            <span class="navbar-brand col-xs-12 col-sm-12" >{SURVEYNAME}
<!-- Hier wird das Logo in die Kopfzeile gesetzt -->
              <div class="col-sm-hidden" style="float:right; display:inline; margin-right:10px;">
                <img id='page_logo' src='{TEMPLATEURL}/files/meinlogo.png' class="img-responsive clearfix pull-right" />                    
              </div>
<!--  -->   
            </span>
        </div>
 
        <div id="navbar" class="navbar-collapse collapse col-xs-12">
            <ul class="nav navbar-nav">
            </ul>
            <ul class="nav navbar-nav navbar-right">
                {SAVE_LINKS}
                {CLEARALL_LINKS}
                {QUESTION_INDEX_MENU}
            </ul>
        </div><!--/.nav-collapse -->
    </nav>
 
    <!-- Top container -->
    <div id="topContainer" class="jumbotron">
        <div class="container">
            {PERCENTCOMPLETE}
            {LANGUAGECHANGER}
        </div>
    </div>

Here you see the css of the "navbar" and the following "jumbotron" that contains the progressbar.
I do not see any issue. Is something changed in the css of this jumbotron?

And this result.

Joffm

Created with LS Version 2.72.4+171110

Volunteers are not paid.
Not because they are worthless, but because they are priceless

Attachments:

...nshot.1399.jpg

The following user(s) said Thank You: RenataJ

The topic has been locked.

RenataJ
Offline
New Member

More

7 years 3 months ago #164111 by RenataJ

Replied by RenataJ on topic Adding Logo

Thank you so much! Works perferctly!
Maybe this is the wrong forum for my next (and hopefully last) problem: I would like to change the Privacymessage to a shorter version. The problem is, my survey is in three languages, can I somewhere put in my own privacymessage in the three languages that this message is then inserted according to the language chosen by the user?

Thanks again!

The topic has been locked.