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

Как обновить редактор Summernote

newjey

Автор: ,
в Opencart 2.x: Пісочниця

 Share

Recommended Posts

newjey Proficient

newjey

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

Всем привет. Подскажите как правильно сделать обновление встроенного редактора summernote что бы он корректно работал?

Я скачал новый с офф сайта https://summernote.org/getting-started/ перезалил файлы, добавил в admin/view/template/common/header.tpl  

<!-- include libraries(jQuery, bootstrap) -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

<!-- include summernote css/js -->
<link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.js"></script>

Редактор обновился, появилась новая загрузка изображений. Но, при вставке фото в описание товара и сохранении это фото пропадает. Как сделать что бы все работало хорошо?

Спасибо.

Забыл сказать что в admin/view/template/common/header.tpl  прописанны еще по умолчанию: 

<script type="text/javascript" src="view/javascript/jquery/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="view/javascript/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="view/javascript/summernote/summernote.js"></script>
<script src="view/javascript/summernote/lang/summernote-<?php echo $lang; ?>.js"></script>

 

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

retterwien Collaborator

retterwien

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

Заглянуть в консоль и посмотреть ошибки, и логи что там и как?

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

retterwien Collaborator

retterwien

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

Консоль что показывает? Есть ошибки?

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

newjey Proficient

newjey

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

Логи гляну. Но заметил что фото добавляется в таком формате:

  Показати вміст

 

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

Seriusis Grand Master

Seriusis

Опубліковано:
Опубліковано:
  В 15.07.2020 в 08:29, newjey сказав:

Редактор обновился, появилась новая загрузка изображений. Но, при вставке фото в описание товара и сохранении это фото пропадает. Как сделать что бы все работало хорошо?

 

Expand  

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

В файле admin/view/javascript/summernote/opencart.js нужно смотреть. Скорее всего нужно править ф-ю, там где  

image: function() {

т.е которая срабатывает при клике на кнопку вставки изображений

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

Seriusis Grand Master

Seriusis

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

еще проверьте, должен быть подключен admin/view/javascript/summernote/opencart.js , у вас его не вижу, может потому и не работает загрузка, т.к не описаны параметры для редактора, т.е не подключен файл.

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

newjey Proficient

newjey

Опубліковано:
  • Автор
Опубліковано:
  В 15.07.2020 в 09:18, Seriusis сказав:

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

В файле admin/view/javascript/summernote/opencart.js нужно смотреть. Скорее всего нужно править ф-ю, там где  

image: function() {

т.е которая срабатывает при клике на кнопку вставки изображений

Expand  

admin/view/javascript/summernote/summernote.js вы имели ввиду?

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

newjey Proficient

newjey

Опубліковано:
  • Автор
Опубліковано:
  В 15.07.2020 в 09:24, Seriusis сказав:

еще проверьте, должен быть подключен admin/view/javascript/summernote/opencart.js , у вас его не вижу, может потому и не работает загрузка, т.к не описаны параметры для редактора, т.е не подключен файл.

Expand  

Такого файла у меня нет и не было до обновления.

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

Seriusis Grand Master

Seriusis

Опубліковано:
Опубліковано:
  В 15.07.2020 в 09:24, newjey сказав:

admin/view/javascript/summernote/summernote.js вы имели ввиду?

Expand  

нет, там , где ви пишите сам скрипт редактора, а в opencart.js он вызывается и настраивается

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

newjey Proficient

newjey

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

Подключил admin/view/javascript/summernote/opencart.js ничего не поменялось.

В admin/view/template/common/header.tpl добавил

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

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

Seriusis Grand Master

Seriusis

Опубліковано:
Опубліковано:
  В 15.07.2020 в 09:26, newjey сказав:

Такого файла у меня нет и не было до обновления.

Expand  

скорее всего вы что-то путаете

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

Seriusis Grand Master

Seriusis

Опубліковано:
Опубліковано:
  В 15.07.2020 в 09:31, newjey сказав:

Подключил admin/view/javascript/summernote/opencart.js ничего не поменялось.

Expand  

его подключать после файлов редактора, и смотрите консоль браузера на предмет ошибок

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

newjey Proficient

newjey

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

Вот весь код подключения в opencart.js 

$(document).ready(function() {
	// Override summernotes image manager
	$('.summernote').each(function() {
		var element = this;
		var lang = $(element).data('lang');
		
		if (typeof(lang) == 'undefined') {
			lang = 'en-US';
		}
		
		$(element).summernote({
			disableDragAndDrop: true,
			height: 300,
			lang: lang,
			emptyPara: '',
			toolbar: [
				['codeview', ['codeview']],
                ['style', ['style']],
                ['style', ['bold', 'italic', 'underline', 'clear']],
                ['font', ['strikethrough', 'superscript', 'subscript']],
                ['fontname', ['fontname']],
                ['fontsize', ['fontsize']],
                ['color', ['color']],
                ['para', ['ul', 'ol', 'paragraph']],
                ['height', ['height']],
                ['table', ['table']],
                ['insert', ['link', 'image', 'video']],
                ['undo', ['undo']],
                ['redo', ['redo']],
                ['view', ['fullscreen', 'help']]
			],
			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();
				}
  			}
		});
	});
	
});

 

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

newjey Proficient

newjey

Опубліковано:
  • Автор
Опубліковано:
  В 15.07.2020 в 09:33, Seriusis сказав:

его подключать после файлов редактора, и смотрите консоль браузера на предмет ошибок

Expand   
<script type="text/javascript" src="view/javascript/jquery/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="view/javascript/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="view/javascript/summernote/summernote.js"></script>

<script src="view/javascript/summernote/lang/summernote-<?php echo $lang; ?>.js"></script>
<!-- include libraries(jQuery, bootstrap) -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css2" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

