- Joomla sigplus
- Налаштування плагіна sigplus
- Галерея в матеріалі Joomla
- Додавання підпису і опису до зображень
- Слайд шоу
- Водяний знак
- одне зображення
- Схожі матеріали
- Тип - безкоштовний плагін і модуль галереї Joomla.
- Збільшення зображень з lightbox-ефектом.
- Підтримка різних «движків» (механізмів) спливаючих вікон: Slimbox, prettyPhoto, FancyBox і boxplus. Всього 12 варіантів (можна без анімації) на підставі jQuery і MooTools.
- Ефекти при перемиканні між зображеннями.
- Налаштування макета галереї (виведення мініатюр).
- Підтримка поширених графічних форматів зображень: * .JPG, * .PNG і * .GIF (з і без прозорості).
- Якісна генерація мініатюр з автоматичною обрізкою і центруванням.
- Прогресивна завантаження зображень, яка дозволяє оптимізувати пропускну здатність з'єднання. Завантажуються тільки ті зображення, які показані в галереї в даний момент.
- Можливість вставки необмеженої кількості галерей в матеріал і на сторінку.
- Мультимовні, адаптовані для пошукових систем підписи зображень і опису. Їх можна ставити глобально для всіх зображень або індивідуально для кожного.
- Підтримка RTL-мов (тип писемності справа-наліво).
- Можливість завантаження вихідної версії зображення.
- Обробка мета-даних зображень.
- Витяг IPTC мета-даних із зображень.
- Налаштування відображення зображень в галереї (відступи, межа, прозорість, затримка анімації і так далі).
- Налаштування сортування зображень в галереї (по імені файлу, за датою зміни, випадково і інше).
- Налаштування елементів навігації по галереї у фронтальній частині сайту.
- Підтримка великих галерей (100 і більше зображень в одній галереї).
- «Чистий» CSS і JavaScript код. Дійсний XHTML 1.0 і 1.1. Успішне проходження автоматичної перевірки WCAG v2 AAA (при використанні файлу з підписами).
- Можливість задавати настройки глобально для всіх галерей і змінювати налаштування для конкретної галереї.
- Плагін і модуль переведені на 12 мов, включаючи російську, англійську, німецьку, французьку.
- Підтримка Joomla 1.5-3.х (не всі версії sigplus).
- Кешування мініатюр.
- Можливість завдання ступеня стиснення (якості) створюваних мініатюр.
- Можливість показу зображень з іншого домену або піддомену (але з тієї ж файлової системи).
- Можливість змінити «метод» вбудовування галереї в сторінку для оптимізації швидкості завантаження сторінки і усунення помилок. Особливо актуально для великих галерей (100 і більше зображень).
- Можливість завантаження бібліотек по CDN.
- Підтримка обробки зображень за допомогою бібліотек PHP GD або ImageMagick.
- Можливість створення та відновлення резервних копій налаштувань sigplus.
- Можливість показу зображень з альбомів Picasa.
- Додавання водяних знаків на зображення.
- Наявність докладних описів опцій російською мовою і детальної англомовної довідки.
- Плагін (малюнок нижче).
- Розширені можливості пошуку.
- «Simpsons- (45) .jpg» - ім'я файлу зображення, включаючи розширення.
- «|» - роздільник фрагментів синтаксичної конструкції.
- «Гомер» - заголовок зображення (на малюнку нижче №1). Використовується в тезі «alt» (який замінює текст - текст, який буде відображатися замість зображення, якщо воно не загрузилось у користувача).
- «Гомер Сімпсон - глава сімейства Сімпсонів.» - опис зображення і текст підказки (на малюнку нижче №2), що з'являється при наведенні на мініатюру зображення. Використовується в тезі «title». Крім виведення на сторінці для користувачів, можна використовувати в якості опису картинки для пошукових систем (може поліпшити ранжування в пошуку по картинках).
- «Animation = 2000» - швидкість анімації (зміни слайдів) в мілісекундах.
- «Slider = boxplus.transition slider: effect = fade» - тип анімації. Більше прикладів типів анімації можна знайти тут .
- «Watermark = 1» - активація застосування водяного знака.
- «Watermark: position = se» - позиція водяного знака. Справа внизу від англійського (south east - південний схід).
- «Watermark: x = 10» - відступ по горизонталі від найближчого краю зображення.
- «Watermark: y = 40» - відступ по вертикалі від найближчого краю зображення.
- «Width = 100» - ширина мініатюри в пікселях.
- «Height = 100» - висота мініатюри в пікселях.
- «Sigplus / birds2 / IMG_0496.jpg» - шлях до файлу зображення.
У попередніх статтях циклу про галереях Joomla ми вже розглядали такі розширення як RSMediaGallery , Simple Image Gallery і Phoca Gallery . У цій статті розглянемо безкоштовний плагін (і модуль) галереї sigplus (повна назва sigplus Image Gallery Plus). За допомогою плагіна можна вставити галерею і в матеріал Joomla, і в інше місце, де відбувається обробка плагінів вмісту Джуман (наприклад, в VirtueMart, при активації відповідної опції). А модуль може бути розміщений в будь-якій позиції шаблона.
Розширення вельми популярне. В каталог розширень Joomla (JED) воно було додано 13 березня 2010 року. Останнє, на даний момент, оновлення - 12 жовтень 2015. Є версії під Джумла 1.5 - 3.х. Розширення переведено на російську мову, включаючи спливаючі підказки і елементи навігації фронтальної частини сайту. Всього на JED 285 відгуків. Загальний рейтинг - 100 (все крім підтримки (99) оцінено користувачами по максимуму). З огляду на, що плагін sigplus безкоштовний, дрібні невдоволення з боку користувачів щодо підтримки незначні.
В огляді буде брати участь остання, на момент написання статті (28.11.2015), російськомовна версія sigplus 1.4.3.1, Joomla 3.4.5. Буде розглянуто тільки плагін (в матеріалі Joomla), так як модуль володіє аналогічними налаштуваннями.
У цій статті є відео урок по настройки sigplus 1.5 (потрібно почати дивитися відео з 41:07). Також відео є в статті « Покрокова інструкція Joomla (частина 4). Самостійне створення сайту »(Потрібно почати дивитися з 12:48).
Joomla sigplus
Розглянемо основні особливості \ можливості розширення Joomla sigplus.
Раджу ознайомитися з рекомендаціями по іменах файлів зображень і по самим зображень . При використанні в іменах файлів зображень російських букв можуть бути проблеми з відображенням галереї.
Налаштування плагіна sigplus
Налаштування плагіна розділені на дві вкладки.
Всі опції оснащені зрозумілими текстовими підказками російською мовою або їх призначення зрозуміло з опису (не будемо їх розглядати). Для докладного знайомства рекомендую встановити плагін і почати читати \ відчувати кожну його опцію. Поміняли щось, застосували, подивилися результат.
Налаштування sigplus
Опції на вкладці Додаткові параметри (малюнок нижче) також оснащені підказками. В принципі, можна тут нічого не змінювати. Все і так нормально налаштоване. Сюди варто заглянути в разі виникнення проблем або при необхідності оптимізації швидкості роботи плагіна.
sigplus
Для швидкого старту досить просто активувати плагін і перейти в редактор матеріалів Joomla для вставки спеціального коду галереї (малюнок нижче), попередньо закачавши на сервер в папку «images» потрібні Вам фото.
Joomla sigplus
У фігурних дужках, до і після «aleksius-com», укладені відкриває і закриває теги галереї sigplus. Зверніть увагу, що в додаткових параметрах можна змінити саме слово «gallery». Враховуйте, якщо Ви це зробите після розміщення тега з галереями в матеріалах, старі теги галереї перестануть оброблятися, і замість галерей будуть їх текстові значення.
«Aleksius-com» - це ім'я папки з зображеннями, які потрібно виводити в цій галереї. Сама папка «aleksius-com» знаходиться всередині папки «images».
Якщо не змінювати налаштування плагіна за замовчуванням і не додавати додатковими параметрами сам «тег \ замінник» sigplus (про це нижче в статті), то галерея в матеріалі Joomla виглядає так, як показано нижче на малюнку.
Галерея в матеріалі Joomla
При натисканні на мініатюру з'явиться збільшене зображення (малюнок нижче).
збільшене зображення
Галерея в матеріалі Joomla
На сайті розробника sigplus можна знайти дуже-дуже багато корисних матеріалів по тонкій настройці галереї (англійською мовою).
Як швидко і легко вставити галерею в матеріал Joomla, без додаткових налаштувань, ми розглянули вище. Ці дії є обов'язковими для всіх випадків роботи з плагіном sigplus. Розглянемо найкорисніші, на мій погляд, особливості розширеної настройки sigplus.
Зверніть увагу, що для застосування змін в настройках галереї потрібно буде очищати кеш Joomla.
Додавання підпису і опису до зображень
Створіть в папці з зображеннями галереї файл «labels.txt» (без лапок) (його ім'я можна змінити в настройках плагіна). У нього помістіть наступний текст:
Simpsons- (45) .jpg | Гомер | Гомер Сімпсон - глава сімейства Сімпсонів.
Simpsons- (56) .jpg | Барт | Барт Сімпсон - син Гомера і Мардж Сімпсон.
Simpsons- (59) .jpg | Мардж | Мардж Сімпсон - дружина Гомера Сімпсона, мати Барта Сімпсона.
Розглянемо перший рядок:
На малюнку нижче показана ліва нижня частина вікна перегляду збільшеної версії зображення.
опис малюнка
Зверніть увагу, коли якийсь файл зображення не значиться в файлі «labels.txt», але є в папці галереї, він не буде відображатися в галереї.
Для багатомовних сайтів «labels.txt» повинен називатися так: «labels.en-GB.txt», «labels.ru-RU.txt» і так далі. Де «ru-RU» і «en-GB» - тег мови. Попередньо активуйте опцію Багатомовна підтримка в додаткових параметрах плагіна.
Можна зробити так, щоб після натискання на мініатюри зображень не відкривалася збільшені картинки, а відбувався перехід на заданий URL. Для цього в «labels.txt» помістіть посилання (виділено жирним).
Simpsons- (59) .jpg | Мардж | Мардж Сімпсон - дружина Гомера Сімпсона, мати Барта Сімпсона <a href="https://aleksius.com/" target="_blank"> і всієї родини Сімпсонів </a>.
А сам код в редакторі буде такою.
{Gallery lightbox = none} aleksius-com {/ gallery}
Якщо не додавати «lightbox = none», то текст з посиланням з'явиться у спливаючому вікні під зображенням.
Слайд шоу
Для створення слайд-шоу в Joomla sigplus досить розмістити нижче вказаному код в редакторі матеріалів.
{Gallery lightbox = none animation = 2000 slider = boxplus.transition slider: effect = fade} sigplus / buildings {/ gallery}
Водяний знак
Можна налаштувати sigplus на автоматичне додавання водяного знака на зображення. Файл зображення, включаючи його розширення, повинен називатися «watermark.png». Вимоги до файлу: формат PNG з прозорістю, колірна модель RGB.
Якщо помістити файл «watermark.png» в основну папку, яка задана в налаштуваннях галереї. Тоді саме цей водяний знак буде застосовуватися до всіх галереях, де Ви активуєте застосування водяного знака.
Якщо помістити файл «watermark.png» в папку з конкретною галереєю, активувати його застосування, то він буде застосовуватися тільки до зображень цієї галереї і буде показаний в самій галереї.
Якщо помістити файл «watermark.png» в папку «watermark» всередині конкретної галереї, активувати його застосування, то він буде застосовуватися тільки до зображень цієї галереї і не буде показаний в самій галереї.
{Gallery watermark = 1 watermark: position = se watermark: x = 10 watermark: y = 40} sigplus / sonnabend {/ gallery}
одне зображення
Можна розташувати в матеріалі Joomla галерею з одного зображення. Код такий:
{Gallery width = 100 height = 100} sigplus / birds2 / IMG_0496.jpg {/ gallery}
Як бачите, Joomla sigplus вельмифункціональна галерея. Можливо, не вистачає графічного інтерфейсу для спрощення її налаштувань, як наприклад в RSMediaGallery . Але з огляду на те, що sigplus безкоштовний компонент (модуль), це цілком прийнятно.
У наступній статті « Огляд ImageSizer. Збільшення зображення Joomla при натисканні »Ми розглянемо ще одне безкоштовне розширення, яке спрощує роботу із зображеннями.
Схожі матеріали
Корисні посилання: