Как сделать адаптивными картинки

Добавлено: 20.03.2018, 10:47 / Просмотров: 82295

Плагины для изображенийТекущее содержимое статьи является обновленной версией старой записи, которая была опубликована 8 лет назад. За это время список плагинов для картинок в Вордпресс стал уже совсем не актуальным, поэтому срочно требовал обновления. Кстати, в блоге есть отдельная метка по wordpress изображениям, где найдете более 40 заметок по данной теме с разными решениями, хаками и руководствами по теме. В этой публикации будут представлены только модули (с кратким описанием). 

Вообще визуальная составляющая для веб-проектов является достаточно важной. В блогах графика в постах считаются неотъемлемой их частью, являются правилом хорошего тона и помогают привлекать внимание читателей. Если говорить о классических сайтах, то здесь кроме оформления плагины картинок в WordPress могут выполнять целый ряд других важных задач: они используются в портфолио, галереях, слайдерах, при создании миниатюр и т.п. Базовые функции системы справляются лишь с некоторыми из этих ситуаций, иногда без дополнительных модулей просто не обойтись.

В блоге уже было несколько узкоспециализированных подборок по плагинам Вордпресс изображений, вот ссылки на них:

В данной статье, как можете видеть из заголовка, собраны лучшие WordPress плагины картинок по разным направлениям — от фотоблогов до создания слайдшоу. Некоторые из них я уже рассматривал, поэтому в кратком описании буду ссылаться на соответствующие детальные обзоры.

NextGEN Gallery

NextGEN Gallery

NextGEN — единственный WordPress модуль изображений из прошлой подборки, что не просто сохранился за 8 лет, но и превратился в один из самых узнаваемых и популярных (его скачали более 1,5млн человек). Начиналось все с простого плагина для создания галереи, но теперь это полноценная система по управлению фотками на вашем сайте, где есть: добавление, группировка, сортировка фото, создание альбомов, миниатюр, импорт мета данных и многое другое.

NextGEN обладает широкой функциональностью, но при этом достаточно прост и понятен в работе через админку. В классической версии содержит 2 варианта галерей (с миниатюрами и через слайдшоу) + 2 типа стилей альбомов со множеством опций: оформление, размеры картинок, эффекты увеличения при просмотре и т.п. В PRO версии разных способов отображения контента еще больше.

BJ Lazy Load

BJ Lazy Load

Он, как и все остальные Lazy Load решения, позволяет ускорить загрузку вашего веб-ресурса. BJ Lazy Load показывает пользователям графику в статьях и дизайне сайта только когда прокрутка экрана до них доберется. В описании сказано, что поскольку данная технология поддерживает в том числе и с iframe, то вставки Vimeo или YouTube также будут обрабатываться. Хотя в подборке плагинов отложенной загрузки изображений есть специальный вариант для видео контента — Lazy Load for Videos (тоже недавно получил обновление).

Flickr Badges Widget

Flickr Badges Widget

Для тех, кто не в курсе Flickr — один из самых древних, крупных и популярных фотохостингов, которым пользуются миллионы людей. Flickr Badges Widget — простой виджет на jQuery, позволяющий отображать в блоге подборки последних или случайных объектов из вашего Flickr аккаунта. Этот модуль картинок в Вордпресс содержит несколько опций настройки, систему табов и даже механизм кэширования. Из подобных решений это самое скачиваемое наряду с Meks Simple Flickr Widget.

Responsive Flickr Slideshow

Responsive Flickr Slideshow

Плагин не особо популярен, но в отличии от других разработок под Flickr, он предлагает плюс-минус нечто необычное. Вы сможете встраивать фото из ваших альбомов и подборок на сайт, демонстрируя их в формате слайдшоу. Реализуется все через специальный шорткод с заданными параметрами. Судя по названию и описанию, есть адаптивность.

Photo Gallery by WD

Photo Gallery by WD

