• Joomla
• php
• Администрирование
• JCE

Как создать всплывающее окно с изображением по текстовой ссылке

Для этого выделяем текст в статье, на который вы хотите сделать ссылку. и нажимаем на кнопочку Добавить/Изменить ссылку в панели инструментов редактора  JCE    Открывается окно редактирования ссылки. Есть 3 закладки:

Закладка "Ссылка"- служит для указания URL адреса изображения или медиаконтента, 

Закладка "Расширенные"- для указания ID изображения, его стиля и класса,

Закладка "Всплывающие окна" - именно в ней мы будем создавать поп-ап окна с изображениями и медиаконтентом.







Для этого в закладке выбираем из выпадающего списка  JCE   MediaBox  Popups, заполняем поля "заглавие" и "название" для  вспывающего окна,

Поле "Группа" пока не заполняем, оно служит для создания фотогалерей, об этом немного ниже.

Поле "Иконка" -надо ли показывать пользователю изображение с маленькой лупой, которая подсказывает пользователю что по ссылке откроется всплывающее окно, выберем Да,



Поле "Позиция иконки" - в каком месте отображать иконку с подсказкой

Поле "Размеры изображения" указываем размеры всплывающего окна, для изображения заполнять необязательно;

Поле "Тип медиа"- указываем какой тип медиа мы хотим отображать во всплывающем окне: внутреннюю ссылку, внешнюю ссылку, в том числе Youtube, Vimeo, IFrame, можно вставить ролик  на Adobe Flash, файлы mp-3, mp-4, Windows Media Player...



 

Итак, подведем итог. Для того, чтобы создать  всплывающее окно с изображением : выделяем текст, кликаем по кнопке  Добавить ссылку в панели инструментов редактора  JCE  , в открывшейся закладке "Ссылка" выбираем нужный файл (изображение или медиаконтент) с помощью кнопки Поиск, попадаем в файловый браузер визуального редактора  JCE  , находим нужное изображение в обозревателе, и нажимаем Вставить. Если вы еще не залили на хостинг нужное изображение, в обозревателе ссылок это сделать легко. Просто нажмите на кнопку "Загрузить" в браузере файлов редактора  JCE  , и затем перетащите нужный файл со своего компьютера на сервер.



Всплывающее окно готово!

Как сделать Lightbox изображение

Для настройки эффекта Lightbox в  JCE  2 следует выполнить следующие действия: в визуальном редакторе  JCE  выделить загруженное мини-изображение и нажать кнопку 

 

В появившемся окне ввести ссылку на полное изображение или найти его в каталоге, нажав Обзор. Аналогично тому, как мы это делали с текстовой ссылкой.

Как сделать галерею изображений с помощью  JCE   MediaBox 

Так же просто можно создать галерею, для этого надо прописать в закладке "Всплывающее окно"  в поле "Группа"  название группы, общее для всех фотографий в этой галерее. После этого можно будет пролистывать фото.