Перейти до вмісту
Пошук в
  • Детальніше...
Шукати результати, які ...
Шукати результати в ...

[Решено] Установка TinyMCE на ocStore 2.3

SergDrakus
 Share

Recommended Posts

SergDrakus Enthusiast

SergDrakus

Опубліковано:
Опубліковано:

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

Каким образом можно установить TinyMCE на ocStore 2.3.0.2 ? Возможные трудности после установки меня не пугают, обновлять CMS вряд ли буду в ближайший год.

Надіслати
Поділитися на інших сайтах

chukcha Grand Master

chukcha

Опубліковано:
Опубліковано:

почти таким же как описывают,

И мне кажется даже немного проще..

 

вот пример

admin\view\javascript\summernote\opencart.js

Надіслати
Поділитися на інших сайтах
1
1
1

chukcha Grand Master

chukcha

Опубліковано:
Опубліковано:

А что пояснять?

<?php foreach ($languages as $language) { ?>
$('#input-description<?php echo $language['language_id']; ?>').summernote({
    height: 300
});
<?php } ?>

в 2.3 этого нет, а вынесено в отдельный скрипт

$(document).ready(function() {
	// Override summernotes image manager
	$('.summernote').each(function() {
		var element = this;
...

и подключение

<script type="text/javascript" src="view/javascript/summernote/summernote.js"></script>
  <link href="view/javascript/summernote/summernote.css" rel="stylesheet" />
  <script type="text/javascript" src="view/javascript/summernote/opencart.js"></script>

что бы заменить

нужно "удалить" эти строки и подставить свои

$('.summernote').tinymce({
    selector: "textarea#elm1",
    theme: "modern",
    language:"ru",
    width: 800,
    height: 300,
....

Т.е вставить код который рекомендуют для замены

 

ну и конечно нужные скрипты

<script type="text/javascript" src="view/javascript/tinymce/..."></script>
<script type="text/javascript" src="view/javascript/tinymce/..."></script>

Т.е. смотрите рекомендации - делайте!

Сделаете - поделитесь с сообществом

Надіслати
Поділитися на інших сайтах
1
1
1

SergDrakus Enthusiast

SergDrakus

Опубліковано:
  • Автор
Опубліковано:

А что пояснять?

<?php foreach ($languages as $language) { ?>
$('#input-description<?php echo $language['language_id']; ?>').summernote({
    height: 300
});
<?php } ?>

в 2.3 этого нет, а вынесено в отдельный скрипт

$(document).ready(function() {
	// Override summernotes image manager
	$('.summernote').each(function() {
		var element = this;
...

и подключение

<script type="text/javascript" src="view/javascript/summernote/summernote.js"></script>
  <link href="view/javascript/summernote/summernote.css" rel="stylesheet" />
  <script type="text/javascript" src="view/javascript/summernote/opencart.js"></script>

что бы заменить

нужно "удалить" эти строки и подставить свои

$('.summernote').tinymce({
    selector: "textarea#elm1",
    theme: "modern",
    language:"ru",
    width: 800,
    height: 300,
....

Т.е вставить код который рекомендуют для замены

 

ну и конечно нужные скрипты

<script type="text/javascript" src="view/javascript/tinymce/..."></script>
<script type="text/javascript" src="view/javascript/tinymce/..."></script>

Т.е. смотрите рекомендации - делайте!

Сделаете - поделитесь с сообществом

Спасибо за ответ! Не подскажите, как называется файл с выводом скриптов? Что-то не могу его найти, юзаю поиск по всем файлам.

Надіслати
Поділитися на інших сайтах

SergDrakus Enthusiast

SergDrakus

Опубліковано:
  • Автор
Опубліковано:

Каких скриптов?

<script type="text/javascript" src="view/javascript/summernote/summernote.js"></script>

<link href="view/javascript/summernote/summernote.css" rel="stylesheet" />

<script type="text/javascript" src="view/javascript/summernote/opencart.js"></script>

Надіслати
Поділитися на інших сайтах

SergDrakus Enthusiast

SergDrakus

Опубліковано:
  • Автор
Опубліковано:

Версия ocStore 2.3.0.2.

Единственное место, где все эти строки вместе – это файл /admin/view/template/extension/openbay/ebay_new.tpl

В трех файлах упоминаются лишь некоторые эти скрипты. Вот названия этих файлов – blog_form.tpl, record_form.tpl и blog_widgents.tpl

Надіслати
Поділитися на інших сайтах

chukcha Grand Master

chukcha

Опубліковано:
Опубліковано:

Ну.. почему нельзя хоть чуть-чуть напрячься?

Ну..я понимаю, что бурная ночь

	protected function getForm() {
    //CKEditor
    if ($this->config->get('config_editor_default')) {
        $this->document->addScript('view/javascript/ckeditor/ckeditor.js');
        $this->document->addScript('view/javascript/ckeditor/ckeditor_init.js');
    } else {
        $this->document->addScript('view/javascript/summernote/summernote.js');
        $this->document->addScript('view/javascript/summernote/lang/summernote-' . $this->language->get('lang') . '.js');
        $this->document->addScript('view/javascript/summernote/opencart.js');
        $this->document->addStyle('view/javascript/summernote/summernote.css');
    }
Надіслати
Поділитися на інших сайтах
1
1
1

SergDrakus Enthusiast

SergDrakus

Опубліковано:
  • Автор
Опубліковано: (змінено)

 

Ну.. почему нельзя хоть чуть-чуть напрячься?

Ну..я понимаю, что бурная ночь

	protected function getForm() {
    //CKEditor
    if ($this->config->get('config_editor_default')) {
        $this->document->addScript('view/javascript/ckeditor/ckeditor.js');
        $this->document->addScript('view/javascript/ckeditor/ckeditor_init.js');
    } else {
        $this->document->addScript('view/javascript/summernote/summernote.js');
        $this->document->addScript('view/javascript/summernote/lang/summernote-' . $this->language->get('lang') . '.js');
        $this->document->addScript('view/javascript/summernote/opencart.js');
        $this->document->addStyle('view/javascript/summernote/summernote.css');
    }

Спасибо! Скрипты подключил следующей строкой в файле Product. (путь /admin/controller/catalog/)

        $this->document->addScript('view/javascript/tinymce/jquery.tinymce.min.js');
        $this->document->addScript('view/javascript/tinymce/tinymce.min.js');

Теперь ковыряю opencart.js, расположенный в Summer Note.

 

Заменил исходные данные в файле Opencart.js : 

$(element).summernote({
disableDragAndDrop: false,
height: 600,
lang: lang,
emptyPara: '',
toolbar: [
['style', ['style']],
['font', ['bold', 'underline', 'clear']],
['fontsize', ['fontsize']],
['fontname', ['fontname']],
['color', ['color']],
['para', ['ul', 'ol', 'paragraph']],
['table', ['table']],
['insert', ['link', 'image', 'video']],
['view', ['fullscreen', 'codeview']]
],
buttons: {
     image: function() {
var ui = $.summernote.ui;


// create button
var button = ui.button({
contents: '<i class="note-icon-picture" />',
tooltip: $.summernote.lang[$.summernote.options.lang].image.image,
click: function () {
$('#modal-image').remove();


$.ajax({
url: 'index.php?route=common/filemanager&token=' + getURLVar('token'),
dataType: 'html',
beforeSend: function() {
$('#button-image i').replaceWith('<i class="fa fa-circle-o-notch fa-spin"></i>');
$('#button-image').prop('disabled', true);
},
complete: function() {
$('#button-image i').replaceWith('<i class="fa fa-upload"></i>');
$('#button-image').prop('disabled', false);
},
success: function(html) {
$('body').append('<div id="modal-image" class="modal">' + html + '</div>');


$('#modal-image').modal('show');


$('#modal-image').delegate('a.thumbnail', 'click', function(e) {
e.preventDefault();


$(element).summernote('insertImage', $(this).attr('href'));


$('#modal-image').modal('hide');
});
}
}); 
}
});


return button.render();
}
   }
});

На вот это

$('.summernote').tinymce({


});

Редактор заработал, теперь буду ковырять конфиг (подстраивать под себя). Огромное вам спасибо!

 

Змінено користувачем SergDrakus
Надіслати
Поділитися на інших сайтах

chukcha Grand Master

chukcha

Опубліковано:
Опубліковано:

еперь ковыряю opencart.js, расположенный в Summer Note.

 

Зачем его трогать

 

Сделайте свой по принципу

$this->document->addScript('view/javascript/tinymce/opencart.js');

 

 

А родной не трогайте

Надіслати
Поділитися на інших сайтах
1
1
1

SergDrakus Enthusiast

SergDrakus

Опубліковано:
  • Автор
Опубліковано:

Зачем его трогать

 

Сделайте свой по принципу

$this->document->addScript('view/javascript/tinymce/opencart.js');

А родной не трогайте

Да, спасибо за дельный совет. Сделал запись вида:

 //  $this->document->addScript('view/javascript/summernote/opencart.js');
        $this->document->addScript('view/javascript/tinymce/opencart.js');

Классический SummerNote закомментировал. Вдруг пригодится в будущем.

Теперь нужно прикрутить менеджер изображений к TinyMCE и дело в шляпе)

Надіслати
Поділитися на інших сайтах

SergDrakus Enthusiast

SergDrakus

Опубліковано:
  • Автор
Опубліковано:

Если кому интересно, то прикрепил к TinyMCE для OpenCart 2.3 (ocStore) редактор файлов filemanager

Делал все по инструкции этой: http://realister.ru/page/zamena-redaktora-summernote-v-opencart-20x-na-tinymce-s-integrirovannym-responsive-filemanager

В файл конфигурации TinyMCE (opencart.js) я просто подписал 

external_filemanager_path:"/filemanager/",   filemanager_title:"Responsive Filemanager" ,
   external_plugins: { "filemanager" : "/filemanager/plugin.min.js"},
   style_formats: [
        {title: 'Bold text', inline: 'b'},
        {title: 'Red text', inline: 'span', styles: {color: '#ff0000'}},
        {title: 'Red header', block: 'h1', styles: {color: '#ff0000'}},
        {title: 'Example 1', inline: 'span', classes: 'example1'},
        {title: 'Example 2', inline: 'span', classes: 'example2'},
        {title: 'Table styles'},
        {title: 'Table row 1', selector: 'tr', classes: 'tablerow1'}
    ],
Надіслати
Поділитися на інших сайтах

SergDrakus Enthusiast

SergDrakus

Опубліковано:
  • Автор
Опубліковано:

Прикрепил к TinyMCE плагин CodeMirror последней версии.

Делал все по этой инструкции https://github.com/christiaan/tinymce-codemirror

Файл сборки CodeMirror (последний) можно скачать с официального сайта.

В файле OpenCart.js (отвечает за настройку TinyMCE) обязательно требуется добавить код вида:

codemirror: {
    indentOnInit: true, // Whether or not to indent code on init.
    path: 'codemirror', // Path to CodeMirror distribution
    config: {           // CodeMirror config object
       mode: 'application/x-httpd-php',
       lineNumbers: true
    },
    width: 900,         // Default value is 800
    height: 700,        // Default value is 550
    jsFiles: [          // Additional JS files to load
       'mode/clike/clike.js',
       'mode/php/php.js'
    ]
  }
Надіслати
Поділитися на інших сайтах

SergDrakus Enthusiast

SergDrakus

Опубліковано:
  • Автор
Опубліковано:

Отключил встроенную проверку орфографии (актуальна только для англ и других языков командой:

gecko_spellcheck:true

Теперь всегда срабатывает классическая система проверки орфографии, встроенная в операционные системы и браузеры.

Надіслати
Поділитися на інших сайтах

SergDrakus Enthusiast

SergDrakus

Опубліковано:
  • Автор
Опубліковано:

Этот редактор имеет привычку ставить неразрывные пробелы &nbsp. На WordPress я поборол эту проблему тем, что при публикации статьи все неразрывные пробелы напрочь удалялись. Код привожу ниже. Можео ли его как-то абаптироввть под OpenCart?

function remove_non_breaking_spaces_from_content( $data ) {

$data['post_content'] = preg_replace( '#\xC2\xA0| #', ' ', $data['post_content'] );

return $data;

}

add_action( 'wp_insert_post_data', 'remove_non_breaking_spaces_from_content' );

Надіслати
Поділитися на інших сайтах

chukcha Grand Master

chukcha

Опубліковано:
Опубліковано:

при выводе - да

 

$data['description'] = preg_replace( '#\xC2\xA0| #', ' ', html_entity_decode($product_info['description'], ENT_QUOTES, 'UTF-8'));

 

но это как-то выглядит, как костыль

 

предпочитаю читать официальную документацию

 

entity_encoding: 'raw'

http://archive.tinymce.com/wiki.php/Configuration3x:entity_encoding

Надіслати
Поділитися на інших сайтах
1
1
1

SergDrakus Enthusiast

SergDrakus

Опубліковано:
  • Автор
Опубліковано:

при выводе - да

 

$data['description'] = preg_replace( '#\xC2\xA0| #', ' ', html_entity_decode($product_info['description'], ENT_QUOTES, 'UTF-8'));

 

но это как-то выглядит, как костыль

 

предпочитаю читать официальную документацию

 

entity_encoding: 'raw'

http://archive.tinymce.com/wiki.php/Configuration3x:entity_encoding

Увы, но данная конструкция (entity_encoding: 'raw') запрещает отображение nbsp только в админке. Стоит опубликовать материал, как в разметке видны все эти nbsp.

Надіслати
Поділитися на інших сайтах

SergDrakus Enthusiast

SergDrakus

Опубліковано:
  • Автор
Опубліковано:

Подскажите пожалуйста, в какой файл требуется вставить эту конструкцию?

$data['description'] = preg_replace( '#\xC2\xA0| #', ' ', html_entity_decode($product_info['description'], ENT_QUOTES, 'UTF-8'));
Надіслати
Поділитися на інших сайтах

chukcha Grand Master

chukcha

Опубліковано:
Опубліковано:

 

Подскажите пожалуйста, в какой файл требуется вставить эту конструкцию?

$data['description'] = preg_replace( '#\xC2\xA0| #', ' ', html_entity_decode($product_info['description'], ENT_QUOTES, 'UTF-8'));

Мне не сложно подсказать -НО! Потрудитесь поискать сами, ведь я привел "уникальные" строчки, такие как $data['description']  $product_info['description']

Надіслати
Поділитися на інших сайтах
1
1
1

SergDrakus Enthusiast

SergDrakus

Опубліковано:
  • Автор
Опубліковано: (змінено)

Задачу решил.

Вставлял в файл product.php по пути /catalog/controller/product

 

Нашел строку

$data['description'] = html_entity_decode($product_info['description'], ENT_QUOTES, 'UTF-8');
заменил на
$data['description'] = preg_replace( '#\xC2\xA0| #', ' ', html_entity_decode($product_info['description'], ENT_QUOTES, 'UTF-8'));

Пару раз перезагрузил браузер, почистил все кеши. Обновил страницу с товаром. Все nbsp пропали. Отлично! Огромное спасибо!

Змінено користувачем SergDrakus
Надіслати
Поділитися на інших сайтах

SergDrakus Enthusiast

SergDrakus

Опубліковано:
  • Автор
Опубліковано:

У меня остался последний вопрос, над которым я работаю уже больше двух часов. Как в CodeMirror (подсветка текста) заменить тему на одну из вариантов в папке theme? В какие файлы я не вносил изменения (в пределах папки tinymce), ничего не помогает. Как задний фон был белый (стандратная тема какая-то), таким он и остался.

Надіслати
Поділитися на інших сайтах

Створіть аккаунт або увійдіть для коментування

Ви повинні бути користувачем, щоб залишити коментар

Створити обліковий запис

Зареєструйтеся для отримання облікового запису. Це просто!

Зареєструвати аккаунт

Вхід

Уже зареєстровані? Увійдіть тут.

Вхід зараз
 Share
Перейти до списку тем

  • Зараз на сторінці   0 користувачів

    • Ні користувачів, які переглядиють цю сторінку

Покупцям

Розробникам

Корисна інформація

Останні розширення

×
×
  • Створити...

Important Information

На нашому сайті використовуються файли cookie і відбувається обробка деяких персональних даних користувачів, щоб поліпшити користувальницький інтерфейс. Щоб дізнатися для чого і які персональні дані ми обробляємо перейдіть за посиланням . Якщо Ви натиснете «Я даю згоду», це означає, що Ви розумієте і приймаєте всі умови, зазначені в цьому Повідомленні про конфіденційність.

  Я даю згоду