Скрипт збільшення картинок при натисканні, плагіни для збільшення картинок на Wordpress, Бізнес блог
Всім привіт дорогі друзі читачі! У цьому уроці я поговорю з вами про те, як зробити на сайті Wordpress збільшення картинки при натисканні курсору на неї.
Розбирати ми будемо два варіанти, для тих, хто хоче зробити це за допомогою скрипта збільшення картинки та плагіна.
Відповідно буде дві частини.
Справа в тому, що при додаванні картинок на сайт, особливо якщо вони великі, WordPress при натисканні мишкою на них відкриває кожну з них у новій вкладці. Це, щиро кажучи, не дуже зручно і не правильно. Оскільки ви створюєте дублі сторінок під назвою attachments (вкладення). Тобто кожна картинка – це окрема сторінка вкладення, що індексується. У нас вони і так добре скануються пошуковими роботами, оскільки папка uploads для індексації у нас відкрита у файлі robots. Сьогодні ми розберемося з цим питанням та підкажемо, як правильно організувати на сайті збільшення картинки при натисканні на блозі вордпрес.
Установка скрипта для збільшення картинок
Почнемо з першого кроку – установки скрипта на сайт. Він дуже легкий, практично нічого не важить і не створить навантаження на ваш блог. Завантажити ви його може за цим посиланням.
Добре заходимо в неї і копіюємо туди всі файли з архіву.
Із цим кроком розібралися і зараз переходимо до наступного етапу.
Додавання коду скрипту на блог
Щоб наш скрипт збільшення картинки при натисканні запрацював, нам потрібно підключити невеликий фрагмент коду шаблон блогу. Для цих цілей я рекомендую скористатися шаблоном підвалу сайту (footer.php). Ось цей код вам потрібно підключити до себе на сайт:
Картинка нижче клікабельна (за допомогою скрипту)
Додавання атрибута для збільшення зображення
Основна частина роботи у нас зроблена і тепер спробуємо вставити новий медіафайл (природно великого розміру).
Вибираємо вже заготовлену картинку на своєму комп'ютері:
Так як вона у нас великого розміру, то задамо їй розмір великої мініатюри і вставимо в запис.
Після вставки зображення нам потрібно перейти в його налаштування, натиснувши на значок олівця.
З'явиться наступне діалогове вікно, куди нам необхідно прописати "Ставлення" до цього зображення. Це буде окреме поле. Туди впишіть слово - simplebox
Далі просто все зберігаєте і у вас у браузері буде все чудово працювати.
Плагін для збільшення картинок на сайті WordPress
У цьому блоці ми розберемо варіант додавання зображень за допомогою плагіна. Погодьтеся, що вручну додавати слово simplebox на картинки це дуже нудно, хоч і ефективно. Якщо плагінів на вашому блозі дуже мало (наприклад, ви створили клієнтський сайт-візитку за послугами), можете сміливо ставити. Навантаження не буде жодного. Перевірено у просуванні клієнтських сайтів 🙂
Є кілька варіантів плагінів. Я докладно розберу один, а насамкінець порекомендую деякі з них.
Мій вибір зупинився на Auto HighSlide.
Процес активації та встановлення плагіна стандартний, розповідати про нього не буду. Після встановлення заходьте в запис, стандартно за прикладом вище додаєте медіафайл, зберігаєте нотатку та дивіться результат у браузері. Одна із змін, яку ви помітите, це поява лупи із плюсиком для збільшення картинки. Ось як таке творіння виглядатиме.
Збоку відмалюнки в нижньому правому куті ви побачите значок збільшення розмірів зображення (тобто його вихідні характеристики).
Інші плагіни для збільшення зображення
Якщо й цим варіантом ви залишилися незадоволені, то нижче рекомендую перелік розширень для wordpress. Застосовуйте та впроваджуйте на своїх блогах будь-який з них.
- FancyBox for WordPress
- jQuery Colorbox
- Image Zoom
На цьому у мене усі друзі. Побачимося у наступних корисних та освітніх випусках!