Как создать новый макет страницы в Weebly?

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

Типы заголовков по умолчанию в Weebly

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

  • Целевая страница
  • Страница высокого заголовка
  • Страница короткого заголовка
  • Без заголовка
  • Титульный лист
  • Страница-заставка

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

Создание нового типа заголовка

Давайте рассмотрим пример – вы хотите создать пустую страницу, чтобы вы могли добавлять свой контент с помощью элементов перетаскивания. Перейдите к «Дизайн> Редактировать HTML / CSS> Тип заголовка» и щелкните значок +, чтобы создать «Новый тип заголовка».

Создание нового типа заголовка в Weebly

Назовите страницу, как вам нужно, с расширением .html и сохраните тему. Теперь, когда ваш макет страницы создан, вы можете увидеть его при создании новой страницы на вкладке «Страницы».

Выбор типа заголовка в Weebly

Выбор типа заголовка в Weebly

Добавление содержимого в новый тип заголовка

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

<!DOCTYPE html>
<html>
<head>
</head>
<body>
{title}
{menu}
{content}
{footer}
</body>
</html>
Создать тип заголовка в Weebly

Создать тип заголовка в Weebly

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

{название-области: текст} Заполнитель для текста
{area-name: content} Заполнитель для всех типов элементов контента
{название-области: изображение} Заполнитель для изображения

Новый макет страницы требуется только в том случае, если вы не хотите нарушать макеты страниц по умолчанию и в то же время хотите добавить дополнительные функции. Например, макет целевой страницы по умолчанию предлагает кнопку с призывом к действию. Скажем, если вы хотите иметь два типа целевых страниц: с кнопкой и без кнопки. В этом сценарии единственный способ – скопировать весь файл landingpage.html в новый тип заголовка «landingpage-no-button.html» и удалить только код кнопки призыва к действию из нового типа заголовка. Таким образом, вы можете выбрать любой макет страницы с кнопкой или без кнопки на вкладке «Страницы».

Лучший и легкий способ

Лучший и простой способ создать новый тип заголовка – скопировать все содержимое HTML из одного из типов заголовков по умолчанию, а затем изменить код в соответствии с вашими потребностями. Это обеспечит сохранение многих вещей, таких как навигация сайта, отзывчивость, мобильные меню и т. Д., И добавление или изменение только необходимых элементов.

Если вы намереваетесь изменить существующий стиль элемента на всем сайте, нет необходимости создавать новый макет страницы. Например, вам нравится тема A, и вы хотели изменить только стиль элемента цитаты блока в соответствии с темой B. в этом случае просто замените стиль элемента цитаты блока в теме A кодом из темы B в main_style.css.

Похожие записи

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *