Перейти к содержанию
  1. Кастомизация редактора сообщений

    Панель инструментов (тулбар) редактора в IPS4 полностью настраиваемый - вы можете упорядочивать кнопки в нём, удалять их и устанавливать разрешения для групп, которые получат доступ для использования той или иной кнопки.
    Для управления тулбаром, посетите страницу Кастомизация > Редактор > Тулбары в вашем админцентре. На данной странице вы увидите фальшивый редактор, отображающий вашу текущую конфигурацию кнопок для настольных компьютеров. 
    Панель инструментов редактора
     
    Поддержка адаптивности
    IPS4 имеет адаптивную тему, что означает одна тема корректно работает как на на настольном ПК, так на планшете и телефоне. Естественно, на мониторе настольного ПК вы можете настроить отображение максимального количества кнопок редактирования, а на телефоне только минимальный набор основных кнопок. 
    IPS4 предлагает три конфигурации редактора, которые вы можете самостоятельно изменить, обеспечивая необходимый набор кнопок на каждом типе устройства.
    Большой - настольные ПК. Средний - планшеты и небольшие ПК Маленький - смартфоны Упорядочивание кнопок редактора
    На основном экране отображается фальшивый редактор с настроенными конфигурациями кнопок. В нижней части страницы есть ещё одна панель инструментов, которая отображает доступные кнопки, не использующиеся нигде.
    Перетащите кнопки между этими двумя тулбарами для добавления или удаления их из панелей инструментов. Изменения вступают в силу мгновенно и доступны вашим пользователям.
    Изменение разрешения кнопок
    Для ограничения областей, в которых будет доступна кнопка или ограничения групп пользователей, нажмите на кнопку, которую вы хотите изменить. Вы увидите простую форму:
    Настройка доступов кнопки редактора
     
    По умолчанию, все кнопки доступны для всех групп и в любых областях, но вы можете изменить доступы, как описано выше. Обратите внимание, некоторые кнопки, например полужирный, курсив и подчёркнутый, имеют устаревшие собственные эквиваленты. Удаление кнопок из панели инструментов не исключит использование этих BB кодов от использования в контенте.
    Добавление панелей инструментов и сепараторов
    Вы можете также добавить новые тулбары, если считаете, что один тулбар слишком мал для размещения всех кнопок, и новые сепараторы, чтобы сгруппировать кнопки по типу. Просто нажмите на кнопки, расположенные сверху редактора панели инструментов, чтобы добавить их. Сепараторы могут быть перетянуты так же, как кнопки, как только вы добавили их.
    Отмена изменений в редакторе
    Если вы хотите вернуться к конфигурации, которая идёт по умолчанию после установки IPS4, нажмите кнопку "Восстановить стандартную конфигурацию", расположенную сверху страницы. Это сбросит все изменения на всех размерах редакторов.
     
  2. Знакомство с редактором в IPS4

    Invision Community использует редактор WYSIWYG (что видишь, то и получишь), который позволяет форматировать контент в сообщениях. Сообщения форматируются визуально - больше нет необходимости использовать устаревшие подходы, например BB коды.
    Редактор в IPS это расширенная версия редактора CKEditor, который является лидирующим WYSIWYG веб-редактором. Таким образом, у вас есть доступ к большому количеству плагинов и тем, доступных для CKEditor, и вы можете с лёгкостью их устанавливать для вашего сообщества. Мы рассмотрим эту возможность в других инструкциях.
    В IP.Board 3 вы могли создавать собственные BB коды/Медиа теги. В IPS4 теперь это делается путём создания собственных кнопок в редакторе, которые можно настраивать.
     
  3. Управление смайлами

    Invision Community поставляется с коллекцией собственных смайлов, а начиная с версии 4.1 и выше, они совместимы с экранами retina (то есть версии смайлов с высоким разрешением, которые используются на соответствующих устройствах с высокой плотностью пикселей). Кроме того, можно добавлять новые смайлы, как собственные, так и готовые наборы.
    Смайлы применяются при клике на кнопку смайлов в редакторе и нажатием на иконку смайла, который вы хотите использовать, или путём ввода короткого кода, который налету конвертируется в смайл.
    Управление существующими смайлам
    Для управления смайлами на вашем сайте, посетите страницу Кастомизация > Редактор > Смайлы в вашем админцентре. На данной странице вы увидите список всех установленных на сайте смайлов:
    Набор смайлов в IPS4
     
    Под каждым смайлом расположен его код, который пользователи могут напечатать в редакторе для отображения этого смайла; вы можете изменить код путём редактирования значения и нажатия кнопки enter (сообщения, содержащие устаревший код смайла, продолжат отображать смайл корректно).
    Справа от текстового поля есть HD индикатор, который даёт вам знать, что у смайла есть версия для экранов с высоким разрешением. Пользователи могут не беспокоиться об этом - они будут автоматически видеть HD версии смайлов, если это позволяет их устройство.
    Смайл можно удалить, нажав на X в правом верхнем углу. Однако, удаление смайла удалит его изображение с сервера, соответственно сообщения, в которых был использован данный смайл, будут отображать битое изображение смайла.
    Вы можете изменить порядок смайлов, просто перетаскивая их. Точно таким же образом вы можете перемещать смайлы между наборами.
    И, наконец, вы можете переименовать набор смайлов, нажав на иконку  в заголовке набора смайлов. По умолчанию существует только один набор (под названием Default), но, если вам нужно несколько наборов, вы можете их создать.
    Добавление новых смайлов
    Для добавления новых смайлов на ваш сайт, нажмите на кнопку "Добавить смайлы" вверху страницы. Вы увидите следующее:
    Добавление новых смайлов
     
    Просто перетащите ваши изображения смайлов в поле загрузки. Вы также можете выбрать создание новой группы смайлов или выбрать существующую группу.
     
    После загрузки смайлов и сохранения формы, вы будете перемещены на страницу просмотра смайлов. На основе имён файлов смайлов, будут добавлены их коды вызова, но вы можете изменить из по собственному желанию.
    Смайлы Retina
    Чтобы добавить HD версии ваших смайлов, используйте специальный формат названий. Просто добавьте @2x в конец имени файла, убедившись в том, что остальная часть названия файла соответствует названию обычной версии смайла. Например, если вы загрузили смайл под названием smile.png, его версия для высокочетких версий будет называться smile@2x.png. Программное обеспечение автоматически объединит эти два изображения смайла в одно.
     
  4. Добавление кнопок редактора с помощью плагинов

    Поскольку редактор в IPS4 использует CKEditor, вам доступен полный набор плагинов для установки. Если есть функция редактора, которую вы хотели бы иметь, проверьте репозиторий плагинов и поищите уже готовый доступный плагин.
    В настоящее время поддерживаются плагины, которые только добавляют кнопку в панель инструментов CKEditor. Пожалуйста, не устанавливайте плагины, которые добавляют другие виды функциональных возможностей или которые могут вызвать проблемы с вашим сообществом.
    Установка CKEditor плагина
    Для начала перейдите на страницу Кастомизация > Редактор > Тулбары в вашем админцентре. Нажмите кнопку "Добавить кнопку" и во всплывающем окне выберите вкладку Плагин CKEditor. 
    Устанавливаемый плагин должен быть совместим с версией редактора CKEditor, которая используется на текущей версии Invision Community. Текущая версия вашего IPS4 отображается здесь же - во всплывающем окне, поэтому вы можете проверить совместимость плагина.
    Далее укажите zip файл скачанного вами плагина и сохраните форму. Если плагин установился успешно, вы увидите новую кнопку в тулбаре "Кнопки не в редакторе" снизу страницы. Теперь вы можете перенести его в ваш активный тулбар и управлять его настройками доступа.
    Если плагин не установился
    Случается так, что плагин не может установиться, это происходит потому, что:
    Он не добавляет кнопку
    В настоящее время поддерживаются только плагины, которые добавляют кнопки в редактор, другие виды плагинов не поддерживаются редактором IPS4. Он не поддерживает установленную версию CKEditor
    Убедитесь, что плагин, который вы устанавливаете, совместим с версией вашего редактора CKEditor. Директория редактора CKEditor не имеет разрешения на запись
    Директория /applications/core/interface/ckeditor/ckeditor/plugins должна быть доступна для записи (CHMOD 777) для возможности установки в неё плагинов.
  5. Добавление собственной кнопки в редактор

    Если существующий CKEditor плагин не доступен, который вам необходим, другой вариант, который может быть подходящим для вас, это создание собственной кнопки.
    Что могут делать пользовательские кнопки?
    Пользовательские кнопки позволяют вам создавать HTML блоки, вставляемые при нажатии на кнопку на панели инструментов редактора. Блоки, которые вы создали, могут принимать контент от пользователей.
    Пользовательские кнопки не имею полноценных возможностей плагина CKEditor - они не могут быть динамическими или использовать Яваскрипт, например. Но для форматирования текста, полученного от пользователя, пользовательская кнопка является лучшим выбором.
    Хотя пользовательские кнопки, как правило, довольно просты, мы рекомендуем создавать их только, если у вас есть минимальные знания HTML, иначе обратитесь за помощью на наш форум.
    Создание пользовательской кнопки
    Для создания пользовательской кнопки, перейдите на страницу Кастомизация > Редактор > Тулбары. Нажмите на "Добавить кнопку" в верхней части страницы и выберите вкладку "Пользовательский". Показанная форма будет иметь следующие поля:
    Заголовок
    Всплывающее название кнопки, когда пользователь наводит курсор мыши на кнопку в редакторе. Иконка
    Небольшой графический файл, который будет выступать в качестве иконки кнопки в редакторе. Для поддержки экранов retina, загрузите иконку, бОльшую по размеру в два раза; она будет уменьшена в браузере и показана в высоком разрешении. Тип
    Поддерживается три типа контента, и они грубо имитируют три типа отображения элементов в HTML: Линейный - используется, когда HTML вставляется куда-то в строку текста. Не создает новую линию для содержания. Однолинейный блок - предназначен для отдельных строк (например заголовков), и размещает блок на новой строке. Блок - используется для нескольких строк, и ставит блок на новой линии. Использовать опцию?
    Пользовательская кнопка может дополнительно принимать значение от пользователя. Эта опция появится в виде всплывающего диалогового окна при клике пользователя на кнопку в редакторе, и введённое пользователем значение передаётся в блок. При включении этой настройки, вы увидите дополнительные настройки: Метка опции
    Текст показывается пользователю, запрашивающему значение параметра. HTML
    фактический HTML код, который вставит кнопка при использовании в редакторе. Как правило, поддерживается любой HTML код, но он должен быть валидным. В этом HTML коде могут быть использованы специальные теги: {option}
    Если этот параметр используется, этот тег будет заменён введённым пользователем значением, как есть. {content}
    Если ваша кнопка позволяет пользователям вводить свой контент в HTML блок, вставьте этот тег, куда пользователь сможет печатать. Нажмите кнопку Сохранить для создания кнопки. Ваша иконка будет отображена в тулбаре "Кнопки не в редакторе", и отсюда вы можете переместить её в рабочий тулбар.
    Использование пользовательских стилей
    Мы не рекомендуем использовать встроенные в ваш HTML код стили, т.к. в дальнейшем вы не сможете их обновить (сообщения построены таким образом, что при обновлении пользовательской кнопки, сообщения с устаревшей кнопкой не применят внесённые вами изменения).
    Вместо этого предлагается использовать имена классов, и добавить стили для них в ваш файл custom.css. Таким способом вы сможете в дальнейшем изменить свои стили, и все сообщения применят эти изменения.
    Пример кнопки
    Как вы могли заметить, в разделе документации мы используем специальные блоки, на которые необходимо обратить особое внимание, например:
    Это простой пример блока
    Это пользовательская кнопка редактора, которая доступна только для модераторов. Вот какие настройки необходимо использовать для создания этой кнопки:
    Заголовок - Заметка Иконка -  Тип - блок Использовать опцию? - нет HTML: <div class='note'> {content} </div> Далее добавим пользовательские стили для кнопки в наш custom.css:
    .note { padding: 24px 30px 24px 122px; margin: 23px 0 23px -20px; background: #f6f6f6; font-size: 16px; color: #222; position: relative; } .note:before { content: "\f06a"; display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: 63px; left: 40px; top: 7px; position: absolute; color: #929292; }  
  6. Настройки редактора

    Несколько глобальных настроек редактора доступны для вас (как для администратора) для настройки вашего сообщества. Чтобы их изменить, откройте страницу Кастомизация > Редактор > Настройки в вашем админцентре.
    Основное
    Режим вставки
    По умолчанию, в 4.1 и выше, когда пользователь вставляет в редактор форматированный контент (то есть, контент скопирован откуда-то ещё, и содержит HTML форматирование, например жирный, подчёркивание и т.д.), в редакторе появляется бар с предложением сохранить форматирование или вставить как обычный текст:
    Вставка в редактор IPS4 форматированного контента
     
    Некоторые администраторы предпочитают, чтобы публиковался только не форматированный контент, и настройка "Режим вставки" позволяет вам контролировать это. 
    Поведение клавиши возврата
    По умолчанию, когда пользователь нажимает клавишу возврата, начинается новый параграф (появляется некоторый отступ между новой стройкой и строкой выше). Тем не менее, некоторые администраторы предпочитают при нажатии кнопки возврата не прерывать параграф, а делать простой разрыв строки (как это было в IP.Board 3). За это отвечает настройка Поведение клавиши возврата.
    Дополнительно
    Когда отправляется сообщение, парсер сообщений удаляет некоторые HTML теги, атрибуты и значения, которые могут быть потенциально нежелательными в целях безопасности или визуализации. Тем не менее, в некоторых случаях, вы можете захотеть изменить это поведение и допустить определённые значения. Вкладка Дополнительно позволяет добавлять вам исключения для:
    Имён CSS классов
    По умолчанию другие, в отличие от "известных" CSS классов, которые IPS4 использует в цитатах, имена классов в сообщениях вырезаются. Если вы хотите сохранить определённые имена классов для плагинов редактора или кнопок, вы можете указать их здесь.
    Javascript контроллеров
    Атрибут "data-controller" имеет специальное значение, поэтому любое значение будет удалено. Здесь вы можете добавить исключения для контроллеров.
    Допустимые iframe основы
    По умолчанию, фреймы (тег iframe) вырезаются из сообщений. Однако, если вы хотите разрешить их, вы можете добавить URL ссылки здесь. Если URL фрейма соответствует одному из списка, он будет допустим парсером
     
×
×
  • Создать...

Важная информация

Используя наш сайт вы соглашаетесь с нашей Политикой конфиденциальности