Back to limesurvey.org

Welcome to the LimeSurvey Community Forum

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

Hyperlink in navbar appearance based on survey language

  • krosser
  • krosser's Avatar Topic Author
  • Offline
  • Elite Member
  • Elite Member
More
6 years 2 months ago - 6 years 2 months ago #173069 by krosser
Hyperlink in navbar appearance based on survey language was created by krosser
Hi guys,

I need to make a custom hyperlink in the navbar switch its name translation and its link along with the survey's language.

Currently, I have it similar to this in nav_bar.twig:
Code:
<div id="{{ aSurveyInfo.id.navbar }}" class="{{ aSurveyInfo.class.navbarcollapse }}" {{ aSurveyInfo.attr.navbarcollapse }} >
        <ul class="{{ aSurveyInfo.class.navbarlink }} navbar-right" {{ aSurveyInfo.attr.navbarlink }}>
            {{ include('./subviews/navigation/save_links.twig') }}
            {#{{ include('./subviews/navigation/clearall_links.twig') }}#}
            {{ include('./subviews/navigation/question_index_menu.twig') }}
            {{ include('./subviews/navigation/language_changer_top_menu.twig') }}
            <li class="nav-item">
                <a class="nav-link" href="https://mywebsite.com" target="_blank">My website</a>
            </li>
        </ul>
    </div>

I've added the link at the end. But when I switch between the languages I need to somehow add that it switches to another link along with the interface like in the above twig files.

Perhaps, it can be done like with the logo switch?
Code:
{# Logo option #}
        {% if( aSurveyInfo.options.brandlogo == "on") %}
        <div class="{{ aSurveyInfo.class.navbarbrand }} logo-container hidden-xs"  {{ aSurveyInfo.attr.navbarbrand }}  >
                {{ image('./files/logo-eng.png', 'alt-text for my file', {"class": "logo-en"}) }}
                {{ image('./files/logo-fr.png', 'alt-text for my file', {"class": "logo-fr"}) }}
        </div>
        {% else %}
            <div class="{{ aSurveyInfo.class.navbarbrand }}"  {{ aSurveyInfo.attr.navbarbrand }} >
                {{ aSurveyInfo.name }}
            </div>
        {% endif %}

Any help would be really appreciated!
I'm using the latest LS 3.22 hosted on LS servers, not installed locally.
Last edit: 6 years 2 months ago by krosser. Reason: Had to clarify
The topic has been locked.
  • LouisGac
  • LouisGac's Avatar
  • Visitor
  • Visitor
6 years 2 months ago - 6 years 2 months ago #173073 by LouisGac
Replied by LouisGac on topic Hyperlink in navbar appearance based on survey language
turn debug mode on, use:

 {{ dump(aSurveyInfo) }}

find the name of the variable where language is saved, use it to build a if statement to display a link or another.


so something like :
Code:
 
{% if ( aSurveyInfo.languagecode == "en") %}
 
<a ... > my link for english </a>
{% endif %}
 
 
 
Last edit: 6 years 2 months ago by LouisGac.
The topic has been locked.
  • krosser
  • krosser's Avatar Topic Author
  • Offline
  • Elite Member
  • Elite Member
More
6 years 2 months ago #173075 by krosser
Replied by krosser on topic Hyperlink in navbar appearance based on survey language
Are you referring to turning debug mode on in application/config.php or to the JS-Debug mode in Global settings?

Sorry but you lost me on how to use {{ dump(aSurveyInfo) }} to find the name of the variable...

I haven't debugged LimeSurvey before, so this is something I still need to learn.
I'm using the latest LS 3.22 hosted on LS servers, not installed locally.
The topic has been locked.
  • krosser
  • krosser's Avatar Topic Author
  • Offline
  • Elite Member
  • Elite Member
More
6 years 2 months ago #173105 by krosser
Replied by krosser on topic Hyperlink in navbar appearance based on survey language
I've managed to find a loophole with dynamic content on a page using URL parameters, like it's discribed here:
How to Display Dynamic Content on a Page Using URL Parameters

But the issue is that once loaded, the page goes to a hashtag # at the end and the hyperlink disappears when I click on 'next' or change the language, because there is no "lang" in the URL anymore.

If anyone knows how to overcome this, please share...
I'm using the latest LS 3.22 hosted on LS servers, not installed locally.
The topic has been locked.
  • LouisGac
  • LouisGac's Avatar
  • Visitor
  • Visitor
6 years 2 months ago #173106 by LouisGac
Replied by LouisGac on topic Hyperlink in navbar appearance based on survey language
debug mode and dump was just general indications about how to find a variable.

For what you're trying to do:
Code:
 
{% if ( aSurveyInfo.languagecode == "en") %}
 
<a ... > my link for english </a>
{% endif %}
 
 
 
The topic has been locked.
  • krosser
  • krosser's Avatar Topic Author
  • Offline
  • Elite Member
  • Elite Member
More
6 years 2 months ago - 6 years 2 months ago #173108 by krosser
Replied by krosser on topic Hyperlink in navbar appearance based on survey language
I assume that this can be done only when you have the LS installed locally.

And from various places in the manual, it looks like you gotta know Yii as well, which isn't my case.
Debugging
Development and debugging

I'll try to figure out the code from what you wrote...
I'm using the latest LS 3.22 hosted on LS servers, not installed locally.
Last edit: 6 years 2 months ago by krosser.
The topic has been locked.
  • LouisGac
  • LouisGac's Avatar
  • Visitor
  • Visitor
6 years 2 months ago #173109 by LouisGac
Replied by LouisGac on topic Hyperlink in navbar appearance based on survey language
no, you can edit the files via the theme editor:
www.limesurvey.org/manual/New_Template_System_in_LS3.x
The topic has been locked.
  • krosser
  • krosser's Avatar Topic Author
  • Offline
  • Elite Member
  • Elite Member
More
6 years 2 months ago #173111 by krosser
Replied by krosser on topic Hyperlink in navbar appearance based on survey language
if you are referring to editing twig files in themes, then yes, I know.
We are talking about debugging.
I'm using the latest LS 3.22 hosted on LS servers, not installed locally.
The topic has been locked.
  • krosser
  • krosser's Avatar Topic Author
  • Offline
  • Elite Member
  • Elite Member
More
6 years 2 months ago - 6 years 2 months ago #173113 by krosser
Replied by krosser on topic Hyperlink in navbar appearance based on survey language
Okay, it looks like you've given most of the basis, so then it's something like this (as an example):
Code:
<div id="{{ aSurveyInfo.id.navbar }}" class="{{ aSurveyInfo.class.navbarcollapse }}" {{ aSurveyInfo.attr.navbarcollapse }} >
        <ul class="{{ aSurveyInfo.class.navbarlink }} navbar-right" {{ aSurveyInfo.attr.navbarlink }}>
            {{ include('./subviews/navigation/save_links.twig') }}
            {{ include('./subviews/navigation/question_index_menu.twig') }}
            {{ include('./subviews/navigation/language_changer_top_menu.twig') }}
 
            {% if ( aSurveyInfo.languagecode == "en") %}
            <li class="nav-item">
            <a class="nav-link-en" href="https://www.google.com" target="_blank"> my link for English </a>
            </li>
            {% endif %}
            {% if ( aSurveyInfo.languagecode == "fr") %}
            <li class="nav-item">
            <a class="nav-link-fr" href="https://www.google.fr" target="_blank"> my link for French</a>
            </li>
            {% endif %}
 
        </ul>
 
    </div>

It's working, when I switch between languages. I just need to reposition/CSS the links now, since they are out of line with other elements.

UPDATE:
I've forgotten to add the list groups to links. So, with that it aligns nicely with other elements and my theme CSS is enough. I've updated the code.

<li class="nav-item">
...
</li>
I'm using the latest LS 3.22 hosted on LS servers, not installed locally.
Last edit: 6 years 2 months ago by krosser. Reason: Added list groups to web-links
The following user(s) said Thank You: LouisGac
The topic has been locked.
Moderators: tpartner, holch

Lime-years ahead

Online-surveys for every purse and purpose

Pricing & Plans
Get started

Legal

About Us

Open Source