Как устроен интерфейс Setka Post Editor?

Интерфейс Setka Post Editor состоит из нескольких элементов:

1. Поле редактирования поста — здесь вы работаете с контентом статьи. Setka Editor — WYSIWYG-редактор, то есть оформление контента в режиме редактирования будет в точности такое, как и в просмотре поста;

2. Панель инструментов сверху — позволяет форматировать различные элементы поста: абзацы, выделенный текст, изображения, сетки, эмбеды и т.д;

3. Горизонтальная панель инструментов состоящая из вкладок — подразделов на панели инструментов сверху: 

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

4. Контекстное меню, которое открывается по правому клику мыши. Оно позволяет управлять абзацами и копировать элементы поста.

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

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

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

Служба поддержки Setka Editor ответит вам через чат Intercom.

Настройка ширины рабочего поля редактора

На сайте, куда интегрируется Setka Editor, на странице просмотра поста, есть определенная ширина поста, иногда есть несколько вариантов (“широкий” и “узкий” пост, например).

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

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

Полноэкранный режим работы в Setka Editor

Если в административной части вашего сайта, куда встроен редактор Setka Editor, слишком узкое поле для самом инструмента редактора (например, много других служебных панелей и меню), вы можете открыть Setka Editor в полноэкранном режиме. Для этого необходимо нажать на иконку в правом верхнем углу редактора:

Особенность работы с текстом в Setka Post Editor

В Setka Post Editor текст разбивается по абзацам, так что вы работаете не с произвольным отрывком текста, а с параграфом (Paragraph).

Каждый абзац — отдельный элемент поста. Стили применяются к абзацу, чтобы отформатировать несколько абзацев одновременной, нужно кликнуть на них курсором, зажимая Cmd (для Mac OS) или Ctrl (для Windows). 

Шорткат Shift + Enter создает новую строку в том же абзаце. Это может быть удобнее, когда вы печатаете статью прямо в редакторе.

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

Если вы находитесь внутри сетки, то по нажатию на Cmd (для Mac OS) или Ctrl (для Windows)+ Enter, создастся пустой параграф после этой сетки, а по нажатию Cmd/Ctrl + Alt + Enter, создастся параграф до этой сетки

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

С помощью Alt + Enter можно добавить пустые параграфы внутри сетки, не выходя за её пределы.

Как выглядит предпросмотр поста на разных устройствах?

Нажмите на меню справа кнопку Preview post или шорткат Tab и вы увидите, как выглядит пост на десктопе и на мобильном устройстве. Чтобы выйти из режима предпросмотра, нажмите на крест в правом верхнем углу или на клавишу Esc / Tab.

Горячие клавиши

Если что-то нужно быстро сделать (перейти на следующий абзац, выделить несколько абзацев), вы можете воспользоваться контекстным меню (правая кнопка) или шорткатами. Полный список шорткатов доступен, если нажать ссылку «Горячие клавиши» в меню, открывающемуся по клику на знак (?) в правой панели инструментов.

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

Добавление контента в первый раз

Вы можете либо скопировать и вставить весь текст в область редактирования Setka Editor. Либо добавлять и редактировать содержимое абзац за абзацем или раздел за разделом.

Видеоурок по копированию и вставке содержимого из исходного документа.

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