Как устроены темы Magento?

Глава 2

[10 ноября 2016 г.]    Российская сборка Magento 2.49.12
Magento 2: модули и услуги
#1 Надежда А
  • Иконка
  • Группа: Администратор
  • Сообщений: 50
  • Регистрация: 12.12.2010

16.01.2011 16:42

Глава 2. Изучение тем Magento

Мы увидели, что Magento на что-то способна, и рассмотрели некоторые существующие темы Magento, в том числе тему по умолчанию, отображаемую после установки. Чтобы начать оформление темы Magento, мы должны посмотреть на то, из чего сделана тема.


Что делает тему Magento?

Magento тема состоит из трех вещей:
1. Файлы XML макета: Они определяют, как планируется конструкция
2. Phtml шаблоны: Это смесь PHP и HTML файлов, которые определяют, как выглядят конкретные элементы (например, корзина) от макета.
3. Скины: Они обеспечивают Cascading Style Sheets (CSS – каскадные таблицы стилей) и изображения, необходимые для создания желаемого вида для вашей оболочки (скина) Magento.


Интерфейсы и темы

Значения терминов темы и интерфейса в Magento Commerce являются контрастными.


Интерфейсы в Magento

Интерфейс в Magento состоит из одной или нескольких тем, которые вместе составляют то, что вы видите в вашем магазине, а также то, как он выглядит в глазах ваших клиентов. Как мы увидим, Magento поддерживает более одной темы, в то время как интерфейс - не обязательно только одна тема.


Темы в Magento

Тема в Magento – это то, что определяет внешний вид магазина. Интерфейсы могут иметь несколько тем, возложенных на них в Magento, что позволяет использовать сезонные изображения в течение определенных периодов, таких как Рождество или День Благодарения (в Америке).
Тема - это то, что содержит макеты, шаблоны и скины, к которым мы придем далее в этой главе.


Регионы в Magento

Для многоязычных магазинов Magento, темы также могут содержать регионы, которые являются переводом копии (или содержания) этого конкретного магазина.


Стандартные и нестандартные темы

Чтобы не путать, существуют также два типа тем: стандартные и нестандартные.


Стандартная тема (тема по умолчанию)

Тема по умолчанию в Magento является основной темой интерфейса. Magento ищет эту тему по умолчанию, и загружает ее в интерфейс интернет-магазина (это та часть, которую видят ваши клиенты).

Тема по умолчанию должна содержать все элементы, с которыми посетитель будет сталкиваться при посещении нашего магазина, такие как корзина, оформление заказа и так далее. Если Ваша тема не использует эти элементы, то вам не нужно включать эти элементы в вашу тему по умолчанию.


Нестандартные темы

Нестандартные темы позволяют создавать сезонные перспективные интернет-магазины, применяя так много или так мало дополнительных элементов дизайна, таких как CSS или изображения, сколько вам необходимо. Нестандартные темы могут быть также использованы для настройки магазина, чтобы:
• Создать другой вид или макет для определенных страниц товара, которые требуют меньше (или больше) информации, чем обычные товары.
• Обеспечить способ отображения новых товаров или даже товаров, которые скоро поступят, не позволяя клиентам добавлять их в свои корзины.
• Настроить некоторые аспекты вашего магазина под требования в конкретных странах, наподобие того, что клиенты ожидают кнопку в другом месте веб-сайта в стране.


Иерархия тем

Т.к. вы можете иметь несколько тем в Magento, существует иерархия тем на месте, так что вы можете предсказать, какие темы будут отображаться по схеме наследования. Тема по умолчанию обеспечивает базу для каждого аспекта вашего Magento магазина, от того, как она выглядит, до того, где вещи отображаются. Последующие темы можно переписать, что тема по умолчанию говорит Magento, и любые элементы, которые не перезаписаны, наследуются от стандартной темы.
Стандартная тема – обычно тема низшего уровня в иерархии Magento. Это означает, что нестандартные темы будут просто переписывать то, с чем стандартная тема обеспечивает Magento.


