Лайтбокс с фотографией

Как сделать лайтбокс с фотографиями Lightbox foto фото


Здравствуйте !

Прочитав данную статью, вы узнаете – что такое Лайтбокс, и как его сделать. Лайтбокс – это специальное окно для просмотра фотографий, при открытии фотографии, окно с фотографией выводится на передний план, а все остальные объекты на экране компьютера затемняются, чтобы не отвлекать ваше внимание. Итак, создавать лайтбокс мы будем с помощью плагина – Shortcodes Ultimate, с помощью данного плагина можно создать не только лайтбокс, но и множество других функций и элементов для вашего Сайта.

О том, как установить и настроить данный плагин, а также как с ним работать, я уже писал, можете прочесть – ЗДЕСЬ !  ничего сложного там нету. Ну а если вы уже установили плагин, и узнали как с ним работать, тогда двигаемся дальше, и приступаем к созданию лайтбокса.

 

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

27-05-2015 21-03-21

 

 

Затем вам нужно выбрать функцию Слайдер.

23-06-2015 12-19-06

 

 

Лайтбокс мы будем делать с помощью слайдера, в самом плагине есть и функция лайтбокс, но там можно вставить только одно фото, поэтому мы воспользуемся слайдером. Итак после нажатия на вкладку Слайдер, у вас откроется окно для настройки функций.

23-06-2015 12-27-07

 

Теперь рассмотрим настройки:

 

Источник, здесь нужно выбрать источник из которого будут браться изображения, если выбрать медиа библиотеку то вы сами сможете выбрать какие фотографии будут отображаться в лайтбоксе.

Лимит, максимальное допустимое кол-во изображений, относится только к записям и категориям.

Ссылки, здесь указываем Лайтбокс.

Цель ссылок, при значении Лайтбокс, данная функция отключается.

Ширина, укажите ширину изначального изображения, которое будет показываться первым.

Высота, укажите высоту…,

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

Показывать Заголовки, данная функция для Записей.

По центру, можно выровнять по центру.

Стрелки, при значении Лайтбокс, можно отключить стрелки, так как они и так будут в самом лайтбоксе.

Страницы, также можно не включать при лайтбоксе.

Управление колёсиком мыши, это функция для слайдера, при лайтбоксе можно не включайте её.

Автовоспроизведение, чтобы отключить укажите ноль, если отключить, изображения не будут сами перелистываться.

Скорость, можно оставить как есть.

Класс, если не разбираетесь просто не указывайте ничего.

 

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

Конечно с настройками можете поэкспериментировать, к примеру изначально можно сделать Слайдер изображений, при нажатии на который будет открываться Лайтбокс. Либо можно просто отключить все настройки слайдера, и тогда у вас будет показано только изображение, при нажатии на которое будет показан Лайтбокс с изображениями, как в примере в начале записи.

 

А у меня всё на этом, как видите если разобраться, то ничего сложного здесь нет, пробуйте, экспериментируйте и у вас всё получится, до новых встреч ! У вас остались Вопросы ? я жду ваших комментариев ! Кстати, а вы знаете – Как сделать лайтбокс с видео ?

 






info-effect.ru
Как сделать лайтбокс с фотографиями Lightbox foto фото обновлено: Май 16, 2018 автором: Илья Журавлёв

Комментарии

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Нажимая на кнопку Отправить комментарий, вы соглашаетесь с Политикой конфиденциальности и Пользовательским соглашением сайта info-effect.ru



WhatsApp 7 922 717 9869

Политика конфиденциальности - Пользовательское соглашение

Стрелка вверх