XenForo 2.2: Улучшения в текстовом редакторе и менеджере вложений

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

С самого начала в XenForo использовался расширенный текстовый редактор (RTE), позволяющий посетителям составлять свои сообщения в интерфейсе «what-you-see-is-what-you-get» (WYSIWYG), так что жирный текст выделялся жирным шрифтом, большой текст становился достаточно большим и т. д., вместо того, чтобы работать непосредственно с базовым BB-кодом, чтобы исключить догадки при редактировании сообщения. Мы всегда создавали пользовательскую реализацию поверх того, что мы считаем лучшими в своем классе инструментами, и за время существования XenForo мы уже дважды делали серьезные переходы на совершенно новые библиотеки, переходя с TinyMCE на Redactor, а затем Froala.

С XenForo 2.2 мы сделали еще одно важное изменение в нашей реализации. Мы продолжаем опираться на Froala, но мы улучшили каждый аспект нашей системы.

Мы бы хотели, чтобы Вы прочитали то, что мы изложили здесь, но если вам не хватает времени, то просто посмотрите это видео...

Для просмотра этого контента нам потребуется ваше согласие на установку файлов cookie третьих лиц.
Более подробную информацию можно найти на нашей странице cookie.

Принимать файлы cookie третьих лиц

 

[Hope]

Выглядит лучше
Первое, что Вы заметите, это новый свежий вид. Нам надоели редакторы, которые выглядят как копия Microsoft Word. Это уже не 2002 год, и люди знают, что рядом с областью ввода текста будут элементы управления, которые работают привычным образом.

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

 

[Hope]

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

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

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


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

Теперь элементы управления можно назначить одной из четырёх групп. К каждой группе может быть прикреплено любое количество элементов управления, и они могут независимо определять количество кнопок, видимых перед отображением кнопки «ещё». При нажатии на кнопку «ещё» будет развёрнута дополнительная панель инструментов под основными элементами управления, в которой будут содержаться остальные элементы управления из группы.

 

[Hope]

Удобнее
При первом клике в новом редакторе или при вводе пустой строки (например, нажатием клавиши возврата) в левой части редактора появляется новое меню быстрой вставки (QI).


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


Меню QI - это гаджет для экономии времени, с ним Вы сможете обнаружить, что редко обращаетесь к главной панели инструментов.

 

[Hope]

Менеджер кнопок
Компоновка элементов управления для RTE настраивалась с помощью удобного интерфейса перетаскивания через панель управления администратора начиная с XenForo 2.1, но с приходом XenForo 2.2 и дополнительной сложностью групп кнопок, и связанных с ними параметров, мы также переработали и менеджер кнопок.

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


Каждая группа кнопок имеет соответствующее меню, которое содержит параметры для управления количеством кнопок, отображаемых до отображения кнопки «ещё», и выравниванием группы влево или вправо.


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

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

 

[Hope]

Предпросмотр
Еще одна особенность, которая была на нашем радаре в течение некоторого времени, это система предварительного просмотра сообщений.

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

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


Это изменение оказывает огромное влияние на ргромоздкую природу процесса компоновки и делает редактирование намного более приятным.

 

[Hope]

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

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

2.2 всё это меняет.


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


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

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


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

 

[Hope]

Новые возможности рендеринга
Одно важное изменение, которое Вы обязательно заметите в XenForo 2.2, заключается в том, что нажатие кнопки «Ответить» на сообщение теперь включает отображаемую версию цитируемого текста в Вашем редакторе, а не отображение необработанных тегов [QUOTE].


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

 

[Hope]

Новые BB-коды по умолчанию
Мы добавили несколько новых BB-кодов, чтобы отразить некоторые улучшения форматирования, которые появились в XenForo 2.1.

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

Итак, 2.2 вводит теги HEADING и HR, которые добавляют очистку с плавающей точкой в свой HTML-вывод.

Мы подумали, что семантические преимущества, связанные с тем, что пользователи могут использовать теги HEADING, вероятно, тоже были бы полезны.

 

[Hope]

В заключении

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

Мы надеемся, что Вам понравятся сделанные нами изменения и улучшения, которые, как мы уверены, значительно улучшат удовольствие от создания контента в XenForo. Дайте нам знать, что Вы думаете ?

 

[weblabel]

Спасибо за отличный перевод и обзор. Отличные улучшения, хотя моё знакомство с этим движком началось с версии 2.1.10, с прошлыми версиями сравнить трудно. Xenforo с каждым днём нравится всё больше и больше (в сравнении даже с тем же IPS последних версий), но единственное на мой взгляд система оценки (реакции) пользователей (лайк/дизлайк/спасибо и т.п.) вроде на IPS как-то интереснее и "крупнее" что ли реализовано, здесь слишком "мелкие" реакции. Ждём новую версию, теперь осталось понять как корректно обновиться, чтобы не слетело ничего, изучаю форум)))

 

[West14]

Редактор хрень, имхо.

 

[Matew]

Редактор хрень, имхо.

И внешний вид хрень

 

[Sidd]

Да новый редактор больше похож на word чем старый)

 

[liberton]

Они уже изменили внешний вид после отзывов, убрали градиент "как в ворде" и поле, когда в фокусе, теперь белое, а не голубое.

 

[HAIM]

Осталось, чтобы все-все-все теги сразу рендерились в редакторе, а не полтора землекопа

 

[Matew]

градиент "как в ворде"

Где вообще в ворде градиент они нашли...

 

[CrazyHackGUT]

Осталось, чтобы все-все-все теги сразу рендерились в редакторе, а не полтора землекопа

Во-во, а то разговоров было...

 

[HAIM]

Во-во, а то разговоров было...

Разрабы этот момент как-то комментировали? А то там на оффе миллион постов после того, как бету на лайв выкатили, слишком сложно следить

 

[CrazyHackGUT]

Разрабы этот момент как-то комментировали?

Не видел лично. Я у них про прокрутку влево-вправо при сжатии браузера и про превью спрашивал, но

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

. Но апдейт чисто из-за редактора объективно говно. Буду надеяться, что кто-то запилит аддон на старый родной редактор.