<!-- include summernote css/js -->
<link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.js"></script>

<link href="view/stylesheet/bootstrap.css" type="text/css" rel="stylesheet" />
<link href="view/javascript/font-awesome/css/font-awesome.min.css" type="text/css" rel="stylesheet" />
<link href="view/javascript/summernote/summernote.css" rel="stylesheet" />
<script src="view/javascript/jquery/datetimepicker/moment.js" type="text/javascript"></script>
<script src="view/javascript/jquery/datetimepicker/locale/<?php echo $code; ?>.js" type="text/javascript"></script>
<script src="view/javascript/jquery/datetimepicker/bootstrap-datetimepicker.min.js" type="text/javascript"></script>
<link href="view/javascript/jquery/datetimepicker/bootstrap-datetimepicker.min.css" type="text/css" rel="stylesheet" media="screen" />
<link type="text/css" href="view/stylesheet/stylesheet.css" rel="stylesheet" media="screen" />
<script type="text/javascript" src="view/javascript/summernote/opencart.js"></script>

Вставил так. Ничего не меняется. При этом залилась одно фото и сохранилось. Последующие попытки залить еше фото не получились(

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

retterwien Collaborator

retterwien

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

Ошибки покажите для начала в консоле?!?

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

newjey Proficient

newjey

Опубліковано:
  • Автор
Опубліковано:
  В 15.07.2020 в 09:39, retterwien сказав:

Ошибки покажите для начала в консоле?!?

Expand   
index.php?route=catalog/product/edit&token=2WqfLQAaphgZMSGcTj055WQgVcbkDAfk&product_id=6187&sort=p.…:15 GET https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css2 net::ERR_ABORTED 403
bootstrap-datetimepicker.min.js:90 Uncaught TypeError: picker.element.find(...).size is not a function
    at init (bootstrap-datetimepicker.min.js:90)
    at new DateTimePicker (bootstrap-datetimepicker.min.js:1347)
    at HTMLDivElement.<anonymous> (bootstrap-datetimepicker.min.js:1355)
    at Function.each (jquery-3.5.1.min.js:2)
    at S.fn.init.each (jquery-3.5.1.min.js:2)
    at S.fn.init.$.fn.datetimepicker (bootstrap-datetimepicker.min.js:1351)
    at index.php?route=catalog/product/edit&token=2WqfLQAaphgZMSGcTj055WQgVcbkDAfk&product_id=6187&sort=p.product_id&order=DESC:2715

 

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

Seriusis Grand Master

Seriusis

Опубліковано:
Опубліковано:
  В 15.07.2020 в 09:38, newjey сказав:

Вставил так. Ничего не меняется. При этом залилась одно фото и сохранилось. Последующие попытки залить еше фото не получились(

Expand  

почистите кэш браузера

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

retterwien Collaborator

retterwien

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

Через режим инкогнито проверяйте!

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

newjey Proficient

newjey

Опубліковано:
  • Автор
Опубліковано:
  В 15.07.2020 в 10:26, retterwien сказав:

Через режим инкогнито проверяйте!

Expand  

В режиме инкогнито тоже самое, фото в редактор добавляется, но после сохранения фото пропадает.

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

retterwien Collaborator

retterwien

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

Версии jquery не совместимы, не правильно порядок скриптов подключён ну и тд смотреть.

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

newjey Proficient

newjey

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

Фото вставляется в редактор и имеет такой вид в коде: <p><img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAUDBAQEAwUEBAQFBQUGBwwIBwcHBw8LCwkMEQ8SEhEPERETFhwXExQaFRERGCEYGh0dHx8fExciJCIeJBweHx7/2wBDAQUFBQcGBw4ICA==" data-filename="Krauff-26-178-029.jpg" style="width: 500px;"></p>

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

newjey Proficient

newjey

Опубліковано:
  • Автор
Опубліковано: (змінено)
  В 15.07.2020 в 10:32, retterwien сказав:

Версии jquery не совместимы, не правильно порядок скриптов подключён ну и тд смотреть.

Expand  

Как правильно все подключить? Что оставить и что убрать? 

<script type="text/javascript" src="view/javascript/jquery/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="view/javascript/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="view/javascript/summernote/summernote.js"></script>

<script src="view/javascript/summernote/lang/summernote-<?php echo $lang; ?>.js"></script>
<!-- include libraries(jQuery, bootstrap) -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

<!-- include summernote css/js -->
<link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.js"></script>

<link href="view/stylesheet/bootstrap.css" type="text/css" rel="stylesheet" />
<link href="view/javascript/font-awesome/css/font-awesome.min.css" type="text/css" rel="stylesheet" />
<link href="view/javascript/summernote/summernote.css" rel="stylesheet" />
<script src="view/javascript/jquery/datetimepicker/moment.js" type="text/javascript"></script>
<script src="view/javascript/jquery/datetimepicker/locale/<?php echo $code; ?>.js" type="text/javascript"></script>
<script src="view/javascript/jquery/datetimepicker/bootstrap-datetimepicker.min.js" type="text/javascript"></script>
<link href="view/javascript/jquery/datetimepicker/bootstrap-datetimepicker.min.css" type="text/css" rel="stylesheet" media="screen" />
<link type="text/css" href="view/stylesheet/stylesheet.css" rel="stylesheet" media="screen" />
<script type="text/javascript" src="view/javascript/summernote/opencart.js"></script>

 

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

newjey Proficient

newjey

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

Первую фото вставляет, а вторую уже нет (не сохраняет) при этом в фронтенде выводит маленький квадратик со знаком вопроса вместо второй фото.

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

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

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

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

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

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

Вхід

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

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

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

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

Покупцям

Розробникам

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

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

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

Important Information

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

  Я даю згоду