Статьи

Как динамически локализовать TinyMCE

Ноябрь 1, 2018

Эта статья научит вас, как динамически локализовать ваш редактор TinyMCE . Если вы не знакомы с тем, что такое TinyMCE, это многофункциональный текстовый редактор для веб-приложений типа «что вы видите, то, что вы получаете», встроенный в JavaScript.

Проблема

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

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

Решение

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

Предположим, что на вашем сайте / фреймворке переменная, которая содержит текущий язык, называется $current_lang Вы должны проверить, что ваша переменная $current_lang Проще говоря, код TinyMCE для испанского — это «es», и если $current_lang Так что в этом случае вам нужно добавить дополнительную строку или две: 

 <?php
...
if($current_lang == 'sp') {
    $current_lang = 'es';
} else {
    $current_lang = 'en'; //or whatever the default lang you wish
} 
...

Вы можете посмотреть коды здесь и посмотреть, соответствуют ли они тому, что вы уже используете на своем сайте / фреймворке.

Теперь давайте перейдем к разделу заголовка вашего сайта / фреймворка, где вы ранее инициализировали TinyMCE. Мы собираемся импортировать нашу переменную php $current_lang 

 <script type="text/javascript">

var cur_lang = "<?php echo $current_lang; ?>"; // do not forget the double quotes

tinyMCE.init({
...

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

 <script type="text/javascript">

var cur_lang = "<?php echo $current_lang; ?>"; // do not forget the double quotes

tinyMCE.init({
        // General options
        width : "480",
        height : "680",
        mode : "textareas",
        theme : "advanced",
        language : cur_lang,  // Here we have added our language parameter, the value of which corresponds to our current language on the site.
        plugins : 
        ...

Примечание. Не забудьте также изменить фрагмент инициализации Javascript вашего компрессора TinyMCE, если вы его установили.

Вот и все, теперь интерфейс вашего редактора TinyMCE будет отображаться на том языке, на котором сейчас работает ваш сайт.

Вывод

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

35
Share: