Автор Тема: Как сделать расширенный функционал редактора Tinymce  (Прочитано 62 раз)

21 Март 2019, 12:05:09
  • Новичок
  • *
  • Сообщений: 49
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Добрый день.
По умолчанию у редактора в админке, нет даже кнопок расположить слева/по центру/справа.

Как включить расширеный редактор в админке prestashop 1.7.3?
21 Март 2019, 12:06:59
Ответ #1
  • Ветеран
  • *****
  • Сообщений: 1174
  • Репутация: +7/-1
  • Сообщество PrestaShop
    • Просмотр профиля
В  /js/admin/tinymce.inc.js добавьте в default_config тулбары и кнопки.
21 Март 2019, 12:10:59
Ответ #2
  • Модератор
  • Ветеран
  • *****
  • Сообщений: 21591
  • Репутация: +25290/-1
  • Prestashop - просто и эффективно
    • Просмотр профиля
Эксперт Prestashop - решения всех проблем, написание модулей, создание тем для интернет-магазинов под Prestashop.
Эксперт Magento - создам сайт на Magento, программирование кастомных модулей для Magento, кастомизация тем Magento.
Лучшие цены!!!
21 Март 2019, 12:18:00
Ответ #3
  • Новичок
  • *
  • Сообщений: 49
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
В  /js/admin/tinymce.inc.js добавьте в default_config тулбары и кнопки.

Добавил, но кнопки не отображаются:

/**
 * Change default icons to marerial icons
 */
function changeToMaterial() {
  var materialIconAssoc = {
    'mce-i-code': '<i class="material-icons">code</i>',
    'mce-i-none': '<i class="material-icons">format_color_text</i>',
    'mce-i-bold': '<i class="material-icons">format_bold</i>',
    'mce-i-italic': '<i class="material-icons">format_italic</i>',
    'mce-i-underline': '<i class="material-icons">format_underlined</i>',
    'mce-i-strikethrough': '<i class="material-icons">format_strikethrough</i>',
    'mce-i-blockquote': '<i class="material-icons">format_quote</i>',
    'mce-i-link': '<i class="material-icons">link</i>',
    'mce-i-alignleft': '<i class="material-icons">format_align_left</i>',
    'mce-i-aligncenter': '<i class="material-icons">format_align_center</i>',
    'mce-i-alignright': '<i class="material-icons">format_align_right</i>',
    'mce-i-alignjustify': '<i class="material-icons">format_align_justify</i>',
    'mce-i-bullist': '<i class="material-icons">format_list_bulleted</i>',
    'mce-i-numlist': '<i class="material-icons">format_list_numbered</i>',
    'mce-i-image': '<i class="material-icons">image</i>',
    'mce-i-table': '<i class="material-icons">grid_on</i>',
    'mce-i-media': '<i class="material-icons">video_library</i>',
    'mce-i-browse': '<i class="material-icons">attachment</i>',
    'mce-i-checkbox': '<i class="mce-ico mce-i-checkbox"></i>',
  };

  $.each(materialIconAssoc, function (index, value) {
    $('.' + index).replaceWith(value);
  });
}

function tinySetup(config) {
  if (typeof tinyMCE === 'undefined') {
    setTimeout(function() {
      tinySetup(config);
    }, 100);
    return;
  }

  if (!config) {
    config = {};
  }

  if (typeof config.editor_selector != 'undefined') {
    config.selector = '.' + config.editor_selector;
  }


  var default_config = {
    selector: ".rte",
    plugins: "advlist autolink lists link image charmap print preview anchor searchreplace visualblocks code fullscreen insertdatetime media table contextmenu powerpaste",
    browser_spellcheck: true,
    toolbar1: "code,colorpicker,bold,italic,underline,strikethrough,blockquote,link,align,alignleft,aligncenter,alignright,bullist,numlist,table,image,media,formatselect",
    toolbar2: "",
    external_filemanager_path: baseAdminDir + "filemanager/",
    filemanager_title: "File manager",
    external_plugins: {"filemanager": baseAdminDir + "filemanager/plugin.min.js"},
    language: iso_user,
    content_style : (lang_is_rtl === '1' ? "body {direction:rtl;}" : ""),
    skin: "prestashop",
powerpaste_word_import: 'prompt',
powerpaste_html_import: 'prompt',
valid_children : "+div[#a]",
    menubar: false,
    statusbar: false,
    relative_urls: false,
    convert_urls: false,
    entity_encoding: "raw",
    extended_valid_elements: "em[class|name|id],@[role|data-*|aria-*]",
    valid_children: "+*[*]",
    valid_elements: "*[*]",
    init_instance_callback: "changeToMaterial",
    rel_list:[
      { title: 'nofollow', value: 'nofollow' }
    ]
  };

  $.each(default_config, function (index, el) {
    if (config[index] === undefined)
      config[index] = el;
  });

  // Change icons in popups
  $('body').on('click', '.mce-btn, .mce-open, .mce-menu-item', function () {
    changeToMaterial();
  });

  tinyMCE.init(config);
}
21 Март 2019, 12:20:26
Ответ #4
  • Новичок
  • *
  • Сообщений: 49
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Добавил, но кнопки центрирования не отображаются, остальные кнопки из списка отображаются "code,colorpicker,bold,italic,underline,strikethrough,blockquote,link,align,alignleft,aligncenter,alignright,bullist,numlist,table,image,media,formatselect":
21 Март 2019, 12:21:24
Ответ #5
  • Новичок
  • *
  • Сообщений: 49
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Полно таких тем на форуме
https://prestashop-forum.ru/index.php/topic,9746.msg61803.html
я вроде совсем о другом спрашиваю.
не в обиду говоря
21 Март 2019, 12:51:14
Ответ #6
  • Модератор
  • Ветеран
  • *****
  • Сообщений: 21591
  • Репутация: +25290/-1
  • Prestashop - просто и эффективно
    • Просмотр профиля
Принцип тот-же, а какие кнопки добавить сами решайте.
Главное написали где менять в каком файле.
Эксперт Prestashop - решения всех проблем, написание модулей, создание тем для интернет-магазинов под Prestashop.
Эксперт Magento - создам сайт на Magento, программирование кастомных модулей для Magento, кастомизация тем Magento.
Лучшие цены!!!
21 Март 2019, 13:20:16
Ответ #7
  • Ветеран
  • *****
  • Сообщений: 15476
  • Репутация: +14594/-5
  • Сообщество PrestaShop
    • Просмотр профиля
Добрый день.
По умолчанию у редактора в админке, нет даже кнопок расположить слева/по центру/справа.

Как включить расширеный редактор в админке prestashop 1.7.3?
Есть центрирование, вы плохо смотрели или у вас редактор изменен.
21 Март 2019, 16:42:27
Ответ #8
  • Новичок
  • *
  • Сообщений: 49
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Добрый день.
По умолчанию у редактора в админке, нет даже кнопок расположить слева/по центру/справа.

Как включить расширеный редактор в админке prestashop 1.7.3?
Есть центрирование, вы плохо смотрели или у вас редактор изменен.
Извиняюсь, что сразу не уточнил.
Проблема с редактором категорий товаров и обычных страниц, а в товарах кнопка центрирования есть.
21 Март 2019, 17:55:03
Ответ #9
  • Ветеран
  • *****
  • Сообщений: 15476
  • Репутация: +14594/-5
  • Сообщество PrestaShop
    • Просмотр профиля
Настройки редактора общие для категорий, товаров и страниц. Файл конфигурации один -  /js/admin/tinymce.inc.js
У вас админка переделана. В переопределениях поищите изменения.