Файлы шаблона сгруппированы в папки с именем шаблона в /phpshop/templates/ и разделены на группы по имени применения:

  • product - шаблоны товаров
  • catalog - шаблоны категорий
  • banner - шаблоны баннеров
  • news - шаблоны новостей
  • page - шаблоны страниц
  • selection - шаблоны фильтров товаров
  • ружим
  • users - шаблоны личного кабинета пользователей
  • order - шаблоны формы заказа
  • search - шаблоны поиск
  • gbook - шаблоны отзывов
  • map - шаблоны карты сайта
  • php - код раширений дизайн-хуков
  • images - картинки, исползующиеся в шаблоне
  • style.css - файл CSS стилей шаблона

Стили оформления CSS

CSS стили оформления размещаются в /phpshop/templates/имя_шаблона/style.css. Цветовые темы стилей размещаются в /phpshop/templates/имя_шаблона/css/ в файлах формата bootstrap-theme-цвет.css.

Создание нового шаблона

Редактировать файлы шаблонов *.tpl можно в любом текстовом редакторе, поддерживающий разметку HTML. Для создания собственного шаблона под именем "my_template" нужно проделать следующие шаги:

  • Берем за исходный шаблон с именем "bootstrap", расположенный в папке /phpshop/templates/bootstrap
  • Копируем его в ту же папку /phpshop/templates/, но под именем /phpshop/templates/my_template
  • В панели управления Настройки - Основные выбираем шаблон с именем "my_template"
  • Основные файлы, которые нужно править:
    • /phpshop/templates/my_template/index.tpl - вид первой страницы сайта (имя_сайта/)
    • /phpshop/templates/my_template/shop.tpl - вид всех остальных страниц (имя_сайта/shop/, имя_сайта/news/ и т.д.)
  • Исходя из собственного дизайна, вносим изменения в верстку страницы /phpshop/templates/my_template/index.tpl. Список переменных, которыми можно управлять дает нам возможность передвигать блоки вывода информации в любо место, вот основные из них.
  • После внесения изменений нужно нажать клавишу F5 для перезагрузки браузера.
  • Такие же манипуляции проводим с файлом внутренних страниц /phpshop/templates/my_template/shop.tpl
  • Изображения для шаблона хранятся в папке /phpshop/templates/my_template/images
    • /phpshop/templates/my_template/images - персональные изображения для шаблона
    • /phpshop/templates/my_template//phpshop/templates/faqbootstrap/images/shop - изображения для закрытых от редактирования функций.

Путь к изображению должен иметь вид:

img src="/phpshop/templates/faqbootstrap/images/my_pic.jpg" alt="Картинка">

При выводе дизайна, скрипт заменяет адрес imаges/my_pic.jpg на /phpshop/templates/faqbootstrap/images/my_pic.jpg, что делает шаблон независимым от своего имени и расположения. Важно знать, что все вхождения пути imаges будут в дизайне и в скрипте заменены на /phpshop/templates/faqbootstrap/images/. Особенно это правило нужно учитывать при создании раздела "Полезные ссылки", где прописываются коды кнопок-ссылок.

Имена изображений должны носить латинское название и не содержать пробелов:

  • картинка.jpg - не правильно
  • my img.jpg - не правильно
  • my_img.jpg - верно

Редактор шаблонов

Для редактирования дизайна из панели управления используется функция редактора в меню Настройки - Шаблоны дизайна. Он позволяет быстро находить нужный шаблон и подсвечивать переменные, доступные в нем. Для ознакомления со всеми возможностями редактора шаблонов следует запустить режим Обучение в выпадающем меню . Для перехода в продвинутый режим правки шаблонов с возможностью отображения реальных имен файлов служит опция "Расширенный режим".

Редактор шаблонов

Отладка шаблона

Для перехода в режим отладки шаблона следует в режиме правки шаблона кликнуть по одноименной кнопке. Режим отладки поддерживает шаблоны diggi, astero и spice. В режиме отладки подсвечиваются пунктирной линией участки кода, сформированные шаблонизатором. При наведении мышкой на такой элемент появляется подсказка Показать [Ctrl + ↵] с возможностью перехода в нужный файл шаблона по сочетанию клавиш Ctrl и Ввод, или Ctrl и клик мышкой. Переход происходит во внутренний редактор шаблонов в панели управления. Отладка позволяет быстро найти нужный шаблон и отредактировать его.

Редактор шаблонов

Схема шаблона

Интерактивная схема шаблона доступна в разделе Настройки - Шаблоны дизайна - Имя шаблона.

и предназначена для быстрого визуального восприятия шаблона и возможности быстро найти нужный элемент в нем. При наведении на каждый элемент показывается подсказка с описанием функции и ссылкой на редактирование файла в html редакторе.

Редактор шаблонов

PHP код

Поддерживается использование нативного php кода между тегами @php ..... php@, пример:

@php 
if(isset($_GET['v'])) 
  echo "Выбраны характеристики";
php@

Существует список разрешенных php-функций и условных выражений для использований в шаблонизаторе для предотвращения внедрения вируса на сайт. Доступные функции:

if
else
switch
for
foreach
echo
print
print_r
array
isset
empty
chr
str_replace
empty

Добавить новые функции можно через общий конфигурационный файл /phpshop/inc/config.ini секция [function]:

[function]
guard = "true";
allowed = "leftCatal,isset,getElementById,empty,UserLogOut,exit,set,get";
deny = "include,include_once,require,require_once,file,chmod"; 

Защитник кода отключается параметром guard = "false"

Для использования переменных шаблонизатора @переменная@ в тегах @php .. php@ применяется глобальный массив $GLOBALS['SysValue']['other'][переменная] или PHPShopParser::get('переменная').

© PHPShop™, 2004-2018г. Все права защищены.
Тел: +7-495-989-11-15 (многоканал.), пн - пт, 10.00 - 18.00