Создание двух-колоночного шаблона

theme       Как вы успели заметить мой сайт двух-колоночный и в этой статье я поделюсь как это делается. Обратите внимание, что руководство предназначено для Prestashop 1.5, если вы хотите попробовать в версии 1.4, не копируйте слепо код, а делайте все по аналогии.

 Для того что бы  попробовать этот способ предлагаю вам создать копию шаблона, который вы хотите сделать двух-колоночным. Так вы сохраните оригинал и в случае неудачной попытки повторить еще раз.

В Prestashop 1.5 появилась возможность создания новой темы прямо из бэк-офиса.

Настройки- >шаблоны->добавить новый(кнопка справа в виде плюсика).  Название шаблона может быть произвольным, а в поле “тема по умолчанию для копирования недостающих файлов шаблона” выбираете шаблон над которым хотите поработать.  Для примера я буду работать с шаблоном по умолчанию-default, а новую тему назову default_mod.

создание темы

Все что будет описано ниже лучше всего проверять на локальном сервере. Перед изменениями файлов шаблона рекомендуется установить опцию “Рекомпилировать файлы шаблонов если файлы были обновлены” в Расширенные параметры->Производительность


Сохраняем и активируем вновь созданную тему.
2
Приступаем к изменениям файлов шаблона. Для создания двух колонок редактируем файл header.tpl в themes/default_mod/header.tpl
Я использую редактор Notepad++ . Открываем файл и находим строчки

 

Скрываем левую колонку комментируя нужный участок кода Smarty  используя теги {*код*}

 

Обратите внимание что я изменил еще и класс центрально колонки изменив на grid_7 alpha.
Левая колонка на сайте у нас не будет видна пользователям, но модули расположенные в ней будут по прежнему активны, поэтому следует зайти в бэк-офисе Модули->Расположение модулей и удалить ненужные вам модули, а нужные перенести в правую колонку с помощью “Живого редактора”.
Обновляем страницу сайта и видим следующую картину
3
Необходимо поправить шаблон модуля homefeatured.
Внимание! Все файлы шаблонов и css модулей необходимо менять в папке вашей темы, в нашем случае default_mod. В противном случае при обновлении версии Prestashop вы потеряете все свои изменения.
Находим файл шаблона модуля популярные товары в директории themes/default_mod/modules/homefeatured/homefeatured.tpl
и изменяем строку

 

на

 

Теперь у нас будет выводиться 5 товаров в строке с необходимыми пробелами между блоками
4
Аналогичным способом можно подогнать и остальные модули на главной.
Продолжение следует…
До встречи на страницах http://webnewbie.ru/ и моего блога

Comments (11)

Дмитрий
28.05.2013 - 16:06 / Ответить

Я редактирую метку
После редактирования — обратите внимание на изменения в классе! — она приобретает такой вид

Ну, а в остальном, как у Вас, более-менее…

Alexey
03.07.2013 - 15:02 / Ответить

Доброго времени суток. Спасибо вам, за подробную инструкцию, по создание двух-колоночного шаблона. Но у меня возникла проблема с Title к картинкам, в место букв, он стал выглядеть так: title=”Родная Моя”>Родная Моя с чем это может быть связано и как это поправить, я понимаю что нужно поменять кодировку, но не могу найти где, подскажите как это сделать, или может где нибудь скачать новый модуль?

Alexey
03.07.2013 - 15:05 / Ответить

Дополнение: вижу что у вас мои крикозябли стали отображаться правильно, тогда такой пример с тайтлом &#1056 ;&#1086 ;&#1076 ;&#1085

04.07.2013 - 02:35 / Ответить

Изменение шаблона не может повлиять на кодировку шрифта, если в шаблоне не используется кириллица. Посмотрите в БД как там отображается title. Есть еще один вариант отображение юникода в денвере, но это проблема уже самого денвера.

Андрей С.
07.08.2013 - 00:22 / Ответить

Подскажите как сделать тоже самое, только оставить левую колонку и центральную, а правую удалить. Спасибо

12.08.2013 - 12:23 / Ответить

для этого Вам необходимо редактировать файл footer.tpl
найдите строки [php]<!– Right –>
<div id="right_column" class="column grid_2 omega">
{$HOOK_RIGHT_COLUMN}
</div>
</div>[/php]
и закомментируйте их

Андрей
13.11.2013 - 21:22 / Ответить

Сделал, но не могу центральную колонку расширить, подскажите что делать?

14.11.2013 - 13:11 / Ответить

Если вы все сделали как описано выше, то центральная колонка уже расширена на ширину боковой колонки. А если нужно модули подогнать под ширину центра, то править нужно стили этих модулей.

Катерина
28.04.2014 - 01:34 /

спасибо,
но методом “втыка” всетаки получилось это сделать,
надо было писать =_=

Катерина
28.04.2014 - 01:35 /

grid_7 alpha omega в свойствах центральной колонки

Владимир
26.02.2015 - 19:57 / Ответить

Здравствуйте.
Вот без этих двух слов: “alpha omega” после grid_7 центральная колонка не занимает полностью свою позицию. После добавления я сегодня исправил положение на своём сайте.
Осталось найти где поправить код для избранных товаров.

Спасибо Евгению за статью, и Катерине за такую важную мелочь.
С/у Владимир.

Leave a Reply