16 июля 2013 в 22:29
Решил привязать Colorbox к изображениям которые добавляю через CKeditor по средствам кнопочки "image" которая вызывает диалоговое окошко где собственно я и определяю ссылку на изображение и другие полезные поля.
По хорошему для правильного вывода изображения в colorbox, после установки модуля достаточно указать класс изображению, но на деле этого не достаточно, потому как этот класс нужно указывать не для изображения а для ссылки, выглядеть правильная конструкция будет так:
<a href="img.jpg" class="colorbox"><img src="img_thumb.jpg"></a>
в маем же случае оригинал минимизируется по средствам css поэтому я вывожу так:
<a href="img.jpg" class="colorbox"><img src="img.jpg"></a>
вся загвоздка в том что в диалогом окне "image" визуального редактора CKeditor, заполнив необходимые поля, чтобы получить нужную конструкцию, я не получу нужный мне результат, так как класс я могу указать только для картинки, но не для ссылки, тем более я использую IMCE как файловый менеджер, мне не подходит решение перейти на модуль insert а так-же у меня отказывается работать модуль image resize filter.
Я просто добавил в файл ckeditor.config.js код который заполняет диалоговое окошко "image" по стандарту:
{
// Take the dialog name and its definition from the event data.
var dialogName = ev.data.name;
var dialogDefinition = ev.data.definition;
// Check if the definition is from the dialog window you are interested in (the "Image" dialog window).
if ( dialogName == 'image' )
{
// Get a reference to the "Image Advanced" tab.
var infoTab = dialogDefinition.getContents( 'advanced' );
var cssField = infoTab.get( 'txtGenClass' );
cssField['default'] = 'colorbox';
var linkTab = dialogDefinition.getContents( 'info' );
var link = linkTab.get( 'txtUrl' );
link['onChange'] = function(evt){
var dialog = CKEDITOR.dialog.getCurrent();
dialog.getContentElement('Link', 'txtUrl').setValue(dialog.getContentElement('info', 'txtUrl').getValue());
}
}
});
Но разумеется конструкция получиться вот такая :
<a href="img.jpg"><img src="img.jpg" class="colorbox"></a>
Я не Java программист, как мне решить эту задачу не знаю, но вся проблема лишь в том, чтобы указать нужный мне класс ссылке.
Кто нибудь помогите, буду безмерно благодарен.
Комментарии
image resize filter
У меня отказывается работать модуль image resize filter, не знаю почему. Хотелось бы какой-то вариант доработки того скрипта для ckeditor.config.js, который заполняет диалоговое окно "image". Кто нибудь точно с этим сталкивался. Надеюсь помогут.
Ну хоть кто-нибудь (((