Как сделать блок модуля валют в виде списка на PrestaShop

Всем привет. Стандартно валюты выводятся в виде выпадающего списка. Некоторым это удобно, а некоторые хотят чтоб они были списком. Сегодня мы научимся это делать.
Блок модуля валют
Нам понадобится изменить 2 файла, это файл шаблона модуля и файл стиля. Данное руководство будет работать и для нестандартных, это универсальное решение (в некоторых случаях Вам понадобится дополнительно править стили CSS).

Приступим)
Редактируем файл шаблона:
открываем:
/modules/blockcurrencies/blockcurrencies.tpl

ищем:
<div id="currencies_block_top">
	<form id="setCurrency" action="{$request_uri}" method="post">
		<p>
			<input type="hidden" name="id_currency" id="id_currency" value=""/>
			<input type="hidden" name="SubmitCurrency" value="" />
			{l s='Currency' mod='blockcurrencies'} : {$blockcurrencies_sign}
		</p>
		<ul id="first-currencies" class="currencies_ul">
			{foreach from=$currencies key=k item=f_currency}
				<li {if $cookie->id_currency == $f_currency.id_currency}class="selected"{/if}>
					<a href="javascript:setCurrency({$f_currency.id_currency});" title="{$f_currency.name}" rel="nofollow">{$f_currency.sign}</a>
				</li>
			{/foreach}
		</ul>
	</form>
</div>
<!-- /Block currencies module -->

заменяем на:
<!-- Block currencies module -->
<div id="currencies_block_top2">
    <form id="setCurrency" action="{$request_uri}" method="post">
        <p>
            <input type="hidden" name="id_currency" id="id_currency" value=""/>
            <input type="hidden" name="SubmitCurrency" value="" />
        </p>
        <ul>
            {foreach from=$currencies key=k item=f_currency}
                <li {if $cookie->id_currency == $f_currency.id_currency}class="selected"{/if} style="display:inline-block; margin-right:5px;">
                    <a href="javascript:setCurrency({$f_currency.id_currency});" title="{$f_currency.name}" rel="nofollow">{$f_currency.sign}</a>
                </li>
            {/foreach}
        </ul>
    </form>
</div>
<!-- /Block currencies module -->

Редактируем файл стиля:
открываем:
/modules/blockcurrencies/blockcurrencies.css

в самый низ файла добавляем:
#currencies_block_top2{ float: right; }
#currencies_block_top2 li {padding:5px; background:#fff; text-shadow:1px 1px 1px #fff; border:1px solid #f2f2f2; font-size:16px; font-weight:bold; }
#currencies_block_top2 li a {color:#c0c0c0;}
#currencies_block_top2 li.selected {padding:5px; background:#ececec; text-shadow:1px 1px 1px #f2f2f2; border:1px solid #c0c0c0;}
#currencies_block_top2 li.selected a{ color:#000;}

Вот и все. После сохранения файлов и загрузки их на Ваш хостинг, вместо выдающего списка Вы увидите красивый переключатель. Будут вопросы смело задавайте их в комментариях.

4 комментария

avatar
здравствуйте! «красивый переключатель» не совсем получился ((( konditeram.com/
помогите, пожалуйста, изменить размер и шрифт. и почему он посередине страницы?
заранее благодарю
avatar
Спасибо! поправилось. Очень красиво теперь )))
avatar
Все получилось?
avatar
да! СПАСИБО!
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.