Как подключить CodeMirror к редактору SummerNote

[SergDrakus]

Как подключить подсветку кода CodeMirror к редактору SummerNote

Действовал по инструкции на официальном сайте, подключал через CDN, в Opencart.js добавил подключение этого плагина. В итоге – ничего не изменилось. Инструкций в сети Интернет актуальных я так и не нашел.

[chukcha]

Что ж єто вас так колбасит?

Чем не устраивает tinymce?

[chukcha]

Вы бы показали как вы подключаете, может быть вы не все скрипты подключаете?

[SergDrakus]

Что ж єто вас так колбасит?

Чем не устраивает tinymce?

Хочу все варианты опробовать и выбрать наилучший.

Вот текст для подключения:

<!-- include libraries(jQuery, bootstrap) -->
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet">
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.js"></script>

<!-- include codemirror (codemirror.css, codemirror.js, xml.js, formatting.js) -->
<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/codemirror.css">
<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/theme/monokai.css">
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/codemirror.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/mode/xml/xml.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/codemirror/2.36.0/formatting.js"></script>

Выводу вот так (файл opencart.js):

$('.summernote').summernote({
height: 150, //set editable area's height
codemirror: { // codemirror options
theme: 'monokai'
}
});

Действую по инструкции на офф сайте http://summernote.org/examples/#codemirror-as-codeview

[chukcha]

Попробуйте

<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/codemirror.css">
<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/theme/monokai.css">
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/codemirror.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/mode/xml/xml.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/codemirror/2.36.0/formatting.js"></script>

В том же блоке где подключается summernote

 

 

До Подключения summernote

 

У меня подключился, даже без инициализации в скрипте

[chukcha]

Может  быть у нас отличаются версии редактора, но он сам определяет наличие

var hasCodeMirror = !!window.CodeMirror;

Т.е. достаточно толко подключение
Ну.. разве что поиграться  темой самого codemirror

[SergDrakus]

Да, в файле summernote.js действительно сам проверяет наличие CodeMirror.

Тем не менее, не работает. Скорее всего я не там подключения эти скрипты. В какой файл нужно их добавлять?

 

Вставил в header.tpl (самый верх). Вроде бы все заработало, но есть одна проблема, которая так и не решилась.

 

Смотрите. Я пишу какой-то текста (2-3 абзаца). В визуальном редакторе все выглядит как нужно, но стоит переключить в исходный код, как весь набранный текст вместе с атрибутами превращается в одну большую кашу. Это очень неудобно, поскольку между абзацами я добавляю видео вручную и изображения анимированные. Как я понимаю, тег <br>, который виден в SummerNote, отвечает за перенос на новую строку.

Можно ли как-то заставить SummerNote не смешить код в один единый текст?

Змінено 3 січня 2017 користувачем SergDrakus

[Leo2]

Подскажите, как включить перенос строк в codemirror для summernote?

Пробовал в файле codemirror.js поменять в строке 5421

  option("lineWrapping", false, wrappingChanged, true);

на  

option("lineWrapping", true, wrappingChanged, true);

 

но все равно не переносит. Может где-то в другом месте опции для переноса строк?

 

ЗЫ. Opencart.Pro 2.3

Змінено 8 жовтня 2019 користувачем Leo2

[Vladimir230587]

В 08.10.2019 в 18:31, Leo2 сказал:

Подскажите, как включить перенос строк в codemirror для summernote?

Пробовал в файле codemirror.js поменять в строке 5421

  option("lineWrapping", false, wrappingChanged, true);

на  

option("lineWrapping", true, wrappingChanged, true);

 

но все равно не переносит. Может где-то в другом месте опции для переноса строк?

 

ЗЫ. Opencart.Pro 2.3

 

Обнови кеш модификаторов. На Octore 2.3 заработало сразу.

[Leo2]

On 12/5/2019 at 11:50 AM, Vladimir230587 said:

Обнови кеш модификаторов. На Octore 2.3 заработало сразу.

Проверил, действительно, заработало. спс