Quick Navigation
By default, the customer portal's language cannot be chosen by the visitor. The customer portal is displayed in the preferred language for displaying websites configured in the visitor's browser, provided it is an active language in LiveAgent. Alternatively, there is also a way to change the language of the portal by adjusting the URL. You can add the language URL parameter (lowercase L) ?l=LANGUAGE_CODE with the correct language code into the URL to change the language of the portal.
Adding this URL parameter will also create the language cookie in your browser, so the chosen language will be remembered and you don’t have to repeat this step every time.
Only source messages that are available and translated as explained here in the selected language are translated, regular text (not enclosed in ##) is not automatically translated.
Only language codes of active languages can be used.
Language switcher
The mentioned approach can be used to develop a quick language switcher that can be added to the header of your customer portal. Find the code for your used customer portal theme below, which needs to be inserted into the Header HTML field in the customer portal settings > Design > Own HTML.
Material theme
<nav class="navbar">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand KBLogo" href="/"></a>
<input class="menu-btn" type="checkbox" id="menu-btn" />
<label class="navbar-toggle" for="menu-btn">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</label>
<div id="navbar" class="navbar-collapse collapse">
<ul id="menu-header-menu" class="nav navbar-nav">
<li id="menu-item-mytickets" class="menu-item"><a href="{$myTicketsUrl}#My-Tickets"><span>##My tickets##</span></a></li>
{if ($submitTicketEnabled)}
<li id="menu-item-submitticket" class="menu-item"><a href="{$submitTicketUrl}"><span>##Submit ticket##</span></a></li>
{/if}
{if ($userLogged != null)}
<li id="menu-item-user" class="menu-item">
<div class="Avatar">
<img id="loggedUserAvatar" height="35" width="35" src="{$avatarUrl}" class="UserAvatar" title="##Avatar image##" alt="##Avatar image##" onerror='this.style.display="none"' />
</div>
<div class="submenuWrap">
<ul class="submenu">
<li>
<a id="editProfileButton" href="{$myProfileUrl}">##My profile##</a>
</li>
<li id="menu-item-logout" class="menu-item"><a href="{$logoutUrl}">##Logout##</a></li>
</ul>
</div>
</li>
{else}
<li id="menu-item-login" class="menu-item">
<a href="{$loginUrl}" title="##Login##"><span>##Login##</span></a>
</li>
{/if}
<li class="menu-item" style="margin:0 0 0 30px;">
<select onchange="location = this.value;">
<option value="">##Language##</option>
<option value="?l=sk">Slovenský</option>
<option value="?l=en-US">English</option>
</select>
</li>
</ul>
</div>
</div>
</div>
</nav>
Montana theme
<nav class="navbar">
<div class="container">
<a class="navbar-brand KBLogo" href="/"></a>
<input class="menu-btn" type="checkbox" id="menu-btn">
<label class="menu-icon" for="menu-btn"><span class="navicon"></span></label>
<div id="navbar" class="navbar-collapse">
<ul id="menu-header-menu" class="nav navbar-nav">
<li id="menu-item-mytickets" class="menu-item"><a href="{'my_tickets'|module_url}#My-Tickets"><span class="glyphicon glyphicon-envelope" aria-hidden="true"></span> ##My tickets##</a></li>
{if ($submitTicketEnabled)}
<li id="menu-item-submitticket" class="menu-item"><a href="{'submit_ticket'|module_url}"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span> ##Submit ticket##</a></li>
{/if}
{if ($userLogged)}
<li id="menu-item-user" class="menu-item">
<a id="editProfileButton" href="{'profile'|module_url}">
<div class="Avatar">
<img id="loggedUserAvatar" height="33" width="33" src=" {$avatarUrl}" class="UserAvatar" title="##Avatar image##" alt="##Avatar image##" onerror='this.style.display="none"'/>
</div>
{$name}
</a>
</li>
<li id="menu-item-logout" class="menu-item"><a href="{'logout'|action_url}"><span class="glyphicon glyphicon-off" aria-hidden="true"></span> ##Logout##</a></li>
{else}
<li id="menu-item-login" class="menu-item"><a href="{'login'|module_url}"><span class="glyphicon glyphicon-off" aria-hidden="true"></span> ##Login##</a></li>
{/if}
<li class="menu-item" style="margin-top:25px;">
<select onchange="location = this.value;">
<option value="">##Language##</option>
<option value="?l=sk">Slovenský</option>
<option value="?l=en-US">English</option>
</select>
</li>
</ul>
</div>
</div>
</nav>
Adding more options to the switcher
Our provided codes support only Slovak and English languages. If you would like to add more language options to your switcher, add another <option> HTML tag to the code with proper language code, e.g. <option value="?l=cs">Český</option>.
Language codes of all available languages can be found in Configuration > System > Languages.