Joomla Language Bootstrap Dropdown with Flags

29.11.2017
by Meike Müller
Tipps & Tricks
Banner

To replace the regular Joomla dropdown with a nice Bootstrap dropdown including flags (flag icons), just copy the following code in a file called /html/mod_languages/default.php inside your template folder.

Flaggen
 

In your module config for the language module, set "use dropdown" and "use icons" on true.

/yourTemplate/html/mod_languages/default.php

<?php
/**
 * @package Joomla.Site
 * @subpackage mod_languages
 *
 * @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
 * @license GNU General Public License version 2 or later; see LICENSE.txt
 */

defined('_JEXEC') or die;

JHtml::_('stylesheet', 'mod_languages/template.css', array(), true);
?>
<div class="mod-languages<?php echo $moduleclass_sfx ?>">
<?php if ($headerText) : ?>
    <div class="pretext"><p><?php echo $headerText; ?></p></div>
<?php endif; ?>

<?php if ($params->get('dropdown', 1)) : ?>
    <div class="dropdown">
        <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
            <?php foreach ($list as $language) : ?>
                <?php if ($language->active):?>
                    <?php echo JHtml::_('image', 'mod_languages/' . $language->image . '.gif', $language->title_native, array('title' => $language->title_native), true);?> <?php echo $params->get('full_name', 1) ? $language->title_native : strtoupper($language->sef);?>
                        
                <?php endif;?>
            <?php endforeach;?>
            <span class="caret"></span>
        </button>
        
        <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
        <?php foreach ($list as $language) : ?>
            <?php if ($params->get('show_active', 0) || !$language->active):?>
                <li class="<?php echo $language->active ? 'lang-active' : '';?>" dir="<?php echo JLanguage::getInstance($language->lang_code)->isRTL() ? 'rtl' : 'ltr' ?>">
                    <a href="<?php echo $language->link;?>">
                    <?php if ($params->get('image', 1)):?>
                        <?php echo JHtml::_('image', 'mod_languages/' . $language->image . '.gif', $language->title_native, array('title' => $language->title_native), true);?> <?php echo $params->get('full_name', 1) ? $language->title_native : strtoupper($language->sef);?>
                    <?php else : ?>
                        <?php echo $params->get('full_name', 1) ? $language->title_native : strtoupper($language->sef);?>
                    <?php endif; ?>
                    </a>
                </li>
            <?php endif;?>
        <?php endforeach;?>
        </ul>
    </div>
<?php else : ?>
    <ul class="<?php echo $params->get('inline', 1) ? 'lang-inline' : 'lang-block';?>">
    <?php foreach ($list as $language) : ?>
        <?php if ($params->get('show_active', 0) || !$language->active):?>
            <li class="<?php echo $language->active ? 'lang-active' : '';?>" dir="<?php echo JLanguage::getInstance($language->lang_code)->isRTL() ? 'rtl' : 'ltr' ?>">
            <a href="<?php echo $language->link;?>">
            <?php if ($params->get('image', 1)):?>
                <?php echo JHtml::_('image', 'mod_languages/' . $language->image . '.gif', $language->title_native, array('title' => $language->title_native), true);?>
            <?php else : ?>
                <?php echo $params->get('full_name', 1) ? $language->title_native : strtoupper($language->sef);?>
            <?php endif; ?>
            </a>
            </li>
        <?php endif;?>
    <?php endforeach;?>
    </ul>
<?php endif; ?>

<?php if ($footerText) : ?>
    <div class="posttext"><p><?php echo $footerText; ?></p></div>
<?php endif; ?>
</div>
 

 


What is Joomla?

Joomla is a content management system for creating websites. As an open source project, Joomla is not only free, but is also constantly being developed by the community. The functions of Joomla can be extended as needed by modules and plugins and is therefore suitable for websites whose content changes frequently or is constantly expanded, such as blogs or online stores.

You can find more information about individual and responsive web development on our website or in a personal consultation.

Was ist dein Projekt? Wenn du uns darüber erzählen möchtest, rufen wir dich zurück!

 
Meike
Meike
from 29.11.2017

Hello, my name is Meike. I take care of the EXWE back office and am responsible for our social media channels. All of our articles are meant to make your life easier and help you make decisions. Nevertheless, it can happen that something remains unclear, so: If you have questions about this article you can easily reach me at +49 231 93149827.

Du möchtest immer am Zenit der Technik bleiben? Keine News und Blogbeiträge mehr verpassen.
We also have the following interesting posts from our tech blog for you on this topic
What does Google PageSpeed really say?

Why Google PageSpeed is often misinterpreted, what really helps you optimize your load time and guarantee the optimal user experience.

Here's how to connect your retail with online commerce!

E-commerce solutions for your store - how to professionalize your merchandise management with the help of Pickware and JTL

Bootstrap media queries cheat sheet for Bootstrap 3 & Bootstrap 4 & Bootstrap 5

Bootstrap media queries cheat sheet for Bootstrap 3 & Bootstrap 4 & Bootstrap 5 - tips and tricks about Bootstrap from our software developers.




info@exwe.de
+49 231 93149827