Редактор предназначен для удобного и быстрого форматирования контента на страницах, в карточках товаров и в описаниях категорий.
Панель форматирования - нужна для оформления текста, не прибегая к использованию html-коду (но при необходимости такая возможность в редакторе доступна).
Окно для редактирования - здесь располагается контент - текст и картинки. Здесь же можно видеть все изменения, которые были сделаны при помощи панели форматирования.
Кнопка увеличения окна редактирвования - нажмите на неё и потяните мышь, чтобы увеличить размеры окна.
Важно: чтобы применить форматирование к определенному фрагменту контента - сначала выделите его мышью. Это касается и текстов, и картинок. Если нужно ввести текст сразу с определенным форматированием - сначала выберите нужное форматирование в панели, а затем вводите текст.
При наведении мыши на любой элемент форматировани появляются подсказки на русском языке. Ниже представлены краткие описания результатов работы кнопок редактора.
![]() |
Быстрые кнопки для выделения текста жирным или курсивом. Можно заменить кнопками CTRL+b (жирный), CTRL+i (курсив) |
![]() |
В этом меню расположены расширенные возможности для форматирования текстов. Описания - ниже. |
![]() |
В этом подменю можно задать тексту значения заголовков, соответствующие html-тэгам от <h1> до <h6>. Эти теги важны для продвижения магазина - поисковые роботы учитывают эти теги - <h1> для них означает заголовок всей страницы, <h2> - подзаголовок страницы, <h3> - подзаголовок раздела и так далее, до <h6>. Если в шаблоне магазина этим заголовкам заданы разные начертания (размер, цвет, гарнитура шрифта и т.д.) - то после сохранения можно будет увидеть разницу непосредственно на странице, которую редактировали. |
![]() |
Здесь располагается стандартный набор выделений: Полужирный, Курсив, Подчёркнутый, Зачеркнутый, Верхний индекс (X2), Нижний индекс (X2) |
![]() |
Выбор шрифта для текста. Этот выбор может быть расширен, если прописать в шаблоне дополнительные варианты шрифтов. |
![]() |
Здесь можно выбрать нужный размер шрифта, если текущий не подходит. Размер задаётся в пунктах - от 8 до 36. Больше или меньше можно сделать через редактирование html-кода (об этой возможности описано ниже) |
![]() |
Кнопка полностью удаляет всё форматирование, которое применили ранее, или которое применилось, если был вставлен текст из буфера обмена (например из Word или с другого сайта). |
![]() |
Эта кнопка позволяет задать тексту цвет. Можно выбрать из предустановленных вариантов или задать любой произвольный цвет при помощи кнопки "Выбрать.." в этом меню. Также можно удалить любые настройки цвета при помощи кнопки "Без цвета" (кнопка с крестиком). В нижней части панели выбора цвета появляются цвета, которые вы уже использовали при редактировании. Подробнее о работе с цветом рассказывается описано ниже. |
![]() |
Если нужно задать тексту цвет фона, то используйте эту кнопку. Её функции аналогичны функциям кнопки задания цвета, которая описана выше. |
![]() |
Используйте эту кнопку, чтобы задать тексту выравнивание. Возможноые варианты: По левому краю, По правому краю, По центру и По ширине. |
![]() |
Для создания маркированных списков используйте эту кнопку. Расположите каждый пункт будущего списка в столбик через перенос строки, затем выделите все пункты и нажмите на эту кнопку. |
![]() |
Нумерованный список - удобная функция, если нужно перечислить несколько преимуществ товара. |
![]() |
Таблицы - полезный инструмент для форматирования текстов и изображений. |
![]() |
Вставка/удаление ссылки. Можно применять как к тексту, так и к изображениям. При вставке ссылки есть возможность как задать любую произвольную, так и выбрать из имеющихся. |
![]() |
Вставка/редактирование изображений. Можно загружать новые изображения, а также выбирать из имеющихся. |
![]() |
Редактирование HTML-кода. Очень важный и полезный инструмент. Здесь отображатеся контент в виде простого текста с html-тэгами. Рекомендуем изучить основы HTML, чтобы легко и быстро можно было отредактировать контент. |
![]() |
Эти кнопки предназначены для отмены или возврата последних произведённых изменений. Работают также, как в любом редакторе текстов, к которому привыкли - кнопка "Назад" отменяет последнее изменение, вплоть до момента начала редактирования, кнопка "Вперёд" - возвращает отменённое действие. |
![]() |
Это панель выбора цвета. Она одинакова для определения цвета текста и его фона. Здесь можно задать один из предустановленных цветов, один из ранее использованных цветов (поля в нижней части) и удалить (кнопка X) цветовое оформление цвета. Кнопка "Выбрать" служит для задания любого произвольного или определенного при помощи кода цвета. |
![]() |
При нажатии на кнопку "Выбрать" появляется окно для задания произвольного или определенного кодом цвета. Поле слева служит для выбора оттенка, поле в центре - для выбора цвета, поля справа - для задания точных значений в шкале RGB или при помощи HTML кода. |
![]() |
При помощи этого инструмента можно вставить таблицу максимальным размером 10 на 10 ячеек. Если нужно больше 10 ячеек по горизонтали или по вертикали - нужно будет использовать HTML редактор. "Тело" таблицы - это теги <table> Внутри этих тегов располагаются теги строк и ячеек. Строки - это тег <tr>, между ними может располагаться любое количество ячеек. Они обозначаются тегом <td>. Из ячеек формируются столбцы. Скольк ячеек в строке - столько и столбцов. Пример: <table> Пока в таблице нет контента внутри ячеек стоит html код пробела - . Можете заменить его на свой контент. В ячейки таблицы можно вставлять как текст, так и изображения. Для этого просто поместите курсор в нужную ячейку и начните набирать текст или нажмите на кнопку вставки изображения. |
![]() |
Свойства таблицы - общие Здесь можно задать простое форматирование для всей таблицы - ширину, высоту, отступ от внешнего края, отступ от внутреннего края, толщину рамки и общее выравнивание для таблицы - то есть расположение её на странице - по центру, слева или справа.
|
![]() |
Свойства таблицы - расширенные Здесь можно задать при помощи CSS стиль для всей таблицы, цвет рамки и цвет фона, также для всей таблицы. |
![]() |
Свойства ячейки - общие Здесь можно задать основные параметры для каждой ячейки таблицы в отдельности ширину, высоту и выравнивание контента внутри ячейки |
![]() |
Свойства ячейки - расширенные Здесь по аналогии с расширенными свойствами таблицы можно при помощи CSS задать каждой ячейке свой собственный стиль, а также цвет рамки и цвет фона. |
![]() |
Параметры строки - общие Здесь можно задать выравнивание для контента внутри строки, если для конкретных ячеек не задано собственное выравнивание. Также можно задать высоту для всей строки. |
![]() |
Параметры строки - расширенные По аналогии с ячейками здесь задаются CSS стили для строки, а также цвет для её рамки и фона. |
Заголовок ссылки |
При помощи этого инструмента можно задавать тексту и картинкам ссылки. Для этого выделите нужный элемент и нажмите иконку добавления ссылки. Адрес ссылки - сюда можно вставить любой произвольный адрес, ведущий на любую страницу в интернете или на вашем сайте. Скопировать адрес ссылки можно из адресной строки вашего браузера. Отображаемый текст - тот текст, который хотите сделать ссылкой. Если делаете ссылку для картинки, это поле будет недоступно. Заголовок - создаёт для ссылки всплывающую подсказку. Список ссылок - это те ссылки на страницы, которые вы создали на своем сайте, а также на файлы, которые вы закачали в раздел "Файлы". Когда вы выбираете ссылку из списка её адрес подставляется в поле Адрес ссылки. Открывать ссылку - позволяет выбрать, как браузер будет открывать ссылку - в новом окне (вкладке) или в том же. |
![]() |
Вкладка "Общие" Здесь находятся параметры загрузки изображения. Источник - ссылка на файл изображения в интернете. Таким образом можно вставить любую картинку, если знаете её полный адрес. Список изображений - список изображений, которые были загружены в магазин в раздел "Файлы". Загрузить изображение - служит, чтобы можно было загрузить любое изображение с компьютера. Поддерживаются расширения JPG, JPEG, PNG, GIF. Описание изображения - полезная функция, поскольку описание, соответствующее изображению, позволяет находить магазин в поиске по картинкам. Размер - позволяет задать точный размер картинки на странице. Можно задавать его как жёстко, так и с сохранением пропорций, указывая только один параметр - длину или высоту. |
![]() |
Вкладка "Расширенные" Позволяет задать продвинутые настройки для изображения Стиль - это поле предназначено для опытных пользователей. В эту строку можно прописать произвольный или заранее заданный стиль для изображения, например, стиль для открытия картинки в полном размере в модальном окне. Вертикальный и Горизонтальный интервал - позволяет задать отступы картинке, то есть, расстояние, на которое она будет удалена от любых других объектов - других картинок, текстов, таблиц и так далее. Рамка - позволяет задать рамку для изображения. Значение указывает толщину рамки в пикселях. |
![]() |
Вкладка "Альтернативное изображение" Позволяет задать дополнительное изображение, которое будет отображаться при наведении курсора на основное. |