Добавление кнопок в редактор

[Атаман 422]

пытаося установить плагин в редактор https://ckeditor.com/cke4/addon/imagepaste но он не отобразился, и понял что версия не подходит... как его правильно удалить?

[Zero108 117]

/applications/core/interface/ckeditor/ckeditor/plugins

[Атаман 422]

Да я тоже так сделал. А этого достаточно?

[Zero108 117]

Без понятия, что он там в базу данных успел прописать.

[DarthOld 3]

Собственно про добавление кнопок.

 

Версия ИПС 4.3. В редакторе есть кнопка "добавить кнопку". Рекомендует брать плагины с сайта CKEditor.

 

Кто то пробовал разобраться? Я уже с десяток перепробовал, они все конфликтуют где то (( в консоли ошибки яваскрипт. Може сикрет какой то есть?

[siv1987 2,560]

Какие именно плагины? Не факт еще что они пройдут фильтры парсера форума.

[DarthOld 3]

Например вот интересный - https://ckeditor.com/cke4/addon/imgur

 

Он ставится через админку - кнопки редактора - добавить кнопку - плагин - файл плагина.

 

Кнопка в редакторе появляется! Но требует добавить имгурАйДи куда то в файл, но такого адреса куда он посылает у меня нет... *(

 

Он пишет добить Айди в ...ассетс\яваскрипт\СКедитор\конфиг - но таких папок нет у нас...

Edited December 17, 2018 by DarthOld

[siv1987 2,560]

How to add an Imgur upload button in the editor

 

 

1.

 

Create an Imgur account, and then register an application here: https://api.imgur.com/oauth2/addclient

 

Now you have a client ID, which is to be used in the Imgur plugin we add to the editor.

 

 

2.

 

Download the Imgur plugin from http://ckeditor.com/addon/imgur

 

Go to your ACP-> Customization-> Editor--> Toolbars-> "Add Button". Upload the plugin file(zip) for installation.

 

By now you can drag the button to the toolbar for it to show, but it won't function just yet.

 

 

3.

 

Connect to your FTP-> Edit file: applications/core/interface/ckeditor/ckeditor/config.js

 

Add the settings in the end of the file (remember to use your Client ID number):

 

CKEDITOR.editorConfig = function( config ) {
   config.extraPlugins = 'imgur';
   config.imgurClientId = '123535ae12372d4';
};

Save & upload, done.

[siv1987 2,560]

в редакторе появляется! Но требует добавить имгурАйДи куда то в файл, но такого адреса куда он посылает у меня нет... *(

 

Он пишет добить Айди в ...ассетс\яваскрипт\СКедитор\конфиг - но таких папок нет у нас...

Если посмотреть внимательнее, во втором сообщение темы есть адрес где находится файл с настоойками ckeditor в IPS4.

[DarthOld 3]

Или я не правильно клиент айди вставил или что...

Но у меня не работает (

 

В консоли ошибки:

Uncaught TypeError: Cannot read property '$' of null
   at c.<anonymous> (/forum/applications/core/interface/ckeditor/ckeditor/plugins/imgur/plugin.js?t=I8HL:17)
   at c.f (ckeditor.js:10)
   at c.<anonymous> (ckeditor.js:11)
   at c.window.CKEDITOR.window.CKEDITOR.dom.CKEDITOR.editor.CKEDITOR.editor.fire (ckeditor.js:13)
   at c.fireOnce (ckeditor.js:12)
   at c.window.CKEDITOR.window.CKEDITOR.dom.CKEDITOR.editor.CKEDITOR.editor.fireOnce (ckeditor.js:13)
   at c.<anonymous> (ckeditor.js:334)
   at ckeditor.js:340
VM470 &page=28&tab=comments:1 Failed to load https://api.imgur.com/3/image: Request header field X-Requested-With is not allowed by Access-Control-Allow-Headers in preflight response.
/forum/index.php?/topic/7416-sprashivayte-otvechaem/&page=28&tab=comments#comment-1475708:1 Uncaught SyntaxError: Unexpected token u in JSON at position 0
   at JSON.parse (<anonymous>)
   at Function.n.parseJSON (root_library.js.165ba8e8b50e1c473b2a794e0cbfe698.js:2)
   at Object.<anonymous> (/forum/applications/core/interface/ckeditor/ckeditor/plugins/imgur/plugin.js?t=I8HL:52)
   at i (root_library.js.165ba8e8b50e1c473b2a794e0cbfe698.js:2)
   at Object.fireWith [as rejectWith] (root_library.js.165ba8e8b50e1c473b2a794e0cbfe698.js:2)
   at z (root_library.js.165ba8e8b50e1c473b2a794e0cbfe698.js:2)
   at XMLHttpRequest.<anonymous> (root_library.js.165ba8e8b50e1c473b2a794e0cbfe698.js:2)
VM470 &page=28&tab=comments:1 Failed to load https://api.imgur.com/3/image: Request header field X-Requested-With is not allowed by Access-Control-Allow-Headers in preflight response.
VM470 &page=28&tab=comments:1 Uncaught SyntaxError: Unexpected token u in JSON at position 0
   at JSON.parse (<anonymous>)
   at Function.n.parseJSON (root_library.js.165ba8e8b50e1c473b2a794e0cbfe698.js?v=4e52a1ea3c:2)
   at Object.<anonymous> (plugin.js?t=I8HL:52)
   at i (root_library.js.165ba8e8b50e1c473b2a794e0cbfe698.js?v=4e52a1ea3c:2)
   at Object.fireWith [as rejectWith] (root_library.js.165ba8e8b50e1c473b2a794e0cbfe698.js?v=4e52a1ea3c:2)
   at z (root_library.js.165ba8e8b50e1c473b2a794e0cbfe698.js?v=4e52a1ea3c:2)
   at XMLHttpRequest.<anonymous> (root_library.js.165ba8e8b50e1c473b2a794e0cbfe698.js?v=4e52a1ea3c:2)

Edited December 17, 2018 by DarthOld

[siv1987 2,560]

На удивление плагин прост до безобразия. И вопреки моим ожиданием, он у меня заработал даже на локалхосте с версией форума 4.1.

 

Попробуйте зарегистрировать приложение с опцией Authorization type - Anonymous usage without user authorization. На следующем шаге вы получите ключи Client ID и Client Secret. В конфигах ckeditor нужно вписать именно Client ID. После обновите пару раз страницу темы используя CTRL+F5 для сброса старого кеша браузера.

 

Если все сделали правильно особых проблем быть не должно, ибо запрос для загрузки анонимных изображений очень простой и требует только один параметр Authorization: Client-ID {{clientId}}, который можно использовать с любого хоста.

 

curl --location --request POST "https://api.imgur.com/3/image" \
 --header "Authorization: Client-ID {{clientId}}" \
 --form "image=R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"

[DarthOld 3]

Вот такой получается конфиг.

 

/*
Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
For licensing, see https://ckeditor.com/legal/ckeditor-oss-license
*/
CKEDITOR.editorConfig=function(a){a.toolbarGroups=[{name:"document",groups:["mode","document","doctools"]},{name:"clipboard",groups:["clipboard","undo"]},{name:"editing",groups:["find","selection","spellchecker"]},{name:"forms"},{name:"basicstyles",groups:["basicstyles","cleanup"]},{name:"paragraph",groups:["list","indent","blocks","align","bidi"]},{name:"links"},{name:"insert"},{name:"styles"},{name:"colors"},{name:"tools"},{name:"others"},{name:"about"}];a.removeButtons="Cut,Copy,Paste,Undo,Redo,Anchor,Underline,Strike,Subscript,Superscript";
a.removeDialogTabs="link:advanced"};

CKEDITOR.editorConfig = function( config ) {
   config.extraPlugins = 'imgur';
   config.imgurClientId = '4af938a84c3a9f6';
};

 

И вот что пишет потом в консоли:

Uncaught TypeError: Cannot read property '$' of null
   at c.<anonymous> (plugin.js?t=I8HL:17)
   at c.f (ckeditor.js?v=4e52a1ea3c:10)
   at c.<anonymous> (ckeditor.js?v=4e52a1ea3c:11)
   at c.window.CKEDITOR.window.CKEDITOR.dom.CKEDITOR.editor.CKEDITOR.editor.fire (ckeditor.js?v=4e52a1ea3c:13)
   at c.fireOnce (ckeditor.js?v=4e52a1ea3c:12)
   at c.window.CKEDITOR.window.CKEDITOR.dom.CKEDITOR.editor.CKEDITOR.editor.fireOnce (ckeditor.js?v=4e52a1ea3c:13)
   at c.<anonymous> (ckeditor.js?v=4e52a1ea3c:334)
   at ckeditor.js?v=4e52a1ea3c:340
VM3812:1 [Deprecation] 'webkitURL' is deprecated. Please use 'URL' instead.
(anonymous) @ VM3812:1
The resource https://pagead2.googlesyndication.com/pagead/js/r20181205/r20180604/show_ads_impl.js was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate `as` value and it is preloaded intentionally.
VM3924 &tab=comments:1 Failed to load https://api.imgur.com/3/image: Request header field X-Requested-With is not allowed by Access-Control-Allow-Headers in preflight response.
VM3924 &tab=comments:1 Uncaught SyntaxError: Unexpected token u in JSON at position 0
   at JSON.parse (<anonymous>)
   at Function.n.parseJSON (root_library.js.6481bb546ea36da1d524bf3dc8cf208b.js?v=4e52a1ea3c:2)
   at Object.<anonymous> (plugin.js?t=I8HL:52)
   at i (root_library.js.6481bb546ea36da1d524bf3dc8cf208b.js?v=4e52a1ea3c:2)
   at Object.fireWith [as rejectWith] (root_library.js.6481bb546ea36da1d524bf3dc8cf208b.js?v=4e52a1ea3c:2)
   at z (root_library.js.6481bb546ea36da1d524bf3dc8cf208b.js?v=4e52a1ea3c:2)
   at XMLHttpRequest.<anonymous> (root_library.js.6481bb546ea36da1d524bf3dc8cf208b.js?v=4e52a1ea3c:2)

 

У меня ИПБ 4.3.6...

[siv1987 2,560]

Посмотрел ради интереса что там в IPS 4.3 могло изменится, что этот простой, на первый взгляд плагин перестал работать. И действительно, jquery в этой версии при аджакс запросе добавляет дополнительный заголовок X-Requested-With, который отсутствует в списке разрешенных в ответе сервера и браузер блокирует запрос с ошибкой:

 

Request header field X-Requested-With is not allowed by Access-Control-Allow-Headers in preflight response

Есть костыль который решает эту проблему удаляя заголовок из запроса, но он мне показался слишком топорным, поэтому написал запрос на нативный XMLHttpRequest. Плюс немного изменил логику статуса загрузки изображений.

 

Ловите ваш imgur плагин.

imgur_ips43.zip

[DarthOld 3]

Спасибо огромное!!