Супер стильная фото галерея с эффектом живого аккордеона на сайт wordpress !

Сегодня я расскажу как сделать на своём wordpress сайте эффектную и привлекательную фото галерею. Такая галерея хороша тем, что она адаптивная, то есть подойдёт для просмотра на любом устройстве. Так же, вам не нужно открывать изображения, чтобы посмотреть его в полном размере, так как фото будет автоматически показываться в полном размере, за счёт эффекта аккордеона. Фотографии сжимаются и разжимаются по порядку, тем самым образуя живой аккордеон. В настройках можно задать размер галереи, включить или отключить авто перемещение и т.д.

 

 

Плагин — Grid Accordion Lite можно установить прямо из админ-панели wordpress. Перейдите по вкладке: ПлагиныДобавить новый, введите название плагина в форму поиска, нажмите Enter, установите и активируйте плагин.

 

14-12-2015 18-15-04_mini

 

Чтобы настроить галерею, перейдите по вкладке: Grid Accordion. Для добавления изображения в галерею, нажмите на кнопку — Add Panels.

 

14-12-2015 18-22-53_mini

 

Настройки:

Appearance

— Width, ширина галереи.

— Height, высота галереи.

— Columns, сколько колонок в галереи.

— Responsive, адаптивная, под любые устройства.

— Responsive Mode, адаптивный режим.

— Aspect Ratio, соотношение сторон.

— Shadow, тень.

— Panel Distance, расстояние между фото в пикселях.

— Start Panel, пуск панели.

 

Animations

— Opened Panel Width, ширина открытой панели.

— Opened Panel Height, высота открытой панели.

— Max Opened Panel Width, максимальная ширина.

— Max Opened Panel Height, максимальная высота.

— Open Panel On, открытие панели по действию.

— Close Panels On Mouse Out, закрытие панели если нет наведения курсора.

— Mouse Delay, задержка при наведении мыши.

— Open Panel Duration, продолжительность открытой панели.

— Close Panel Duration, продолжительность закрытой панели.

 

Autoplay

— Autoplay, автозапуск.

— Autoplay Delay, задержка перед авто запуском.

 Autoplay Direction, направление автозапуска.

— Autoplay On Hover, автозапуск при колебании.

 

Mouse Wheel

— Mouse Wheel, колесо мыши.

— Mouse Wheel Sensitivity, чувствительность.

 

Keyboard

— Keyboard, клавиатура.

— Keyboard Only On Focus, клавиатура только на фокус.

 

После добавления фотографий и настройки галереи, нажмите на кнопку — Update, чтобы сохранить сделанные изменения. Для того чтобы опубликовать галерею на сайте, перейдите на страницу — All Accordions, скопируйте шорткод и вставьте его на ту страницу, где будет отображаться галерея.

 

14-12-2015 18-47-11

 

Если у вас возникнут вопросы по настройке плагина, то оставьте комментарий к данной записи и я обязательно вам отвечу. До новых встреч !

 


Оцените статью