Покращуємо зовнішній вигляд модуля перемикання мов Joomla

В налаштуваннях модуля "Перемикач мови" Joomla є три варіанти відображення:

1. Показувати мови випадаючим списком.
2. Показувати зображення прапорів.
3. Показувати повні або короткі назви мов (тільки текст без прапорів).

При цьому, якщо користувач вибирає другий пункт "Показувати зображення прапорів", то третій пункт стає неактивним. Тобто не можна одночасно показувати прапори мов та поряд з ними виводити їхні назви.

Тому, щоб отримати результат як на картинці до цього матеріалу, потрібно завантажити в папку images дві іконки з ім'ям ru-round-icon.png та uk -round-icon.png (тут ru та uk – це початкові літери мови, яка буде встановлена при перемиканні).

Потім потрібно встановити налаштування модуля "Перемикач мови" так як показано на малюнку нижче.

І звичайно ж потрібно змінити код певного файла. Цей файл знаходиться по наступному шляху:

\ваш_сайт\modules\mod_languages\tmpl\default.php

Щоб не змінювати цей файл після кожного оновлення CMS Joomla! рекомендую скопіювати його сюди:

\ваш_сайт\templates\ваш_шаблон\html\mod_languages\default.php

Відкрийте файл \ваш_сайт\templates\ваш_шаблон\html\mod_languages\default.php і знайдіть у ньому код:

<li class="lang-active">
	<a aria-current="true" <?php echo $lbl; ?> href="/<?php echo htmlspecialchars_decode(htmlspecialchars($base, ENT_QUOTES, 'UTF-8'), ENT_NOQUOTES); ?>">
		<?php if ($params->get('image', 1)) : ?>
			<?php if ($language->image) : ?>
				<?php echo HTMLHelper::_('image', 'mod_languages/' . $language->image . '.gif', $language->title_native, ['title' => $language->title_native], true); ?>
			<?php else : ?>
				<span class="badge bg-secondary" title="<?php echo $language->title_native; ?>"><?php echo strtoupper($language->sef); ?></span>
			<?php endif; ?>
		<?php else : ?>
			<?php echo $params->get('full_name', 1) ? $language->title_native : strtoupper($language->sef); ?>
		<?php endif; ?>
	</a>
</li>

Поміняйте цей код на:

<li class="lang-active">
	<a aria-current="true" <?php echo $lbl; ?> href="/<?php echo htmlspecialchars_decode(htmlspecialchars($base, ENT_QUOTES, 'UTF-8'), ENT_NOQUOTES); ?>">
		<span class="flag-icon">
			<img src="/images/<?php echo $language->sef; ?>-round-icon.png" alt="<?php echo $language->title_native; ?>" title="<?php echo $language->title_native; ?>">
		</span>
		<?php if ($params->get('full_name', 1)) : ?>
			<span class="lang-name"><?php echo $language->title_native; ?></span>
		<?php else : ?>
			<span class="lang-name"><?php echo strtoupper($language->sef); ?></span>
		<?php endif; ?>
	</a>
</li>