Загрузка...Руководство Дизайнера
По умолчанию CMS Presta Shop поставляется с нейтральной темой в серых тонах, позволяющая продавцам быстро и бесплатно начать торговать, независимо от их бизнеса.
Почти 1000 шаблонов доступны через рынок PrestaShop Addons. Они были созданы либо членами сообщества PrestaShop, либо командой PrestaShop и продаются по разумным ценам, иногда даже бесплатно.
Если Вы вебдизайнер или вебмастер вы тоже можете разместить свои темы для продажи на сайте Presta Shop Addons и заработать 70% от стоимости шаблона.
Любой человек с некоторым знаниями CSS и умением делать хорошую графику может настроить шаблон под себя. Зная PHP, вы можете построить новую тему для вашего магазина или для продажи. Благодаря продуманной системе, которая использует механизм шаблонов Smarty*, любой магазин можно быстро настроить с учётом Ваших потребностей.
Основы разработки шаблонов
Концепт
Тематическая система Presta Shop основана на механизме шаблонов, называемом Smarty, который позволяет веб-дизайнерам и программистам легко разработать свои собственные темы, располагая небольшими техническими знаниями.
Все веб-дизайнеры и программисты должны использовать следующие расширения браузера для программистов(разработчиков):
- -Firefox: установить Firebug … бесплатное расширение между вашим CSS и результатом.
- -Firefox/Chrome: бесплатное расширение добавляет много полезых инструметов веб-разработки для вашего браузера.
- -Safari 5+: использовать веб-инспектор….
- -Chrome: использовать средства разработчика…
- -Opera 9.5+: использовать Dragonfly, полнофункциональную среду оладки…
- -Internet Explorer8+: использовать средства разработчика…
- -Internet Explorer6 и 7: установить Панель инструментов разработчика IE…
- Они предоставляют множество полезных инструментов, среди которых Dom Explorer, редактор CSS, сетевой инспектор и т.д. и оказывают большую помощь при наладке HTML, CSS, Java Script и даже запросы Ajax.
Техническая структура Presta Shop
Presta Shop основан на 3-х уровневой структуре:
- Уровень (объекты) данных. Доступ к базе данных контролируется с помощью файлов в папке классов /classes.
- Уровень приложений (управление данными). Контент, создавамый пользователями, контролируется файлами из базовой папки.
- Представительский уровень (дизайн). Все тематические файлы находятся в тематической папке /themes.
Смотри Wikipedia для получения дополнительной информации.
Этот же принцип, как структура, Model-View-Controller (MVC), только в более простой и доступной форме.
Узнайте больше о MVC в Wikipedia.
Наша команда разработчиков решила не использовать рамки PHP такие, как Zend Framework, Symphony or Cake PHP для лучшего прочтения и, таким образом, быстрейшего редактированиия.
Это также влияет на лучшее выполнение, так как программное обеспечение создано только из требуемых строк кода и не содержит множество дополнительных общих библиотек.
3-х уровневая архитектура имеет множество преимуществ:
Код программного обеспечения легче читается.
Разработчики могут добавлять и редактировать код быстрее.
Графический редактор и HTML интеграторы могут работать в пределах тематических папок без необходимости понимать или даже читать строку PHP кода.
Разработчики могут работать на дополнительных данных и модулях, которые интеграторы HTML могут использовать.
МОДЕЛЬ
Модель представляет поведение приложения: обработка данных, взаимодействие базы данных и т.д.
Она описывает или содержит данные, которые были обработаны приложением.
Она управляет этими данными и гарантирует их целостность.
Представление
Представление это интерфейс, с которым взаимодействует пользователь. Его первая роль заключается в отображении данных, предоставленных моделью. Вторая роль заключается в управлении всеми действиями пользователями (клик мышкой, выбор элементов, клавиши и т.д.) и в отправке этих действий контроллеру. Вид не обрабатывает никакие данные, он лишь отображает результаты обработки, выполненной Моделью и взаимодействует с пользователем.
Контроллер
Контроллер управляет синхронизацией действий между Моделью и Видом и обновляет их в соответствии с необходимостью. Он получает действия пользователя и запускает механизм их выполнения. Если данные нуждаются в изменении, Контроллер «просит» об этом Модель, а в свою очередь Модель уведомляет Вид о том, что данные изменены с тем , чтобы Вид мог сам себя обновлять.
Общее представление и информация
Лучшие правила
Вот неполный перечень правил, которым вы должны следовать при создании темы.
Не смешивайте HTML и PHP код; используйте Smarty теги, чтобы получить динамическую страницу.
Не смешивайте HTML И PHP код; поместите код CSS в отдельном CSS-file.
Всегда подтверждайте ваш HTML и PHP код, используя W3C подтверждение…
Не делайте запросы SQL от Контроллера PHP ( файл PHP в основе PrestaShop); используйте существующие методы классов PrestaShop или создайте новые методы для эти классов.
Всегда проверяйте, существует ли уже необходимый вам метод в доступных классах.
Никогда не редактируйте собственные файлы PrestaShop; всегда стройте свой код в модулях для облегчения обновлений.
Убедитесь в том, что создаваемый код чёткий и читаемый, и легко поддерживается для любого пользователя на обозримое будущее.
Комментируйте свой код и пишите название метода и комментарии на понятном английском языке.
При редактировании темы на созданном сайте сначала всегда помещайте магазин в режиме поддержки через предпочтительную страницу бэк-офиса «Maintenance».
Используйте современные браузеры, такие как … (и убедитесь, что ваши друзья и члены вашей семьи также).
Когда возможно, используйте CSS спрайт…
Как работает тема
Шаблон PrestaShop представляет собой набор файлов, которые вы можете редактировать в целях изменения внешнего вида вашего интернет-магазина.
Вот несколько важных особенностей:
Все темы имеют свои файлы, расположенные в тематической базовой (основной) папке.
Каждая тема имеет свою под-папку в основной тематической папке.
Каждая тема создана из файлов шаблонов … , файлов изображений…, одного или более CSS файлов… и даже иногда Java Script файлов…
Каждая тема имеет в папке 180-200 файлов изображений preview.jpg, позволяя владельцу магазина видеть, что собой представляет тема прямо из бэк-офиса и, соответственно, выбрать тему.
Папки специфических тем
В основном существует 5 папок Presta Shop, о которых вы, как разработчик тем, должны знать:
/модуль: папка, в которой расположены все модули. Модуль имеет файлы шаблонов, а также может переустанавливать части темы.
/темы: папка, в которой находятся все темы. По умолчанию 1.5 тема находится в папке «по умолчанию»…
/почта: папка, в которой находятся все шаблоны электронной почты. Шаблоны электронной почты должны идеально отражать стиль и дизайн главной темы. Каждая под-папка содержит шаблоны
Конкретного (специфического) языка.
/imj.: папка, в которой находятся все изображения магазина. Изображения конкретных тем хранятся в собственной imj. папке темы.
/pdf.: папка, в которой находятся все модели документов.
Обзор тематической папки
Вот обзор структуры файла темы Presta Shop (here, the default one):
Папка CSS содержит все файлы CSS.
Папка img содержит все изображения.
Папка js содержит все файлы Java Script.
Папка lang содержит темы переводов. Её права доступа должны быть установлены на CHMOD666 (например) так, чтобы инструмент перевода бэк-офиса мог читать и писать в ней.
Основа папки содержит только файлы TPL (файлы Smarty), также, как preview.jpg файл.
Значок
Папки… не являются обязательными, тема может прекрасно работать и без них. От вас зависит, создавать ли их.
*Обязательно загляните в раздел smarty прежде чем вносить правки в тему
Коментарии0 новых