Продвинутая WP галерея со множеством настроек и 100% адаптивностью. В этом Вордпресс модуле к картинкам можно добавлять описания, теги, формировать из них альбомы. В галерее доступны несколько видов отображения: миниатюры, карусель и др. Есть поддержка видео и даже какие-то E-commerce функции для продажи принтов. Последняя и часть других фишек, как я понимаю, доступны в PRO версии, но и без них бесплатный релиз имеет весьма привлекательные возможности.

Responsive Lightbox by dFactory

Responsive Lightbox by dFactory

Данный скрипт позволяет посетителям веб-проекта просматривать увеличенные версии картинок с помощью так называемого Lightbox эффект. Применяется как на отдельных изображениях, так и в галереях — для WordPress графики подключается автоматически. Самое полезное здесь — адаптация под мобильные девайсы. Модуль содержит много разных опций, виджеты, совместим с WooCommerce и Visual Composer. Простой, но функциональный инструмент.

Easy FancyBox

Easy FancyBox

Как и предыдущий, этот WordPress плагин изображений добавляет эффект Lightbox всем JPG, GIF и PNG картинкам на сайте. После установки основные опции найдете в разделе «Настройки». Кроме графики он также срабатывает для: видеоконтента (ссылки на Vimeo, Youtube, Dailmotion), флеш файлов, PDF, iFrames и в некоторых других случаях. Совместим с NextGEN. Также по теме могу упомянуть модуль jQuery Colorbox, что имеет меньше загрузок, но описание у него неплохое.

MetaSlider

MetaSlider

Достаточно функциональное и не сложное в работе решение для внедрения слайдшоу. Выбираете файлы из медиабиблиотеки или просто перетаскиваете их, устанавливаете заголовок, ссылки и другие детали. Возможность добавить линки на фотки — одно из приятных преимуществ (иногда попадаются такие задачи в работе).

Плагин поддерживает 4 разных типа слайдшоу: карусель Flex Slider 2, Nivo Slider с 16 эффектами и 4 темами, максимально легкий Responsive Slides и Coin Slider (первые 3 полностью адаптивны). Работа над модулем активно ведется, в нем много настроек, поддержка мультиязычности и т.п.

Responsive Slider – Image Slider

Responsive Slider – Image Slider – Slideshow for WordPress

Достаточно популярный и мощный плагин Вордпресс изображений для создания слайдера. Вы можете добавлять сколько угодно картинок из своей библиотеки и создавать сразу несколько элементов на странице. Кроме графики допускается использование видео, шорткодов и виджетов. Модуль поддерживает HTML код в заголовке и описании, можете добавление URL линков, есть десятки разных опций, адаптивность. В принципе, по функциям все подобные слайдеры плюс-минус похожи.

Logo Carousel

Logo Carousel

Это один из самых скачиваемых вариантов из подборки слайдеров логотипов, но выбирать подходящее решение нужно зависимости о своих текущих задач. В Logo Carousel есть: возможность добавлять активные ссылки на лого, создание нескольких объектов на странице, использование шорткодов. Из интересных особенностей — эффект, когда изначально изображения отображаются в ЧБ, а при наведении в цвете (работает в современных браузерах).

Carousel Horizontal Posts Content Slider

Carousel Horizontal Posts Content Slider

В данном WordPress плагине картинки не выводятся как отдельные графические элементы, — слайдер содержит записи. Это отличная возможность представить посты в оригинальном виде, демонстрируя, например, последние новости. Кроме миниатюры в Posts Content Slider отображаются заголовок и краткий анонс. Слайдер «дружит» с мобильными устройствами, имеет навигацию, поддерживает виджеты и переводы. Есть десятки опций для его настройки. Весьма интересный модуль, как по мне.

Twenty20 Image Before-After

Twenty20 Image Before-After

Один из плагинов из заметки про создание фото До и После в Вордпресс. Наверняка, вы слышали о таком эффекте. Twenty20 Image Before-After легко интегрируется в статьи через шорткоды либо вставляется через виджет. Интерфейс максимально прост, поддерживается Visual Composer. Картинки получаются адаптивными и доступны на всех устройствах. В описании на официальном сайте есть видео демонстрация настройки и работы.

