Перейти к основному содержимому

Использование редактора страниц

Редактор страниц B1 — это визуальный конструктор с перетаскиванием, который позволяет разрабатывать страницы вашего церковного сайта без написания какого-либо кода. Вы можете добавлять разделы и блоки содержимого, настраивать стили, просматривать свою работу и отменять изменения — все прямо в браузере.

Прежде чем начать

Открытие редактора

  1. В B1 Admin нажмите Сайт в левом меню.
  2. Найдите нужную страницу в таблице страниц и нажмите Редактировать.

Редактор открывается в полноэкранном режиме. Левая панель показывает структуру вашей страницы и доступные элементы содержимого; центральная область показывает живой предпросмотр вашей страницы.

Информация

Редактор всегда отображается в светлом режиме, независимо от настроек темы B1 Admin. Это гарантирует, что предпросмотр точно соответствует тому, как страница будет выглядеть для посетителей сайта.

Структура страницы: разделы и элементы

Каждая страница строится из двух уровней:

  • Разделы — Контейнеры верхнего уровня, которые делят вашу страницу на горизонтальные полосы (например, героический блок, блок с содержимым или полоса подвала). У каждой страницы должен быть хотя бы один раздел, прежде чем можно будет добавлять содержимое.
  • Элементы — Отдельные единицы содержимого, размещенные внутри раздела, такие как текст, изображения, кнопки, карточки, формы и календари.

Добавление раздела

  1. Нажмите Добавить раздел (или кнопку + вверху левой панели).
  2. Выберите способ начала:
    • Из шаблона — просмотрите галерею шаблонов разделов, организованную по категориям (Герой, О нас, Служения, Пожертвования и т. д.), и нажмите на один из них, чтобы вставить его в виде полностью оформленного, уже заполненного раздела. Вы можете настроить все после его добавления.
    • Пустой раздел — выберите макет колонок (одна, две, три колонки и т. д.) и стройте с нуля.
  3. Новый раздел появляется в предпросмотре. Нажмите на него, чтобы выбрать и настроить цвет фона, отступы и другие параметры стиля.

Изменение макета раздела

Уже построили раздел, но хотите другую структуру? Используйте переключатель макета этого раздела, чтобы заменить расположение колонок на другое из галереи, сохранив при этом существующее содержимое и элементы.

Добавление элементов в раздел

  1. Нажмите внутри раздела в предпросмотре, чтобы выбрать его.
  2. Нажмите Добавить содержимое и выберите тип элемента из списка:
    • Текст — Заголовки, абзацы и форматированный текст
    • Изображение — Загрузка или ссылка на фото
    • Кнопка — Кликабельная ссылка призыва к действию
    • Карточка — Изображение с заголовком и описанием
    • Форма — Встраивание формы прямо на странице
    • Календарь — Отображение календаря мероприятий
    • FAQ — Блоки вопросов и ответов в стиле аккордеона
    • Видео — Встраивание видео по URL
    • Обозреватель групп — Фильтруемый каталог всех церковных групп с возможным поиском, фильтром по категориям и фильтром по меткам
    • Иконка-функция — Значок с заголовком и кратким описанием для выделения особенностей или служений
    • Галерея — Многофотографическая сетка или мозаичный макет
    • Отзыв — Одна или несколько цитат с именем автора, ролью и фото
    • Значки соцсетей — Связанные значки для профилей вашей церкви в соцсетях
    • Обратный отсчет — Таймер обратного отсчета до даты или еженедельного времени служения
    • Статистика — Ряд крупных чисел с подписями (участники, годы, кампусы)
    • Прогресс кампании — Живой индикатор прогресса кампании пожертвований, показывающий общую собранную сумму относительно цели фонда
    • Сетка сотрудников — Карточки с фото участников группы; у группы должна быть включена опция публичный список
    • Времена служений — Расписание служений ваших кампусов, автоматически подтягиваемое из настроек посещаемости
    • Проповеди — Ваша библиотека проповедей в виде полного обозревателя или сетки, списка либо макета «последняя проповедь»
    • Карта — Встроенная карта с центром по адресу вашей церкви
    • Таблица — Простая сетка строк и столбцов для табличного содержимого
    • Текст с фото — Текст и изображение рядом друг с другом
    • Логотип — Логотип вашей церкви, подтягиваемый из Внешнего вида
    • Прямая трансляция — Плеер прямой трансляции, встроенный прямо на странице
    • Пожертвование — Кнопка пожертвования или встроенная форма пожертвования
    • Необработанный HTML — Пользовательская HTML-разметка для расширенных сценариев использования
    • iFrame — Встраивание внешнего содержимого по URL
  3. Настройте элемент с помощью появившейся панели настроек.

Изменение порядка содержимого

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

Оформление вашей страницы

Стили разделов

Нажмите на любой раздел, чтобы открыть его панель стиля. Вы можете задать:

  • Фон — Сплошной цвет, градиент или изображение. При использовании изображения в качестве фона выбор Фокусной точки позволяет щелкнуть, чтобы задать, какая часть изображения остается по центру при масштабировании раздела, а опция цвета Наложения позволяет добавить полупрозрачный оттенок поверх изображения для улучшения читаемости текста.
  • Отступы — Отступы сверху и снизу внутри раздела
  • Ширина — На всю ширину или по центру/ограниченная
  • Разделители — Декоративные фигурные разделители (волна, наклон, изгиб, треугольник и другие) на верхнем или нижнем крае раздела с настройками цвета, высоты и отражения

Стили элементов

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

Пользовательский CSS

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

Совет

Если вам нужно применить стили ко всему сайту — например, пользовательский шрифт или глобальный цвет, — используйте настройки Внешнего вида вместо пользовательского CSS на отдельных страницах.

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

Используйте элементы управления предпросмотром на панели инструментов, чтобы проверить, как выглядит страница при разных размерах экрана:

  • Настольный компьютер — Полноширинный вид в браузере
  • Мобильный — Узкий вид размером с телефон

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

Проверка доступности

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

Отмена изменений

Редактор автоматически отслеживает историю ваших изменений. Используйте кнопки на панели инструментов или сочетания клавиш для навигации:

  • Отменить (Ctrl+Z / Cmd+Z) — Отменить последнее действие
  • Повторить (Ctrl+Y / Cmd+Y) — Повторно применить отмененное действие

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

Предупреждение

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

Сохранение и публикация

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

Черновое и опубликованное состояние

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

  • Публикуется сразу при сохранении — Страница не использует рабочий процесс публикации. Каждое сохраненное изменение сразу становится видимым. Это значение по умолчанию для новых страниц.
  • Неопубликованные изменения — Страница уже была опубликована ранее, но вы внесли изменения после последней публикации. Посетители по-прежнему видят ранее опубликованную версию.
  • Опубликовано — Страница активна, и ваше сохраненное содержимое совпадает с тем, что видят посетители.

Чтобы опубликовать изменения, нажмите кнопку Опубликовать на панели инструментов. Страница становится активной немедленно.

Чтобы вернуться к последней опубликованной версии, не влияя на то, что видят посетители, откройте дополнительное меню (⋮) и нажмите Отменить изменения.

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

Совет

Используйте рабочий процесс черновик/публикация, когда хотите подготовить страницу — например, для предстоящего мероприятия — и сделать ее активной только в нужный момент. Постройте и просмотрите страницу, затем нажмите «Опубликовать», когда будете готовы.

Похожие статьи

  • Управление страницами — Создание страниц, настройка URL и управление навигацией сайта
  • Внешний вид — Настройка общесайтовых цветов, шрифтов и брендинга
  • Файлы — Загрузка изображений и документов для использования в редакторе
  • Создание форм — Создание форм, которые можно встраивать на страницы