Как добавить адреса и телефоны в шапку OpenCart? 2/5 (2)

Так получилось, что срочно возникла необходимость создать интернет-магазин на OpenCart.
При этом практического опыта работы с этой CMS до начала проектирования сайта у меня не было.
В арсенале были знания css3 и html5, немного php и javascript, а из популярных систем управления я был знаком только с joomla.
Но отступать было некуда — задача была поставлена и рабочий процесс закипел.

Первая проблема, с которой я столкнулся, это добавление информации о магазине (адреса, телефоны и т.д.) в шапку сайта.

После непродолжительных поисков контроллера, отвечающего за вывод шапки в OpenCart, в файловой структуре на хостинге был найден файл header.twig, который, как выяснилось, необходимо править не через сервер, а через админ-панель.
Там он расположен по адресу: дизайн→редактор шаблона→common→header.twig.

Открываем файл в редакторе, и после контейнера:

<div class="col-sm-4">
<div id="logo">{% if logo %}<a href="{{ home }}"><img src="{{ logo }}" title="{{ name }}" alt="{{ name }}" class="img-responsive" /></a>{% else %}
<h1><a href="{{ home }}">{{ name }}</a></h1>
{% endif %}</div></div>

в строке 76 вставляем следующий код:

<div class="col-sm-3">
<div class="adress">
<p><i class="fa fa-map-marker"></i>Адрес: Опенкартова 3</p>
<p><i class="fa fa-phone"></i>Телефон: 8-911-789-7977</p>
</div>
</div>

В css-файл, расположенный по адресу:
../public_html/catalog/view/theme/default/stylesheet, где «default» — название вашей темы, прописываем следующее:

.adress i {
font-size: 17px;
margin-right: 7px;
color: #2199c7;}
.adress p {
font-size: 15px;
text-align: center;}
Так же необходимо сократить в размерах контейнеры, содержащие логотип и строку поиска.
Для этого в строках 71 и 83  <div class="col-sm-4"> переименовываем в  <div class="col-sm-3">.
 Конечный результат можно увидеть на скриншоте:

Так же через header.twig можно отредактировать верхнее меню, перенести строку поиска и корзину, но об этом в следующих статьях.

 


1 мысль про “Как добавить адреса и телефоны в шапку OpenCart?

    Алексей

    (15.08.2018 - 02:33)

    То,что искал. Спасибо.

Добавить комментарий

Ваш e-mail не будет опубликован.

*

code