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

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

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

Перед началом

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

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

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

Информация

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

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

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

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

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

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

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

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

Переупорядочение содержимого​

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

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

Стили раздела​

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

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

Стили элемента​

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

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

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

Совет

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

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

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

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

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

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

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

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

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

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

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

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

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

Состояние черновика и опубликовано​

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

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

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

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

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

Совет

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

Связанные статьи​

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