Номер статті: 19
Плагін для красивої демонстрації зображення. На відміну від "легкого" WP-lightpop. FancyBox for WordPress володіє великими можливостями з налаштування.
Якщо чесно - то мені сподобався цей плагін. У підсумку встановив його на один з проектів.
Якщо коротко, можливості FancyBox for WordPress:
- повністю міняємо дизайн;
- вибираємо анімацію (швидкість, звідки буде вилітати і куди повертатися);
- вибираємо розміри, з яким буде з'являтися;
- є можливість проходження за прокруткою;
- підключення галереї;
- та інше.
Подивитися, як працює плагін на стандартних налаштуваннях можете Тут.
Качаємо плагін з офіційного репозиторію по посиланню в кінці статті і встановлюємо. До слова: кращі плагіни WordPress розташовуються саме там. Хто не знає як встановити, читаємо Інструкція по установці плагіна WordPress. Все що залишиться зробити, це активувати FancyBox.
Головне, щоб ваша картинка була обгорнута посиланням на саму себе. Тобто вона стояла в тезі:
картинка
Якщо ж ви хочете налаштувати плагін під дизайн свого сайту, то у вас всі карти на руках. Йдемо Налаштування (Параметри) - Fancybox for WP. Далі пропоную Вам вільний переклад від мене:
1. Закладка Appearance Settings (basic)
- Show Border (default: off) - показувати рамку, або ні (за замовчуванням відключена);
- HTML color of the border (default: #BBBBBB) - колір рамки (за замовчуванням #BBBBBB);
- Show Close button (default: on) - показувати, чи ні, кнопку Закрити (за замовчуванням включена);
- Close button position - вибираємо з якого боку буде розташована кнопка Закрити;
- HTML color of the padding (default: #FFFFFF) - вибираємо колір для внутрішнього відступу картинки (за замовчуванням білий). Простими словами - колір рамки від зовнішнього контуру до картинки;
- Padding size in pixels (default: 10) - встановлюємо розмір відступу від зовнішньої рамки до картинки;
- Overlay Options - настройки накладення, заднього затемненого тла (тут все, як в попередніх пунктах);
- Show Title - показувати чи ні назва картинки (за замовчуванням включено).
2. Закладка Animation Settings (basic)
- Zoom Options - настройки наближення;
- Change content transparency during zoom animations (default: on) - Зміна прозорості анімації під час наближення;
- далі 3 пункту з налаштування часу появи і зникання при наближенні, а так же час при навігації по галереї (час переходу між картинками);
- Easing - тут ми вибираємо з представлених 30 шаблонів анімації для появи і зникання картинки.
3. Закладка Behavior Settings (medium)
- Auto Resize to Fit - автоматично зробить зображення потрібного розміру, щоб влазив у вікно монітора (за замовчуванням включено);
- Center on Scroll - утримувати зображення в центрі монітора під час переміщення або немає (за замовчуванням включено);
- Close on Content Click - закрити зображення, при натисканні мишею на зображенні (за замовчуванням вимкнено);
- Close on Overlay Click - закривати картинку, при натисканні мишкою по затемненому фону чи ні (за замовчуванням включено);
- Close with "Esc" - закривати картинку після натискання ESC чи ні (за замовчуванням включено).
4. Закладка Gallery Type
- Make a gallery for all images on the page (default) - робимо галерею для всіх зображень поста (за замовчуванням);
- Do not group images in gallery automatically (use this if you want to make galleries manually with the REL attribute) - Чи не групувати зображення в галереї автоматично (робиться вручну, із застосуванням атрибуту REL);
- Make a gallery for each post (will only work if your theme uses class = "post" on each post, which is common in WordPress) - зробити галерею для кожної статті (буде працювати тільки якщо ваша тема використовує class = "post" в кожній статті, який є загальним в WordPress);
- Use a custom expression to apply FancyBox - використовувати призначені для користувача настройки для галереї FancyBox.
Далі закладки, що відповідають за зв'язок з програмістом і видаленням плагіна. Так само тут ми знайдемо настройки для профільних сайтів, наприклад всіляких фотостудій або фотохостингів. Для 99,9% сайтів дані настройки не знадобляться і будуть встановлені за замовчуванням.
Якщо все перераховане Вам сподобалося, то качаємо і встановлюємо.
Необхідна версія WP: 2.8 або вище
Розглянута версія плагіна: 2.9
завантажити плагін
Всім позитивного настрою і не боятися труднощів. Муза статті.
Вітання. Мене звуть Віталік.
Віддячити Z888279575784 R109400923968 або ЯД 41001651742138
Мої контакти. Я в Twitter @mojWP. Дивись на Youtube. Читай RSS блогу.
Тобто ми обертаємо картинку на заслання, на саму себе. Притому на сайті буде розміром менше (наприклад постер Залізна людина 3 - тут я сам вибрав розмір), а при кліці розкриється в повному розмірі. Пробуйте. Тільки на власному досвіді можна навчитися. В крайньому випадку - тікети на сайті.
Довго мучився, але не заробив у мене це плагін. 🙁
Поставив Некстген-галерею, цей відразу пішов.
- перевірте версію wp.
- так само перевірте, що не варті інші плагіни галерей, тому що може конфліктувати.
- якщо працює плагін кеша, то спробуйте його відключити на час і протестувати Fancy.
- Якщо все це не допомагає, то в налаштуваннях плагіна FancyBox в закладці Troubleshooting поставити галочку навпроти Do not call jQuery.
Всім привіт!
Адміну респект, ми з ним тільки що спілкувалися на іншій сторінці.
якщо правильно зрозумів, то потрібно, щоб на сторінці була картинка 500 * n пікселів, а при відкритті оригінальний розмір. При цьому все зробити гармонійно по сторінці + зменшити швидкість завантаження сторінки, за рахунок меншого "ваги" картинок (коли їх багато, це істотно скорочує час завантаження).
Робиться так:
1. Беремо картинку А і робимо її дублікат.
2. Дублікат картинки А робимо розміру 500 * n (Photoshop, або IrfanView)
3. Закачуємо на сторінку картинку А розміром 500 * n і картинку А оригінального розміру.
4. У статті розміщуємо картинку А 500 * n і обертаємо її на заслання на картинку А оригінального розміру.
Що ми маємо за підсумком:
1. На сторінці все виглядає гармонійно, тому що вибираємо потрібний розмір картинки.
2. При кліці на копію відкривається оригінал (не губиться якість для відвідувача / клієнта)
3. Швидкість завантаження сторінки в рази вище, тому що відразу завантажуються зменшені копії, а "важкий" оригінал тільки за бажанням відвідувача. Позитивно для пошукових систем.
Якщо я не правильно зрозумів проблему, то відпишіть на пошту, або через форму зворотного зв'язку (праворуч на сайті плаваюче віконце)
Віталій, здрастуйте! Дякую за статтю! Мені подобається, як плагін FancyBox виводить картинки на сайті. Але коли в фотогалереї більше сотні фото, то змінювати розмір кожного фото при вставці на сайт просто нереально. Додатково поставила NextGEN Gallery, але два ці плагіна не уживаються, при кліці фото відкриваються двічі і в FancyBox і в NextGEN Gallery. Не можу вирішити цю проблему. Якщо прибрати FancyBox, то поодинокі фото в постах відкриваються в новому вікні браузера, а мене це не устраівает.Подскажіте, будь ласка, що можна зробити?
Добрий.
Не понял: навіщо ви змінюєте розмір?
Два плагіна і не уживуться, тому що кожен буде тягнути ковдру на себе. Як їх два об'єднати в один - не підкажу.
Чи не підкажу звідси. Десь у вас код перехрещується з шаблоном. Перевірте файл functions.php, а також спробуйте повідключали плагіни.
Доброго дня. Встановив цей плагін. З головної сторінки картинки відкриваються як потрібно, а ось якщо зайти вже в статтю і клацнути на картинку, то вона відкривається на весь екран. Підкажіть вихід із ситуації.
Добрий.
Так з ходу не підкажу, не бачачи зсередини проблему. Спробуйте настройки плагіна скинути.
Може бути конфлікт jQuery. Вимкніть його в плагін, а потім спробуйте відключити в шаблоні підключений.
Так само можуть інші плагіни конфліктувати. Потрібно все перевіряти
WP-R.ru Магазин WordPress
Преміальні плагіни і шаблони для CMS WordPress. Прокачай свій сайт. WMSN.ru Рідер RSS-стрічок
Стеж за виходом нових статей на популярних блогах вебмастер / SEO в одному місці.
Як просувати рубрику WordPress - інструкція та практичні поради щодо оптимізації. Для Вебстудіо і розробників - кілька корисних хаков для популяризації вашого бренду. Вся правда про хостинг Beget - мій відгук на його роботу і функціонал виходячи з досвіду. Як заробляти на download-трафив - ділюся своїм багаторічним досвідом і даю підказки.
Мої безкоштовні плагіни
Я використовую і раджу
SEO плагін WordPress
Рекомендую для максимальної настройки свого сайту під SEO-вимоги.
Мій надійний хостинг, перевірений за роки роботи. Рекомендую.