Получилось сложное название записи, но суть достаточно проста. Задача была в следующем, нужно было в модуле вывода языковой панели изменить вывод флагов на названия языков, которые прописываются в админке и при этом должен был выделяться выбранный язык.
При разработке шаблонов для магазинов на Opencart многие дизайнеры при создании блока мультиязычности используют не отображение флагов, а именно текстовый вывод языковой панели, например, RUS, ENG и прочее. Для того чтобы сверстать такой блок верстальщику нужно внести правки в шаблон, так как по умолчанию выводятся флаги стран. К тому же в дефолтном шаблоне нет возможности задать класс для выбранного (активного) языка. Давайте решать эту проблему.
Как всегда наша задача решается в несколько шагов, путем незначительных правок в шаблоне. В данном случае мы внесем правки в шаблон модуля вывода языковой панели и файл css стилей.
Ищем файл — /catalog/view/theme/default/template/module/language.tpl и заменяем его содержимое:
<?php if (count($languages) > 1) { ?>
<form action="<?php echo $action; ?>" method="post" enctype="multipart/form-data">
<div id="language"><?php echo $text_language; ?>
<?php foreach ($languages as $language) { ?>
<img src="image/flags/<?php echo $language['image']; ?>" alt="<?php echo $language['name']; ?>" title="<?php echo $language['name']; ?>" onclick="$('input[name=\'language_code\']').attr('value', '<?php echo $language['code']; ?>'); $(this).parent().parent().submit();" />
<?php } ?>
<input type="hidden" name="language_code" value="" />
<input type="hidden" name="redirect" value="<?php echo $redirect; ?>" />
</div>
</form>
<?php } ?>На
<?php if (count($languages) > 1) { ?>
<form action="<?php echo $action; ?>" method="post" enctype="multipart/form-data" id="language_form">
<div id="language">
<?php foreach ($languages as $language) { ?>
<?php if ($language['code'] == $language_code) { ?>
<a title="<?php echo $language['name']; ?>"><span class="selected-language"><?php echo $language['name']; ?></span></a>
<?php } else { ?>
<a title="<?php echo $language['name']; ?>" onclick="$('input[name=\'language_code\']').attr('value', '<?php echo $language['code']; ?>'); $(this).parent().parent().submit();"><?php echo $language['name']; ?></a>
<?php } ?>
<?php } ?>
<input type="hidden" name="language_code" value="" />
<input type="hidden" name="redirect" value="<?php echo $redirect; ?>" />
</div>
</form>
<?php } ?>Теперь вносим стили для активного языка в файле — /catalog/view/theme/default/stylesheet/stylesheet.css.
Для этого задаем стили с классом:
.selected-language {
font-weight:bold;
}На этом все. В результате вы получите именно тот результат, который был поставлен в задаче.
Надеюсь вам был полезен этот материал, подписывайтесь на обновления блога, впереди много интересной информации.