1 Тема от pavlexx (2016-01-18 11:27:20 отредактировано pavlexx)

  • pavlexx
  • pavlexx
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-06-26
  • Сообщений: 146

Тема: Lightbox Plugin для GS

Всем доброго времени суток!

Хочу поделиться своим плагином для увеличения изображений по клику и создания простых галерей изображений.
Архив с плагином можно скачать по ссылке.
Устанавливается стандартно, в папку с плагинами. Для работы плагина необходимо подключение библиотеки jQuery!
Плагин основан на js скрипте Lightcase.js

ВАЖНО!!!
Для корректной работы плагина обязательно наличие кода

<?php get_header(); ?>

в секции HEAD и

<?php get_footer(); ?>

после подключения jQuery, а лучше непосредственно перед </body>

Все что от вас требуется - вставить в текст миниатюру изображения (нажав в визуальном редакторе соответствующую кнопку), а плагин сделает все сам!
Причем он будет отслеживать как вставлено изображение:
если это миниатюра - по клику изображение увеличивается, если вставлен оригинал картинки - никакого увеличения не будет!
Если нужно организовать галерею изображений и осуществлять перелистывание картинок - просто вписывайте в поле "Класс CSS" одинаковое слово на английском для группы изображений, например group1...
При заполнении поля "Альтернативный текст" - данная информация будет выводиться в подписи к изображению.

Для стилизации миниатюр используется класс lb-thumbnail.

Если изображения организованы в группу - при увеличении изображения запускается слайдшоу с задержкой 5 сек. Так же можно листать картинки вручную.
Поддерживается управление жестами на мобильных устройствах.

Работу плагина можно посмотреть на тестовом сайте.

При желании вы можете настроить плагин под себя используя API Lightcase.js.

Всем удачи!

UPD: Новая версия плагина!

Поблагодарить за помощь можно через Яндекс!
+ olsv64, 0zz, st_brat

Поделиться

2 Ответ от olsv64

  • olsv64
  • olsv64
  • Администратор
  • Неактивен
  • Откуда: Киров
  • Зарегистрирован: 2013-03-03
  • Сообщений: 3,941

Re: Lightbox Plugin для GS

сейчас мы можем забыть о плагине Fancybox smile

Поддержать GetSimple CMS по-русски ЯДом

Сайт olsv64

Поделиться

3 Ответ от masik

  • masik
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-12-23
  • Сообщений: 91

Re: Lightbox Plugin для GS

Спасибо, pavlexx.
Классный плагин. Гораздо лучше фансибокса.

Есть вопросы:
1. Где находится класс lb-thumbnail?
2. Где настраивается включение-отключение слайдшоу?
3. Где настройка задержки слайдшоу?
4. Можно ли сделать всплывающее окно на весь экран?

С уважением...

Тяжело в учении, а в бою вообще могут убить нафиг.

Поделиться

4 Ответ от pavlexx

  • pavlexx
  • pavlexx
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-06-26
  • Сообщений: 146

Re: Lightbox Plugin для GS

Приветствую!

Я специально написал для тех, кто желает настроить под себя:

При желании вы можете настроить плагин под себя используя API Lightcase.js.

Внимательно читайте пожалуйста!
Про класс lb-thumbnail тоже написано, а если не понятно - посмотрите код на тестовом сайте.
На счет размеров окна - галерея адаптивная, всплывающее окно будет занимать максимально возможную площадь окна браузера! Но если у вас картинка, например, 640*360 как окно может быть во весь экран, это уже будет увеличение больше 100%
Еще раз обращаю внимание на то, что я написал про скрипт (есть ссылка на сайт) на котором основан плагин, не поленитесь, зайдите на сайт и почитайте возможности скрипта!
Если все-таки сами не разберетесь - пишите, буду разжевывать! wink

Поблагодарить за помощь можно через Яндекс!

Поделиться

5 Ответ от pavlexx

  • pavlexx
  • pavlexx
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-06-26
  • Сообщений: 146

Re: Lightbox Plugin для GS

Всем привет!

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

Так что наберитесь терпения! wink

Поблагодарить за помощь можно через Яндекс!

Поделиться

6 Ответ от pavlexx (2016-01-29 19:22:11 отредактировано pavlexx)

  • pavlexx
  • pavlexx
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-06-26
  • Сообщений: 146

Re: Lightbox Plugin для GS

Всем привет!

Представляю новую версию плагина Lightbox!
Скачать архив с плагином можете из официального репозитария GetSimple!

Как я уже писал, новая версия основана на другом скрипте, более функциональном и гибко настраиваемом.
Ссылку на сайт скрипта найдете на странице настроек плагина.

Теперь плагин имеет 35 параметров для настройки!
Реализована многоязычная поддержка (в комплекте английский и русский файл перевода).
На странице настройки плагина имеется вся информация по правильному использованию.
В комплекте плагина имеется исходный файл CSS для того чтобы каждый мог изменить (при желании) стили под себя.

Для стилизации миниатюр на странице используйте CSS класс lb-thumbnail
Можете использовать мои настройки:

.lb-thumbnail {
  display: inline-block;
  max-width: 100%;
  box-sizing: border-box;
  margin: 2px;
  padding: 4px;
  border: 1px solid #ddd;
  background: #fff;
}

a.lb-thumbnail:hover,
a.lb-thumbnail:focus {
  border-color: #aaa;
  background-color: #fff;
  text-decoration: none;
  outline: none;
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16), 0 2px 10px rgba(0, 0, 0, 0.12);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16), 0 2px 10px rgba(0, 0, 0, 0.12);
}

Работу плагина смотрите на тестовом сайте!

Жду отзывов! wink
Всем удачи и успехов!

Поблагодарить за помощь можно через Яндекс!
+ olsv64, 0zz

Поделиться

7 Ответ от 0zz (2016-01-07 17:52:03 отредактировано 0zz)

  • 0zz
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2013-07-22
  • Сообщений: 126

Re: Lightbox Plugin для GS

Могу помочь с переводом на англ.

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

Use Lightbox plugin to show large pictures on thumbnail-click with many options (slideshow, navigation buttons, zoom, download, etc.) and to create simple galleries on a page.

The plugin uses jQuery, so make sure you have a relevant link in your template.

To use plugin simply insert thumbnail via insert-image button on your page editing toolbar. It will automatically show large picture on click.
There are over 30 customisable options in plugin settings available in Admin panel
The  descriptions for available settings are provided as well
Multilanguage support implemented (English and Russian translations available so far, other translations are welcome..)
Demo is available

Your support via Yandex.Money is highly appriciated

.

Поделиться

8 Ответ от usmara

  • usmara
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2015-11-24
  • Сообщений: 16

Re: Lightbox Plugin для GS

добрый день! отличный плагин, спасибо!
вопрос:
jQuery подключается между <?php get_header(); ?> и <?php get_footer(); ?>
а у меня на сайте используется слайдер gst_superslideshow,
который требует подключения jQuery перед <?php get_header(); ?>

мне никак не удастся использовать одновременно эти два плагина?
спасибо!

Поделиться

9 Ответ от pavlexx

  • pavlexx
  • pavlexx
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-06-26
  • Сообщений: 146

Re: Lightbox Plugin для GS

День добрый!

Без проблем, можете подключать jQuery в секции Head!
Самое главное, чтобы jQuery подключался перед вызовом моего плагина.

Поблагодарить за помощь можно через Яндекс!

Поделиться

10 Ответ от usmara

  • usmara
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2015-11-24
  • Сообщений: 16

Re: Lightbox Plugin для GS

вот так работает слайдер, но не работает лайтбокс:
<head>
    <meta charset="utf-8">
    <title><?php get_page_clean_title(); ?> &lt; <?php get_site_name(); ?></title>
    ...
    <script type="text/javascript" src="<?php get_theme_url(); ?>/js/jquery-1.8.3.min.js"></script>
    <?php get_header(); ?>
   ...
     
а вот так работает лайтбокс, но не работает слайдер:
<head>
    <meta charset="utf-8">
    <title><?php get_page_clean_title(); ?> &lt; <?php get_site_name(); ?></title>
    ...
    <?php get_header(); ?>
     <script type="text/javascript" src="<?php get_theme_url(); ?>/js/jquery-1.8.3.min.js"></script>
   ...

Поделиться

11 Ответ от pavlexx (2016-04-18 17:25:31 отредактировано pavlexx)

  • pavlexx
  • pavlexx
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-06-26
  • Сообщений: 146

Re: Lightbox Plugin для GS

Разбирайтесь с подключением, возможно где-то ошибка (на тестовом сайте  <?php get_header(); ?> стоит непосредственно перед </head> и все работает)!
В моем плагине <?php get_header(); ?> нужен для выводя стилей, а код <?php get_footer(); ?>, который лучше разместить непосредственно перед </body>, нужен для выводя скриптов.
Исходя из этого - не важно где вы подключаете jQuery, главное чтобы перед <?php get_footer(); ?>!

А вообще все это расписано на странице настроек плагина, я просто в который раз повторяю здесь! wink

Поблагодарить за помощь можно через Яндекс!

Поделиться

12 Ответ от xenus_86

  • xenus_86
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-11-23
  • Сообщений: 29

Re: Lightbox Plugin для GS

Проблема. Изображение увеличивается, но правая половина картинки остается за экраном.

Поделиться

13 Ответ от xenus_86 (2016-06-23 17:54:53 отредактировано xenus_86)

  • xenus_86
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-11-23
  • Сообщений: 29

Re: Lightbox Plugin для GS

olsv64 пишет:

а вы точно этим плагином пользуетесь?

Абсолютно точно smile. Только:
а) качал его из официального репозитария getsimple.info
б) удалил из архива папку с названием что там макос smile
Плагин работает. Но изображение не центрируется а уходит вправо, причем половина изображения за экраном.
upd// вот это помогло в настройках плагина - Использовать CSS свойство left вместо преобразования. Поставил галку. Почему так?

Поделиться

14 Ответ от pavlexx

  • pavlexx
  • pavlexx
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-06-26
  • Сообщений: 146

Re: Lightbox Plugin для GS

Подскажите на какой теме вы пробуете плагин?
если это Cardinal - то в этой теме для body прописан стиль
text-align:center;
уберите его и все будет нормально работать.

Поблагодарить за помощь можно через Яндекс!

Поделиться

15 Ответ от xenus_86

  • xenus_86
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-11-23
  • Сообщений: 29

Re: Lightbox Plugin для GS

Большое спасибо. Все как вы сказали. Тема Cardinal.

Поделиться

16 Ответ от olsv64

  • olsv64
  • olsv64
  • Администратор
  • Неактивен
  • Откуда: Киров
  • Зарегистрирован: 2013-03-03
  • Сообщений: 3,941

Re: Lightbox Plugin для GS

или скачайте плагин с нашего сайта, там я внес правки smile

Поддержать GetSimple CMS по-русски ЯДом

Сайт olsv64

Поделиться

17 Ответ от xenus_86

  • xenus_86
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-11-23
  • Сообщений: 29

Re: Lightbox Plugin для GS

У меня появились вопросы.
Миниатюры при загрузке страницы не сразу встают на своё место (сначала немного сдвинуты влево). Не критично, конечно, но учитывая что все остальное сразу находится там где нужно, неприятно.
При помощи этого плагина можно организовать открытие модального окна?

Поделиться

18 Ответ от pavlexx (2016-06-25 02:29:17 отредактировано pavlexx)

  • pavlexx
  • pavlexx
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-06-26
  • Сообщений: 146

Re: Lightbox Plugin для GS

Не совсем понятно о чем вы говорите!
Приведите пример, дайте ссылку на ваш сайт.
Возможно где-то не правильная верстка или стили.
На моем тестовом сайте, как вы видите, все ОК. Нет никакого сдвига.

Поблагодарить за помощь можно через Яндекс!

Поделиться

19 Ответ от xenus_86

  • xenus_86
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-11-23
  • Сообщений: 29

Re: Lightbox Plugin для GS

http://avlider.ru/test не реклама)

Поделиться

20 Ответ от pavlexx (2016-06-25 17:36:26 отредактировано pavlexx)

  • pavlexx
  • pavlexx
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-06-26
  • Сообщений: 146

Re: Lightbox Plugin для GS

Не вижу в чем проблема!?

Поблагодарить за помощь можно через Яндекс!

Поделиться

21 Ответ от xenus_86

  • xenus_86
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-11-23
  • Сообщений: 29

Re: Lightbox Plugin для GS

Миниатюры при загрузке страницы позиционируется на сразу там где нужно. Это немного заметно. У вас я такого эффекта не увидел. В вашем демо какой-то "прелоад" используется. Т.е. страница показывается уже готовой.

Поделиться

22 Ответ от pavlexx

  • pavlexx
  • pavlexx
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-06-26
  • Сообщений: 146

Re: Lightbox Plugin для GS

Так и у вас на сайте я ничего подобного не вижу! wink

Поблагодарить за помощь можно через Яндекс!

Поделиться

23 Ответ от pavlexx

  • pavlexx
  • pavlexx
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2014-06-26
  • Сообщений: 146

Re: Lightbox Plugin для GS

Очередное обновление:
- обновлен скрипт до версии 1.2.21
- теперь для группы изображений название должно обязательно начинаться с "group", например: group1, group2 или group-image, group-gallery1...
Сделано это для того, чтобы можно было задавать свои классы для изображений, а группировка осуществлялась только по имени, начинающегося с "group".

Новую версию плагина скачивайте с оф. сайта GetSimple!

Поблагодарить за помощь можно через Яндекс!

Поделиться

24 Ответ от vadim.snz

  • vadim.snz
  • Пользователь
  • Неактивен
  • Зарегистрирован: 2015-10-10
  • Сообщений: 35

Re: Lightbox Plugin для GS

Здравствуйте. Спасибо за плагин. Возникла проблема, не работает. Что сделано:
1. С оф. сайта JQuery.com скачан файл jquery-3.1.0.min.js. Помещен в папку js
2. Плагин скачан, установлен и включен. GetSimple версия    3.3.7
3. В шаблоне после <head> вставлен <script type='text/javascript' src='js/jquery-3.1.0.min.js'></script>
4. <?php get_header(); ?> и <?php get_footer(); ?> находятся на положенных местах.
5. На странице в редакторе жмем "Вставить изображение", выбираем файл на сервере, указываем размеры миниатюры (например 50*50, нормальный размер, естественно, больше).
6. На странице в режиме просмотра видим картинку в размерах 50*50, при наведении курсора ничего не происходит.

Поделиться

25 Ответ от olsv64

  • olsv64
  • olsv64
  • Администратор
  • Неактивен
  • Откуда: Киров
  • Зарегистрирован: 2013-03-03
  • Сообщений: 3,941

Re: Lightbox Plugin для GS

скорее всего вы выбрали не миниатюру, генерируемую CMS, а полное изображение.
нужно выбирать http://prntscr.com/bvapyn

Поддержать GetSimple CMS по-русски ЯДом
+ vadim.snz

Сайт olsv64

Поделиться