WordPress.org. Пример интеграции litebox с плагином yfgallery в блог на wordpress
Пример интеграции Litebox с плагином YFGallery в блог на WordPress
Originally published at Личный блог Дмитрия Сажина (www.aidaxo.ru). Please leave any comments there.
Использование расширения Litebox удобно в случае, если вы не можете поместить полноразмерную версию изображения на странице, однако хотите предоставить возможность ее просмотра.
В простейшем случае расширение Litebox состоит из одного файла JavaScript, таблицы стилей CSS и пары картинок.
В этой статье мы рассмотрим, как можно установить расширение Litebox с плагином YFGallery в блог на WordPress. Приступим.
Загрузка Litebox
Скачайте библиотеку Litebox и распакуйте ее в папку вашего блога на WordPress. Путь к конечной папке зависит от диретории, куда установлен WordPress. Например, это может быть папка: «/wp-content/plugins/aidaxo-yfgallery/uploads/litebox». Например, я выбрал легкий скрипт «Litebox JS». Возможно, я включу этот скрипт в дальнейшие сборки плагина.
Проверка корректности путей
Необходимо убедиться, что все пути, используемые в файлах «Litebox JS», работоспособны. Например, пути к картинкам, прописанные в файле CSS.
В CSS файле необходимо изменить пути к файлам с изображениями интерфейса, например:
| 9 | background-image: url(/wp-content/plugins/aidaxo-yfgallery/uploads/litebox/i/thumb-trans.png); |
Подключение файлов скриптов и CSS
Подключить необходимые файлы скриптов и CSS таблиц вы можете несколькими способами. Например, вы можете скорректировать шаблон для конкретной страницы, добавив в него ссылки на требуемые файлы. Я же рассмотрю вариант, когда подключение производится при помощи функционала плагина YFGallery.
В панели администратора перейдите на страницу подключения скриптов: «YFGallery» → «Шаблон шапки».
Установите галку «Включить шаблон шапки». Шаблон шапки, применяется ко всем страницам блога. Если шаблон включен, то указанная в нем информация будет выводиться между тегами на всех страницах блога WordPress. Мы и используем эту возможность для подключения JavaScript и CSS файлов «Litebox JS».
Прописываем в шаблон шапки:
| 1 2 | <script type="text/javascript" src="/wp-content/plugins/aidaxo-yfgallery/uploads/litebox/litebox.js"></script> <link rel="stylesheet" type="text/css" href="/wp-content/plugins/aidaxo-yfgallery/uploads/litebox/litebox.css" /> |
Создание шаблона для отображения
Перейдите на страницу управления шаблонами: «YFGallery» → «Шаблоны»
Установите селектор «Выберите шаблон:» в положение «Создать новый шаблон» и нажмите кнопку «Выберите».
Шаблон будет создан и открыт на редактирование. Шаблон имеет несколько полей:
Имя шаблона
Это имя будет указываться в параметрах ftemplate и atemplate при вызове тега, поэтому пропишем сюда что-то простое типа – «litebox».
Название шаблона
Это имя будет отображаться в списке шаблонов и носит описательный характер. Пропишем «Litebox».
Шапка шаблона
Так как этот шаблон будет использоваться для вывода единичных изображений, то здесь мы ничего не будем указывать.
Тело шаблона
Это самая интересная часть. Здесь будет задано основное форматирование вывода. Под этим полем имеется подсказка по атрибуты, которые можно использовать в шаблоне.
Берем код, который был приведен в примере работы «Litebox JS».
| 1 2 3 | <a href="/images/7.jpg" rel="lightbox" title="Это пример большой картинки"> <img src="/images/7t.jpg" alt="typogenerator" /> </a> |
Из этого кода видно, что необходимо обернуть изображение (<IMG>) ссылкой (<А> с параметром rel=lightbox).
После небольших косметических преобразований мы получаем:
| 1 2 3 4 5 6 | <p> <a href="%articleSizeLink%" rel="lightbox" title="%title%<BR />[ <a href='%originalSizeLink%' alt='Оригинал изображения %title%' title='_blank'>Оригинал</a>| <a href='%linkYandexImagePage%' alt='%title% на Яндексе' title='_blank'>Страница на Яндексе</a>]"> <img src="%previewSizeLink%" alt="%title%" /></a><BR />%title% </p> |
При выводе изображения атрибуты в этом коде будут заменены на данные конкретного изображения. Например, %title% будет содержать заголовок изображения.
Подвал шаблона
На этом подготовительная часть завершена. Пришло время добавить первое изображение с использованием «Litebox JS».
Добавление изображения в запись (страницу или сайдбар)
В примере мы будем добавлять изображение в запись, однако, вы можете добавлять изображения в страницы или области сайдбара.
Добавим новую запись: «Записи» → «Добавить новую»
В поле редактирования содержимого записи впишите код добавления единичного изображения:
| 1 | [yfgallery iduser="ИМЯ" show="single" showtitle="1" idphoto="НОМЕР_ИЗОБРАЖЕНИЯ" psize="M" asize="XL" sort="published" atemplate="litebox"] |
Обратите внимание, что мы указали [... atemplate="litebox"], что дает команду применять наш шаблон «litebox» для вывода данного изображения.
Пример
Тестовый компьютер MSI WIND U100
aidaxo.livejournal.com
Aidaxo YFGallery (Яндекс.Фотки в WordPress)
This plugin will add single photos and photo albums published on Fotki.Yandex.ru Service in posts, pages and sidebar of your blog on WordPress. The plugin gives an opportunity to show images of any size from 75×100 px till original, to define sorting mode of image output, to create personal templates which allow easily to integrate any gallery or litebox scripts into your blog. Built-in XML-Atom data cashing system reduce the load, if your blog is very popular; frendly wizard will insert an interesting album for a few clicks only. Amount of photos and albums downloading to Fotki.Yandex.ru Service is unlimited, the Aidaxo YFGallery plugin will create comfortable and up-to-date media storage for minimum efforts.
Этот плагин позволяет добавлять единичные фотографии и целые альбомы фотографий, размещенные на фотохостинге Яндекс Фотки, в записи, страницы и сайдбар-блоки вашего блога на WordPress. Плагин дает возможность выводить изображения любого размера от 75х100 пикселей до оригинального, определять режим сортировки вывода фотографий, создавать персональные шаблоны, которые позволят легко интегрировать любую галерею или litebox в ваш блог. Встроенная система кэширования XML-Atom данных существенно снижает нагрузку при большой посещаемости страниц вашего блога, а специальный мастер позволит вам вставить интересный альбом за несколько кликов. Так как количество фотографий и альбомов, загружаемых на Fotki.Yandex.ru ограничено только вашими желаниями, то плагин Aidaxo YFGallery позволит создать удобное и современное медиа хранилище без малейших затрат.
YFGallery Plugin Settings Menu in administration panel
General settings section
Template settings section
ru.wordpress.org
Aidaxo YFGallery (Яндекс.Фотки в WordPress)
This plugin will add single photos and photo albums published on Fotki.Yandex.ru Service in posts, pages and sidebar of your blog on WordPress. The plugin gives an opportunity to show images of any size from 75×100 px till original, to define sorting mode of image output, to create personal templates which allow easily to integrate any gallery or litebox scripts into your blog. Built-in XML-Atom data cashing system reduce the load, if your blog is very popular; frendly wizard will insert an interesting album for a few clicks only. Amount of photos and albums downloading to Fotki.Yandex.ru Service is unlimited, the Aidaxo YFGallery plugin will create comfortable and up-to-date media storage for minimum efforts.
Этот плагин позволяет добавлять единичные фотографии и целые альбомы фотографий, размещенные на фотохостинге Яндекс Фотки, в записи, страницы и сайдбар-блоки вашего блога на WordPress. Плагин дает возможность выводить изображения любого размера от 75х100 пикселей до оригинального, определять режим сортировки вывода фотографий, создавать персональные шаблоны, которые позволят легко интегрировать любую галерею или litebox в ваш блог. Встроенная система кэширования XML-Atom данных существенно снижает нагрузку при большой посещаемости страниц вашего блога, а специальный мастер позволит вам вставить интересный альбом за несколько кликов. Так как количество фотографий и альбомов, загружаемых на Fotki.Yandex.ru ограничено только вашими желаниями, то плагин Aidaxo YFGallery позволит создать удобное и современное медиа хранилище без малейших затрат.
- Upload aidaxo-yfgallery.zip to your plugins folder, usually wp-content/plugins/ and unzip the file, it will create a wp-content/plugins/yandex-fotki/ directory.
- Activate the plugin on the plugin screen.
- Go to “YFGallery” section in administration menu of your blog on WordPress.
“Aidaxo YFGallery (Яндекс.Фотки в WordPress)” açık kaynaklı yazılımdır. Aşağıdaki kişiler bu eklentiye katkıda bulunmuşlardır.
Katkıda bulunanlar
tr.wordpress.org
Aidaxo YFGallery (Яндекс.Фотки в WordPress)
This plugin will add single photos and photo albums published on Fotki.Yandex.ru Service in posts, pages and sidebar of your blog on WordPress. The plugin gives an opportunity to show images of any size from 75×100 px till original, to define sorting mode of image output, to create personal templates which allow easily to integrate any gallery or litebox scripts into your blog. Built-in XML-Atom data cashing system reduce the load, if your blog is very popular; frendly wizard will insert an interesting album for a few clicks only. Amount of photos and albums downloading to Fotki.Yandex.ru Service is unlimited, the Aidaxo YFGallery plugin will create comfortable and up-to-date media storage for minimum efforts.
Этот плагин позволяет добавлять единичные фотографии и целые альбомы фотографий, размещенные на фотохостинге Яндекс Фотки, в записи, страницы и сайдбар-блоки вашего блога на WordPress. Плагин дает возможность выводить изображения любого размера от 75х100 пикселей до оригинального, определять режим сортировки вывода фотографий, создавать персональные шаблоны, которые позволят легко интегрировать любую галерею или litebox в ваш блог. Встроенная система кэширования XML-Atom данных существенно снижает нагрузку при большой посещаемости страниц вашего блога, а специальный мастер позволит вам вставить интересный альбом за несколько кликов. Так как количество фотографий и альбомов, загружаемых на Fotki.Yandex.ru ограничено только вашими желаниями, то плагин Aidaxo YFGallery позволит создать удобное и современное медиа хранилище без малейших затрат.
- YFGallery Plugin Settings Menu in administration panel
- General settings section
- Template settings section
en-gb.wordpress.org
Aidaxo YFGallery (Яндекс.Фотки в WordPress)
This plugin will add single photos and photo albums published on Fotki.Yandex.ru Service in posts, pages and sidebar of your blog on WordPress. The plugin gives an opportunity to show images of any size from 75×100 px till original, to define sorting mode of image output, to create personal templates which allow easily to integrate any gallery or litebox scripts into your blog. Built-in XML-Atom data cashing system reduce the load, if your blog is very popular; frendly wizard will insert an interesting album for a few clicks only. Amount of photos and albums downloading to Fotki.Yandex.ru Service is unlimited, the Aidaxo YFGallery plugin will create comfortable and up-to-date media storage for minimum efforts.
Этот плагин позволяет добавлять единичные фотографии и целые альбомы фотографий, размещенные на фотохостинге Яндекс Фотки, в записи, страницы и сайдбар-блоки вашего блога на WordPress. Плагин дает возможность выводить изображения любого размера от 75х100 пикселей до оригинального, определять режим сортировки вывода фотографий, создавать персональные шаблоны, которые позволят легко интегрировать любую галерею или litebox в ваш блог. Встроенная система кэширования XML-Atom данных существенно снижает нагрузку при большой посещаемости страниц вашего блога, а специальный мастер позволит вам вставить интересный альбом за несколько кликов. Так как количество фотографий и альбомов, загружаемых на Fotki.Yandex.ru ограничено только вашими желаниями, то плагин Aidaxo YFGallery позволит создать удобное и современное медиа хранилище без малейших затрат.
- YFGallery Plugin Settings Menu in administration panel
- General settings section
- Template settings section
Shortcode receiving wizard for albums inserting
id.wordpress.org
Aidaxo YFGallery (Яндекс.Фотки в WordPress)
This plugin will add single photos and photo albums published on Fotki.Yandex.ru Service in posts, pages and sidebar of your blog on WordPress. The plugin gives an opportunity to show images of any size from 75×100 px till original, to define sorting mode of image output, to create personal templates which allow easily to integrate any gallery or litebox scripts into your blog. Built-in XML-Atom data cashing system reduce the load, if your blog is very popular; frendly wizard will insert an interesting album for a few clicks only. Amount of photos and albums downloading to Fotki.Yandex.ru Service is unlimited, the Aidaxo YFGallery plugin will create comfortable and up-to-date media storage for minimum efforts.
Этот плагин позволяет добавлять единичные фотографии и целые альбомы фотографий, размещенные на фотохостинге Яндекс Фотки, в записи, страницы и сайдбар-блоки вашего блога на WordPress. Плагин дает возможность выводить изображения любого размера от 75х100 пикселей до оригинального, определять режим сортировки вывода фотографий, создавать персональные шаблоны, которые позволят легко интегрировать любую галерею или litebox в ваш блог. Встроенная система кэширования XML-Atom данных существенно снижает нагрузку при большой посещаемости страниц вашего блога, а специальный мастер позволит вам вставить интересный альбом за несколько кликов. Так как количество фотографий и альбомов, загружаемых на Fotki.Yandex.ru ограничено только вашими желаниями, то плагин Aidaxo YFGallery позволит создать удобное и современное медиа хранилище без малейших затрат.
- YFGallery Plugin Settings Menu in administration panel
- General settings section
- Template settings section
bg.wordpress.org
Aidaxo YFGallery (Яндекс.Фотки в WordPress)
This plugin will add single photos and photo albums published on Fotki.Yandex.ru Service in posts, pages and sidebar of your blog on WordPress. The plugin gives an opportunity to show images of any size from 75×100 px till original, to define sorting mode of image output, to create personal templates which allow easily to integrate any gallery or litebox scripts into your blog. Built-in XML-Atom data cashing system reduce the load, if your blog is very popular; frendly wizard will insert an interesting album for a few clicks only. Amount of photos and albums downloading to Fotki.Yandex.ru Service is unlimited, the Aidaxo YFGallery plugin will create comfortable and up-to-date media storage for minimum efforts.
Этот плагин позволяет добавлять единичные фотографии и целые альбомы фотографий, размещенные на фотохостинге Яндекс Фотки, в записи, страницы и сайдбар-блоки вашего блога на WordPress. Плагин дает возможность выводить изображения любого размера от 75х100 пикселей до оригинального, определять режим сортировки вывода фотографий, создавать персональные шаблоны, которые позволят легко интегрировать любую галерею или litebox в ваш блог. Встроенная система кэширования XML-Atom данных существенно снижает нагрузку при большой посещаемости страниц вашего блога, а специальный мастер позволит вам вставить интересный альбом за несколько кликов. Так как количество фотографий и альбомов, загружаемых на Fotki.Yandex.ru ограничено только вашими желаниями, то плагин Aidaxo YFGallery позволит создать удобное и современное медиа хранилище без малейших затрат.
- YFGallery Plugin Settings Menu in administration panel
- General settings section
- Template settings section
- Shortcode receiving wizard for albums inserting
sr.wordpress.org