Скины, макеты и шаблоны

Скины, макеты и шаблоны – это то, что нужно Magento в теме. Каждый из них в некотором роде поможет изменить тему Magento. Изменение скина меняет внешний вид и ощущение вашего магазина, в то время как изменение шаблонов и макетов изменит то, как магазин отображается, и то, что отображается в нем.


Скины

Скины в теме Magento – это то, что «заставляет» тему выглядеть так, как она выглядит.
Скины указывают цвета, шрифты, и некоторые правила расположения, привилегию CSS файлов и изображений. Ваш скин темы Magento может также включать JavaScript файлы для изменения поведения вашего магазина.
Magento скины включают файлы, которые влияют на цветовые схемы вашего магазина и логотипы. Стандартная тема Magento показана на следующем скриншоте:

Прикрепленное изображение: 1.png

С некоторыми довольно значительные изменениями в элементов скина Magento темы наш магазин может быть сделан более похожим на современные темы Magento.

Элементы скина темы Magento предлагают большую гибкость в создании различных визуальных воздействий.


Макеты и блоки

Макет различных видов в Magento, таких как, корзина, страниц информации о товаре и страница товарных результатов, контролирует расположение файлов. Файлы макета Magento написаны в Extensible Markup Language (XML).
Макеты используются также для добавления, удаления и управления элементами в изображениях вашего магазина Magento. Манипулируя макетными файлами, вы можете:
• Включить JavaScript файлы в определенные страницы
• Включить дополнительные CSS файлы
• Удалить содержание блоков, таких как корзина или выноски из отдельных страниц
Для примера смотрите стандартную тему Magento на странице
http://demo.magentocommerce.com
:

Прикрепленное изображение: 2.png

Эта тема опирается на макете из трех колонок, где центральный столбец используется для основного содержания страницы, и два дополнительных столбца используются для дополнительных комментариев. Страница товара использует две колонки, и это изменение достигается путем изменения макетных файлов темы.

Прикрепленное изображение: 3.png

В Magento есть два типа блоков:
1. Content blocks производят код в каждом структурном блоке, и они используют шаблонные файлы Magento для получения соответствующей информации, которая требуется для каждого блока.
2. Structural blocks указывают структуру страницы, например, заголовок, области контента (содержания) и нижние колонтитулы.
Макет использует оба типа блоков, как это делают шаблоны в Magento.


Шаблоны

Как упоминалось ранее, шаблоны Magento определяют, что будет отображаться в каждом блоке содержания в форме содержания блоков. Файлы шаблона построены на Phtml.
PHP в этих файлах шаблонов предназначен исключительно для презентационной логического узла, то есть PHP используется только для создания визуальных изменений вашего магазина в файлах шаблонов. Однако, это не влияет на работу самого магазина, например, расчета стоимости элементов в корзине.
В стандартной теме Magento структурный блок включает в себя элемент вашего магазина, например, корзину, опрос, или основное содержание страницы, которые будут выделены на следующем скриншоте:


Прикрепленное изображение: 4.png

Шаблоны в Magento делятся на два типа. Первый тип - это skeleton templates, которые обеспечивают общую структуру для страницы, например, шаблоны из одной колонки, двух колонок и трех.Второй тип - шаблоны, предоставляющие HTML для контентных блоков для каждой из функций, которые были выделены ранее.
Работая с шаблонами таким образом, Magento дальше отделяет содержание шаблонов из макета магазина, что позволяет легче изменять и шаблон и макет, без необходимости беспокоиться об затронутом другом.


Резюме

В этой главе мы рассмотрели:
  • Определения, используемые в системе Magento, в том числе:
    • Интерфейсы

    • Темы

    • Стандартные темы

    • Нестандартные темы

  • Компоненты темы Magento:
    • Скины - CSS и изображения, необходимые для создания внешнего вида и ощущения темы Magento

    • Макеты, в XML

    • Шаблоны, в Phtml


Теперь мы можем приступить к рассмотрению тем Magento, а также настроек вашего интернет-магазина.

Поделиться темой: