JOOMLABC.RU

доступно о Joomla!

Популярные расширения

JCE MediaBox: создаем поп-ап окна и галереи на сайте

Оцените материал
(4 голосов)

В этой статье:

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

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

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

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

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

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

Создание всплывающих окон для Joomla Создание всплывающих окон для JoomlaСоздание всплывающих окон в редакторе JCE

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

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

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

Создание всплывающих окон с помощью редактора JCE

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

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

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

Создание всплывающих окон на сайте

 

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

file-download-jce

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

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

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

plg jcemediabox 

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

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

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

Создание всплывающих окон на сайте

Понравился материал? Поделитесь с друзьями!

Дополнительная информация

  • Автор: Ryan Demmer
  • Сайт разработчика: http://http://www.joomlacontenteditor.net
  • Версия компонента: 2.3.4.4
  • Дата выхода: Четверг, 12 Декабрь 2013
  • Язык: русский, английский, французский, немецкий
  • Совместимость: Joomla2.5, Joomla3
Последнее изменение Вторник, 16 Декабрь 2014 12:14
Другие материалы в этой категории: « Редактор JCE скачать бесплатно

Комментарии   

 
Александр
0 # Александр 18.07.2012 17:03
Подскажите, а как сделать всплывающим окном карту проезда, созданую из Яндекс карт?
Ответить | Ответить с цитатой | Цитировать
 
 
Наталья Федорова
-1 # Наталья Федорова 18.07.2012 19:13
Александр, у меня на сайте есть статья о карте от Гугл. Называется плагин Googlemaps. Прочитайте внимательно! Там есть возможность сделать карту в лайт- боксе. Это принципиально, карта от Яндекс? Если не получится, пишите!
Ответить | Ответить с цитатой | Цитировать
 
 
Тимур
0 # Тимур 16.11.2013 02:09
Подскажите как сделать чтобы на всех страничках всплывала картинка-текст. автоматически без нажатий на какую либо ссылку. как у вас на данной странице ?
Ответить | Ответить с цитатой | Цитировать
 
 
Наталья
0 # Наталья 16.11.2013 14:18
Если вы хотите вставить форму подписки от Смартреспондера , то у него есть спец. компонент для Джумлы.
Ответить | Ответить с цитатой | Цитировать
 
 
Тимур
0 # Тимур 16.11.2013 18:31
Я решил по другому. создал картинку преминил к ней все ваши настройки вашего учебного материала указал выдуманный id. затем уменьшил картинку и вставил html в футор - модуль где нужно чтобы это объявление выводилось. искал эту инфу но негде не нашел. Админу сайта joomlabc.ru респект уважуха быстро отреагировал на мой комент. это значит что сайт живой.
Ответить | Ответить с цитатой | Цитировать
 
 
Вебмастер
0 # Вебмастер 18.11.2014 21:33
Как сделать, чтобы страница чужого сайта открывалась внутри шаблона страницы нашего сайта? Уважаемые коллеги, прошу подсказать - требуется, чтобы страница чужого сайта по ссылке открывалась внутри шаблона страницы нашего сайта, как это сделано, например тут: http://www.geocam.ru/north_america/united_states/ely/webcam1678_black_bear_jewels_den_webcam.html
Ответить | Ответить с цитатой | Цитировать
 

Добавить комментарий


Защитный код
Обновить

Подписка на обновления блога по эл.почте

Ваш эл. адрес:

Присоединяйтесь к нам!

Мы в социальных сетях.
Вы здесь: Главная Joomla Редактор JCE JCE MediaBox: создаем поп-ап окна и галереи на сайте