Перевод тем дизайна приложения «Хаб» на визуальный текстовый редактор Redactor II

Михаил Ушенин

Начиная с версии 1.2.0 приложение «Хаб» поддерживает версию визуального редактора Redactor II.

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

1. Обновите URL подключаемых файлов

Исходный код редактора расположен в директории wa-content/js/redactor/2/.

<link type="text/css" rel="stylesheet" href="{$wa_static_url}wa-content/js/redactor/2/redactor.css?v{$wa->version(true)}">
<script src="{$wa_static_url}wa-content/js/redactor/2/redactor.min.js?v{$wa->version(true)}"></script>
{if substr($wa->locale(), 0, 2)!='en'}
    <script src="{$wa_static_url}wa-content/js/redactor/2/{substr($wa->locale(), 0, 2)}.js?v{$wa->version(true)}"></script>
{/if}

2. Обновите параметры инициализации

Обратите внимание на значение поля _version для параметра imageUploadFields.

options = $.extend({
    minHeight: 150,
    buttonSource: false,
    paragraphy: false,
    convertDivs: false,
    pasteLinkTarget: '_blank',
    buttons: ['bold', 'italic', 'underline', 'deleted', 'lists', 'image', 'video', 'link', 'codeblock', 'blockquote'],
    plugins: ['video', 'codeblock', 'blockquote'],
    imageUpload: el.data('upload-url'),
    imageUploadFields: {
        _csrf: (el.data('csrf') || el.closest('form').find('input[name="_csrf"]').val()),
        _version: 2 // с этим значением контроллер загрузки изображений вернёт правильную строку JSON для новой версии редактора
    },
    imageUploadErrorCallback: function(json) {
        alert(json.error);
    }
}, options || {});

3. Добавьте data-атрибут

Ссылке редактирования комментария в шаблоне comment.html добавьте атрибут data-upload-url, как показано в примере. Это нужно для правильной инициализации редактора.

<a class="aux comment-edit inline-link" href="#" data-upload-url="{$wa->getUrl('/frontend/uploadImage')}" data-save-string="[`Save`]" data-url="{$wa->getUrl('hub/frontend/commentsEdit', [ 'id' => $topic.id, 'topic_url' => $topic.url ])}"><b><i>[`edit`]</i></b></a>
27 марта 2018
  • Большое спасибо за анонс!

    Хоть мы и не работаем еще плотно с Хабом, но идею подобных анонсов полностью поддерживаем!

  • Павел Трофимов 29 марта 2018 15:29

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

  • Владимир Сергеев 29 марта 2018 17:51

    Павел, я в proStore уже обновил!
    Хочу сказать, что новый редактор удобный!

  • Павел Трофимов 29 марта 2018 18:15

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

  • Владимир Сергеев 29 марта 2018 18:19

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

  • Павел Трофимов 29 марта 2018 18:33

    Да, кстати, должен отметить что с т.з. работы с Хабом proStore на текущий момент является лучшей темой, оставив другие темы далеко позади. Спасибо, Владимир.



Чтобы добавить комментарий, зарегистрируйтесь или войдите