ГлавнаяПлагиныРедактирование миниатюр в WordPress с помощью плагина Post Thumbnail Editor

Редактирование миниатюр в WordPress с помощью плагина Post Thumbnail Editor

При добавлении миниатюры к записи в WordPress часто возникает ситуация, когда изображение обрезается не так, как нам необходимо. Исправить эту проблему поможет бесплатный плагин Post Thumbnail Editor.

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

Проблема в том, что при автоматическом обрезании, WordPress по умолчанию уменьшает изображение до требуемой минимальной ширины или высоты, затем выравнивает изображение по центру и обрезает края по бокам или сверху и снизу (в зависимости от ориентации изображения). Например (фото — Zach Petersen cc by-sa 2.0):

Пример обрезания изображения в WordPress

Пример обрезания изображения в WordPress

Таким образом при создании миниатюры стандартным образом, наш мост «Золотые Ворота» остался за кадром в левой части. Исправить подобную ситуацию поможет бесплатный плагин Post Thumbnail Editor.

Плагин Post Thumbnail Editor

После установки и активации плагина, вы сможете изменять любые миниатюры при работе с медиатекой WordPress. Для вызова редактора достаточно выбрать изображение и щелкнуть по ссылке «Post Thumbnail Editor»:

Редактор миниатюр в WordPress

Редактор миниатюр в WordPress

В новом окне справа можно выбрать миниатюры, которые вы хотите отредактировать, их может быть несколько, в зависимости от вашей темы и установленных плагинов. После выбора размеров, на оригинале слева необходимо отметить, как именно вы хотите обрезать изображение и нажать на кнопку Crop.

Плагин создаст новые обрезанные изображения и покажет их во вкладке View, где вы сможете проверить результат и сохранить новые миниатюры.

Предварительный просмотр и сохранение миниатюр

Предварительный просмотр и сохранение миниатюр

Если вы совершили ошибку, вы всегда можете вернуться во вкладку Crop и снова обрезать миниатюры используя оригинал изображения.

В качестве альтернативы можно рассмотреть плагин My Eyes Are Up Here, который использует алгоритм распознавания области лица, и с учетом этого корректирует генерируемые миниатюры. Он также позволяет отмечать так называемые «горячие точки», в случае если на изображении лица не обнаружено.

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

Разработчикам

Разработчикам тем и плагинов WordPress будет интересно знать, что начиная с версии 3.9 аргумент $crop функций ядра add_image_size() и set_post_thumbnail_size(), кроме булевых значений может принять также и массив, где можно указать другой вид автоматического обрезания, например слева и сверху:

add_image_size( 'my-image-size', 200, 200, array( 'left', 'top' ) );

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

Сталкивались ли вы с подобными проблемами при автоматическом обрезании изображений в WordPress? Каким образом вам удалось их решить? Оставьте ваше мнение в комментариях или напишите нам в Твиттер.

Подписаться на рассылку

Подписаться → Подпишитесь на бесплатную рассылку журнала WP Magazine и получайте новости, события, подборки тем и плагинов, уроки, советы и многое другое в мире WordPress!

  • MrClon

    В самом WP есть-же функция обрезки миниатюры. Она не особо удобная (хотя в последних версиях вроде улучшили), но всё-же.

    • Есть, но встроенный редактор позволяет редактировать лишь размер миниатюр, который указан в настройках медиа. Данный размер используется при работе с галереями или при вставке изображений этого конкретного размера в запись или страницу. Но встроенный редактор не позволяет редактировать другие размеры миниатюр, которые например используются в темах и плагинах.

      Кстати об этом написано в последнем параграфе перед разделом «Разработчикам» :)

  • versusbassz

    Потестировал. Русского перевода нет, юзабилити местами хромает, код (субъективно) странный.
    Но на выходе вроде бы классная фича. Я в смущении :)

    • Почему-то многие разработчики плагинов и тем любят всовывать свой собственный дизайн кнопочек и других элементов управления, а не берут вордпрессовский. Из-за этого все эти свистелки как-то чужеродно и неряшливо смотрятся. Единственный плагин, который использует дополнительные стили для метабокса и при этом все выглядит адекватно — woocomerce

  • Vitaliy Ralle

    Плагин действительно незаменим для тех, кто заботиться о каждой картинке.
    По миниатюрам беспокоит еще один вопрос.
    Вся графика обрабатывается еще одним замечательным плагином — EWWW Image Optimizer. Но зачатую, размер сгенерированных миниатюр для файлов png больше исходника(
    Приходиться каждую миниатюру генерировать вручную в графическом редакторе.
    Есть ли способ побороть это?

    • Можете попробовать плагин WP Smush.it, он использует сервис от Yahoo для сжатия всех изображений без потери качества. Как альтернатива можно воспользоваться системными утилитами вроде jpegtran и pngcrush для сжатия изображений на сервере.

  • Это всё хорошо ровно до того, как требуется заново перегенерировать все миниатюры. При смене темы оформления, например.

    • Да. При регенарции все слетит. Следовательно если кому миниатюры нужны нормальные, надо их у себя на компьютере готовить и загружать как отдельный файл :)

      • Проще вообще не заморачиваться :)

  • EatBetter_ru

    У меня не работает. На вкладке view нет кнопок для сохранения и внизу пишет следующее «No image has been generated yet for image: ‘large'»

    • Посмотрите логи ошибок, а также убедитесь в том, что вы загрузили изображение размером больше, чем large (который указывается в настройках медиа).

      • EatBetter_ru

        Если б я понимал, что такое логи ошибок и где его смотреть, да еще и что там смотреть…

        • Обратитесь в поддержку вашего хостинг-провайдера, вам подскажут где искать логи.

      • EatBetter_ru

        Не работает плагин и все тут. Тема semicolon, WP 4.0.1

  • Здравствуйте. Напишите пожалуйста пост о том, с помощью каких плагинов сделать многоязычный сайт.

    • Добавим в список пожеланий, спасибо!

  • В WordPress вроде как была такая фича, как выбор стороны обрезания миниатюры. Где-то видел. Подробностей бы.

    Это пока доступно только для разработчиков, при регистрации размеров изображений. Подробнее в последнем разделе статьи под заголовком «разработчикам».

    • Мало подробностей. Сторону можно выбрать для всех миниатюр или для каждой отдельно?

      • Сторону можно выбрать только для регистрируемого размера миниатюры или для основного размера миниатюры в случае если вы используете set_post_thumbnail_size(). Это повлияет на генерирование миниатюр выбранных размеров, но не влияет на уже сгенерированные миниатюры этих размеров, и также не влияет на другие зарегистрированные размеры.

        • То есть я не могу для одного изображения выбрать обрезку слева сверху, а для другого изображения того же размера – снизу посередине. Жаль.

          • К сожалению на данный момент с помощью функций ядра – нет, не можете, но возможно в будущем это изменится.

  • А вот что делает WP при генерации картинок, после чего сгенерированная картинка может быть в несколько раз больше исходинка, непонятно.

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

  • MrClon

    Странно. Плагин не может обрезать изображения в именах (именах файлов) которых есть кириллица. При этом обычный редактор WP с такими изображениями работает.
    Как думаете, это какой-то косяк в моей системе (который почему-то задевает плагин, но не задевает ядро WP), или всё-таки баг плагина?

  • Не подскажете почему может не отображаться в PTE превью картинки?

  • Парни, подскажите, пожалуйста.
    Требуется чтобы миниатюры были строго одного размера, но при этом фактически ничего не обрезалось. То есть, бОльшая сторона уменьшаемя до своего размера, а меньша расширяется белым или прозрачным фоном.
    Кто знает как?