Template cms: CMS Website Templates | ThemeForest

Содержание

Обзор шаблонов

Последнее обновление:

Шаблоны определяют макет ваших страниц, электронных писем и тем HubSpot. Шаблон состоит из модулей и частей и может ссылаться на другие активы, такие как таблицы стилей и файлы JavaScript. Шаблоны можно создавать либо с помощью интерфейса командной строки HubSpot, либо в менеджере дизайна HubSpot. Для создателей контента шаблон — это первое, что они выбирают при создании страницы или электронного письма.

Ниже вы узнаете, как создать шаблон, о различных типах шаблонов и о том, что включено в ваши шаблоны.

Создать шаблон

Шаблон можно создать либо в HubSpot, либо с помощью интерфейса командной строки.

  • Чтобы создать шаблон с помощью интерфейса командной строки, выполните следующую команду:

hs создать шаблон <имя> [назначение]

hs создать параметры шаблона
Параметр Описание

имя

Название шаблона

назнач.

Путь к локальному каталогу, в котором вы хотите создать шаблон. Если он не указан, шаблон будет создан в каталоге, в котором вы сейчас находитесь. тип шаблона, который вы хотите создать, а затем нажмите Enter.

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

Предварительный просмотр шаблона

После обновления шаблона вы можете просмотреть его, чтобы убедиться, что он выглядит и работает так, как вы ожидаете. В HubSpot есть несколько способов предварительного просмотра шаблона, например:

  • Предварительный просмотр шаблона в менеджере дизайна: лучше всего подходит для быстрой визуальной проверки или при необходимости предварительного просмотра сообщения в блоге/листинга/комбинированного шаблона.
  • Создание нового актива из шаблона: лучше всего подходит для тестирования редактора перетаскивания и создания контента.

Предварительный просмотр с помощью менеджера дизайна

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

Для предварительного просмотра шаблона в менеджере дизайна:

  • В своей учетной записи HubSpot перейдите к Маркетинг > Файлы и шаблоны > Инструменты дизайна
  • Используя проводник на левой боковой панели, щелкните значок шаблон , который вы хотите просмотреть.
  • В правом верхнем углу нажмите  Предварительный просмотр .
    • Выберите Предварительный просмотр в реальном времени с параметрами отображения для предварительного просмотра шаблона с параметрами для проверки отклика и параметров домена, таких как таблицы стилей. Этот параметр отображает страницу в iframe. Это также позволяет вам выбирать между блогами и записью в блоге или представлением списка для шаблонов блога.
    • Выберите  Предварительный просмотр без параметров отображения , чтобы просмотреть шаблон без дополнительных параметров.

Предварительный просмотр с новой страницей

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

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

Типы шаблонов

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

Ниже приведены сведения о различных типах шаблонов и аннотаций, которые можно использовать для обозначения каждого типа.

Обратите внимание: создатель контента может поменять шаблон страницы на другой шаблон того же типа, в зависимости от наличия тегов dnd_area.

  • Шаблоны, созданные с помощью визуального редактора компоновки перетаскивания, можно заменить другими шаблонами перетаскивания или закодированными шаблонами с тегами dnd_area или без них.
  • Закодированные шаблоны с тегами dnd_area могут быть заменены только другими закодированными шаблонами с тегами dnd_area .
  • Закодированные шаблоны без тегов dnd_area могут быть заменены только другими закодированными шаблонами без тегов dnd_area .

templateType: page

Шаблоны страниц являются наиболее открытым типом шаблонов. Они могут служить любой разновидностью веб-страницы или целевой страницы. Макеты страниц не содержат предварительно никаких компонентов. Шаблоны закодированных страниц поставляются с предварительно заполненной разреженной разметкой, включая предлагаемые теги HubL для метаинформации, заголовка и необходимых верхних и нижних колонтитулов. Примеры страниц, которые обычно используют шаблон страницы, включают, но не ограничиваются:

  • Домашняя страница
  • О нас
  • Контакт

templateType: электронная почта

Шаблоны электронной почты используются инструментом электронной почты. К ним предъявляется наиболее строгий набор требований, поскольку их необходимо просматривать во многих различных почтовых клиентах, и они должны соответствовать передовым практикам для обеспечения надлежащей доставки. Как HTML + HubL, так и шаблоны электронной почты с перетаскиванием менеджера дизайна предварительно заполняются базовыми компонентами при создании. Шаблоны с этим templateType видны только для выбора шаблона при создании электронного письма.

Чтобы оставаться совместимыми с CAN-SPAM, шаблоны электронной почты имеют набор обязательных переменных, которые необходимо включить.

Шаблоны электронной почты также имеют встроенную функциональность для inline-css, добавленную к элементам