<Solved> Block Languages

[anson.c]

Hi all,

 

I am wondering how to take out the drop down menu from the blocklanuages module so that all languages will be displayed horizontally (ie. English / French / Italian) ?

 

Thanks!

Edited February 19, 2013 by anson.c (see edit history)

[NemoPS]

Hi There,

You have to modify the .tpl file for this. I'm attaching one I've used recently. Of course, feel free to remove the classes reference.

 

<!-- Block languages module -->
{if count($languages) > 1}
<div id="languages_block_top">
<ul>
{foreach from=$languages key=k item=language name="languages"}
<li {if $language.iso_code == $lang_iso}class="white"{/if}>
{if $language.iso_code != $lang_iso}
{assign var=indice_lang value=$language.id_lang}
{if isset($lang_rewrite_urls.$indice_lang)}
<a href="{$lang_rewrite_urls.$indice_lang|escape:htmlall}" title="{$language.name}">
{else}
<a href="{$link->getLanguageLink($language.id_lang)|escape:htmlall}" title="{$language.name}">

{/if}
{/if}
{$language.iso_code|capitalize}
{if $language.iso_code != $lang_iso}
</a>
{/if}
</li>
{/foreach}
</ul>

</div>

{/if}
<!-- /Block languages module -->

 

Of course, you have to set those list items to float:left in the css

Edited February 19, 2013 by Nemo1 (see edit history)

[anson.c]

Thanks Nemo! It works great!

[Tahsin_85]

I am also wondering, why languages block not working with jquery like other modules?

 

Example:

$('.languages-block').click(function(e){
		preventDefault(e);
		alert("Hallo World");
});

Edited March 8, 2017 by Tahsin_85 (see edit history)

[NemoPS]

Did you check where it's the binding event, with firefox? Inspect the element, you will see an 'ev' next to it. Click to know where it's set

[Tahsin_85]

Sorry, i cant find a binding event in blocklanguages.tpl

[NemoPS]

Can you share the site's url?

[Tahsin_85]

It's in development, here is the code:

 

/themes/modules/blockuserinfo/nav.tpl:

 

<!-- Block user information module NAV  -->
<div class="header_user_info">
    {if $is_logged}
        <div class="dropdown dropdown_after_before">
            <a class="account" data-toggle="dropdown" href="#"><span class="wdt_li"><i class="icon-user"></i></span><span> {$cookie->customer_firstname} {$cookie->customer_lastname}</span></a>
             <ul class="dropdown-menu toggle_ddm" role="menu">
                <li><a href="{$link->getPageLink('my-account', true)|escape:'html':'UTF-8'}" title="{l s='View my account' mod='blockuserinfo'}"><div class="wdt_li"><i class="icon-suitcase"></i></div> <div>{l s='Account' mod='blockuserinfo'}</div></a></li>
                <li><a href="{$link->getPageLink('history', true)|escape:'html':'UTF-8'}" title="{l s='Orders' mod='blockuserinfo'}"><div class="wdt_li"><i class="icon-list-ol"></i></div> <div>{l s='Orders' mod='blockuserinfo'}</div></a></li>
                <li><a href="{$link->getPageLink('addresses', true)|escape:'html':'UTF-8'}" title="{l s='Addresses' mod='blockuserinfo'}"><div class="wdt_li"><i class="icon-map-marker"></i></div> <div>{l s='Addresses' mod='blockuserinfo'}</div></a></li>
                <li><a href="{$link->getPageLink('identity', true)|escape:'html':'UTF-8'}" title="{l s='Information' mod='blockuserinfo'}"><div class="wdt_li"><i class="icon-info"></i></div> <div>{l s='Personal info' mod='blockuserinfo'}</div></a></li>
                <li><a href="{$link->getModuleLink('favoriteproducts', 'account', [], true)|escape:'html':'UTF-8'}" title="{l s='My favorite products.' mod='favoriteproducts'}"><div class="wdt_li"><i class="icon-star"></i></div> <div>{l s='Favoriten' mod='favoriteproducts'}</div></a></li>
                {capture assign="HOOK_USER_INFO"}{hook h="displayUserInfo"}{/capture}
                {if !empty($HOOK_USER_INFO)}{$HOOK_USER_INFO}{/if}
                
                <li class="divider style="background-color:#D3D3D3;">Tahsin Goekokus</li>
                <li><a class="logout" href="{$link->getPageLink('index', true, NULL, "mylogout")|escape:'html':'UTF-8'}" rel="nofollow" title="{l s='Log me out' mod='blockuserinfo'}"><div class="wdt_li"><i class="icon-sign-out"></i></div> <div>{l s='Sign out' mod='blockuserinfo'}</div></a></li>
            </ul>
        </div>
    {else}
        <a class="login" href="{$link->getPageLink('my-account', true)|escape:'html':'UTF-8'}" rel="nofollow" title="{l s='Log in to your customer account' mod='blockuserinfo'}">
            {l s='Sign in' mod='blockuserinfo'}
        </a>       
    {/if}
</div> 

/themes/modules/blocklanguages/blocklanguages.tpl:

<!-- Block languages module -->

<span class="hideuserblock  wtfx">{if count($languages) > 1}


<div id="languages-block-top" class="languages-block">
{foreach from=$languages key=k item=language name="languages"}
{if $language.iso_code == $lang_iso}
<div class="current">
<span class="fa fa-flag wdt_li" style="font-size:12pt;"></span> <span class="underlinelink">{$language.name|regex_replace:"/\s\(.*\)$/":""}</span>
</div>
{/if}
{/foreach}
<ul id="first-languages" class="languages-block_ul toogle_content">
{foreach from=$languages key=k item=language name="languages"}
<li {if $language.iso_code == $lang_iso}class="selected"{/if}>
{if $language.iso_code != $lang_iso}
{assign var=indice_lang value=$language.id_lang}
{if isset($lang_rewrite_urls.$indice_lang)}
<a href="{$lang_rewrite_urls.$indice_lang|escape:'html':'UTF-8'}" title="{$language.name|escape:'html':'UTF-8'}" rel="alternate" hreflang="{$language.iso_code|escape:'html':'UTF-8'}">
{else}
<a href="{$link->getLanguageLink($language.id_lang)|escape:'html':'UTF-8'}" title="{$language.name|escape:'html':'UTF-8'}" rel="alternate" hreflang="{$language.iso_code|escape:'html':'UTF-8'}">
{/if}
{/if}
<span>{$language.name|regex_replace:"/\s\(.*\)$/":""}</span>
{if $language.iso_code != $lang_iso}
</a>
{/if}
</li>
{/foreach}
</ul>
</div>
{/if}</span>

Here is the javascript snippet:

<script>

$(".header_user_info").click(function(){
$(".languages-block_ul").hide();


});


$(".languages-block").click(function(){
$(".toggle_ddm").hide();


});


$(document).on( "click", function() {


    if ($('.toggle_ddm:hover').length === 0) {
      
         $(".toggle_ddm").hide();

    } 

});


</script>

Edited March 20, 2017 by Tahsin_85 (see edit history)