От автора: приветствую вас, друзья. Итак, мы продолжаем цикл статей, посвященных знакомству с одной из популярнейших CMS для создания интернет-магазинов – OpenCart (Опенкарт). В этой статье мы поговорим о том, как сделать сайт на OpenCart, конкретнее, мы поговорим о создании шаблонов (тем) для Опенкарт.
По умолчанию, OpenCart предалагает нам сразу после установки одну тему, которую мы можем использовать на сайте, — это шаблон default. Данный шаблон достаточно симпатичен и аккуратно сделан, но все же практически любому владельцу сайта хотелось бы, чтобы его сайт был уникальным, в первую очередь внешне.
Этого можно достичь двумя способами: либо использовать уже готовый шаблон, либо же создать его самому. Как же создать шаблон для Опенкарт? Очень просто. Давайте попробуем. В рамках данной статьи мы, конечно же, не будем создавать уникальный сайт на OpenCart, это тема отдельного курса, как вы понимаете. Однако, мы рассмотрим основные принципы создания сайта.
Итак, перейдем на сервере, где уже установлен движок, в папку catalog/view/theme. Там мы увидим единственную (при условии, что это чистая установка CMS) папку – default. Это и есть стандартная тема магазина. Внутри указанной папки для нас в первую очередь представляет интерес папка template, в которой и находятся все шаблоны движка.
Внимательно познакомьтесь со структурой шаблонов, поскольку когда вы будете создавать собственную тему, вам необходимо будет повторить структуру дефолтной темы. Для примера возьмем папку common и находящиеся в ней шаблоны.
Как видите, файлов достаточно много и каждый из них отвечает за тот или иной кусочек страницы сайта. Например, первый файл – cart.tpl – отвечает за показ содержимого корзины на кнопке в шапке сайта.
Шаблоны column_left.tpl и column_right.tpl, как вы наверное догадались, показывают сайдбары сайта. Файлы header.tpl и footer.tpl отвечают за шапку и подвал сайта и т.д. Создавая свою тему, вы смотрите, какой именно участок страницы вы хотите изменить. Если вам нужно изменить шапку сайта, тогда в папке вашей темы с шаблонами нужно создать папку common, а в ней создать файл header.tpl с нужным содержимым. Давайте попробуем.
Пусть папка с нашей темой называется просто – mytheme. В ней мы создаем нужный файл по следующему пути: mytheme/template/common/header.tpl. Чтобы этот файл не был пустым, скопируем в него полностью код из одноименного файла дефолтной темы.
Теперь давайте перейдем в админку и там зайдем в меню Дополнения – Дополнения, где из списка имеющихся дополнений выберем Шаблоны. В списке доступных шаблонов мы должны увидеть только что добавленный нами – mytheme.
Выберем и установим его в качестве активной темы для сайта. Если после этого вернуться на сайт и обновить страницу, то мы не найдем никаких изменений. Все верно. Дело в том, что Опенкарт работает следующим образом: при формировании страницы он собирает ее из кусочков, подключая файлы шаблонов один за другим. При этом каждый файл вида движок ищет в папке активной темы. Если нужного файла вида там не окажется, тогда Опенкарт подключит нужный вид из дефолтной темы. Ну а поскольку мы целиком скопировали содержимое header.tpl, не внося никаких правок, на сайте ничего не изменилось. Все прочие файлы tpl были взяты из папки default.
Теперь наша задача, как разработчиков темы, править содержимое файлов уже в папке нашей темы. Например, для файла header.tpl мы можем подключить свои стили, скрипты, изменить верстку шапки и т.д. В качестве примера давайте попробуем удалить кнопку корзины. Для этого вернемся к файлу header.tpl и найдем там соответствующий код – это строка 96:
Заменим эту строку на что-то такое:
1 |
<div class="col-sm-3"><h3>Здесь была корзина</h3></div> |
В результате мы должны увидеть такую картину:
Это был лишь пример, показывающий принципы создания темы для OpenCart. На самом деле вопрос создания сайта на Опенкарт – это тема отдельного курса. Ну а на сегодня все. Больше об OpenCart вы можете узнать из наших бесплатных или платных уроков.