Instagram Feed

Instagram Feed

Отображает фотки из одного или нескольких открытых Инстаграм аккаунтов либо из фидов. Совмещайте несколько источников в одном блоке. Здесь много разных настроек, поддерживаются полноразмерные фотки, имеется адаптивность. Под блоком фотографий найдете кнопку «загрузить еще», с помощью которой можете обновлять их бесконечное число раз. Есть также кнопка подписки.

Easy Watermark

Easy Watermark

У меня уже был детальный обзор этого Вордпресс модуля картинок для создания водяного знака watermark. Это неплохое функциональное решение я использую в текущем и некоторых других проектах. Не смотря на то, что оно не обновлялось около 2х лет, с новыми версиями системы работает стабильно. Нравится наличие множества фишек, например, допускается создавать водяной знак из текста или jpg / png / gif файлов, имеются настройки прозрачности, расположения watermark`а и т.п.

Auto Post Thumbnail

Auto Post Thumbnail

В блоге есть специальный раздел/тег про WordPress миниатюры — найдете там интересные статьи. Что касается этого модуля, то он автоматически создает Thumbnail из первой картинки в постах или других типах записей (если, конечно, такого элемента у публикации еще нет). Вы также можете сгенерировать миниатюры в уже существующих заметок.

Comment Images Reloaded

Comment Images Reloaded

Этот плагин Вордпресс изображений позволяет добавить загрузку картинок в комментариях от пользователей. В некоторых случаях это пригодится, например, если при задании вопроса на странице тех.поддержки человеку проще продемонстрировать проблему с помощью скриншота.

В настройках Comment Images Reloaded можете указать максимальный вес загружаемого файла, выбрать размер отображаемой графики на сайте, запрещать/разрешать данную функцию для определенных записей и т.п. Дополнительно советую глянуть расширенный обзор модуля загрузки картинок в комментариях — там чуть более детально рассмотрены все его опции.

Related Posts Thumbnails Plugin for WordPress

Related Posts Thumbnails Plugin for WordPress

Также миниатюры пригодятся вам в похожих заметках после статей — это поможет привлечь внимание читателей и к другим публикациям. В настройках задаете число выводимых элементов и выбираете алгоритм отбора схожих записей по категориям, тегам. Кроме фото выводятся анонсы (все, в принципе, традиционно).

Итого

Изначально думал переместить устаревшие Wordpress плагины для изображений из прошлой версии поста в самый конец дабы оставить их, так сказать, для ознакомления. Однако, как оказалось, из 20-ти подобранных в 2010 году, решений доступными оказались лишь 3. Некоторые последний раз редактировались 5-7 лет назад, но добрая их половина просто удалены из репозитория. Вот уж действительно непостоянная судьба у скриптов и модулей.

В дальнейшем данный список плагинов для картинок в Вордпресс обязательно будет пополняться. Я, в принципе, сразу мог разместить их здесь около 30-40 штук, но думаю, лучше будет отобразить из каждой категорий задач по 1-2 самых эффективных варианта. Переходите по дополнительным ссылкам в статье дабы найти остальные модули.

Если вы знаете другие интересные/полезные наработки либо заметили, что какой-то из плагинов перестал работать — пишите в комментариях.


Источник: http://wordpressinside.ru/plugins/4images/


Поделись с друзьями



Рекомендуем посмотреть ещё:


Закрыть ... [X]

Лучшие бесплатные CMS на файлах (движки сайтов без баз данных) Как все буквы сделать прописными


Как сделать адаптивными картинки Как сделать адаптивными картинки Как сделать адаптивными картинки Как сделать адаптивными картинки Как сделать адаптивными картинки Как сделать адаптивными картинки

ШОКИРУЮЩИЕ НОВОСТИ