VovkDesign

Блог Александры и Владимира Вовк

RSS лента
wp-puzzle

Решаем проблему с title картинок при вставке в редактор WordPress

параметры картинки wordpressЕсли Вы регулярно обновляете WordPress и оптимизируете свои изображения в публикациях, то могли заметить некоторые изменения с атрибутом title. Начиная с версии WordPress 3.5 отключено автоматическое добавление title картинки при вставке ее в редактор, что лично мне кажется проблемой, усложняющей процесс оптимизации. Сегодня я поделюсь с вами своим решением и предложу альтернативу.

Сразу после загрузки картинки можно настроить ее параметры и вставить в текст. Было достаточно указать Заглавие (title) и Атрибут alt и требуемые теги добавлялись в код изображения.

настройка параметров фото

А сейчас сразу после вставки тег title не заполняется. Чтобы установить его для фото, нужно заходить в Редактирование изображения (если нажать на медиафайл, то появится карандашик) и заполнять отдельное поле в дополнительных параметрах.

где указать title картинки

Изменение привычных вещей значительно замедляет процесс работы. Поэтому я и решила вернуть удобства с title.

Как вернуть автоматическое добавление title картинки в WordPress 3.5+

Если редактирование исходных файлов вашей темы — не проблема, то проще всего обойтись небольшой функцией, которую нужно добавить в файл function.php:

if ( !function_exists('avd_insert_image_title') ) : 
function avd_insert_image_title( $html, $id, $attachment ) {
    if ( !strpos($html, "title=") ) {
        $html = str_replace('<img', '<img title="'. get_the_title( $id ) .'"' , $html);
    }
    return $html;
}
endif;
add_filter( 'media_send_to_editor', 'avd_insert_image_title', 10, 3 );

Альтернативное решение

Если после редактирования исходных файлов «слетит» лицензия премиум темы или вы просто не хотите потерять этот функционал после обновления или смены темы WordPress, то можно обойтись установкой достаточно легкого плагина Restore Image Title. Кто боится лишней нагрузки — этот плагин можно смело ставить, он не подключает никаких дополнительных файлов и содержит одну единственную функцию.

Комментарии всего: 43

  • Здравствуйте Александра!Давно уже заметил что пропала фкнкция title,но как то никто об этом не пишет и не говорит,так подсознательно не относился к этому с истерикой 🙂 А тут как раз вы с этим постом,так я вспомнил об этом.Спасибо большое!Скажите пожалуйста,как только устанавливаешь плагин,то просто возвращается опция title? Все на столько просто?

    • Добрый день, Игорь! Да, после установки плагина title будет снова будет вставляться в код. А для тех картинок, что добавлены ранее, тайтл все-таки придется прописать отдельно, как показано у меня на второй картинке.

      • Добрый вечер! А как же с миниатюрами the_post_thumbnail? Как в них вернуть title? Очень нужна Ваша помощь. Спасибо.

        • уже решил вопрос, спасибо)
          помог следующие код в functions.php

          function titles_gallery($atts,$img) {
           $atts['title'] = trim(strip_tags( $img->post_title ));
           return $atts;
          }
          add_filter('wp_get_attachment_image_attributes','titles_gallery',10,2);
          • Влад, спасибо за решение с миниатюрами!

          • А вот мне не помог. После вставки данного кода сайт перестаёт работать (пустые белые страницы). Буду очень признателен за другой вариант решения этой проблемы.

          • Максим, если речь о коде из комментария Влада, то попробуйте еще раз — там была небольшая опечатка с символом >

          • Теперь получилось! Большое спасибо!

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

          • Максим, в данной ситуации все зависит от кода Вашего шаблона — там может какой-то индивидуальный вывод миниатюры стоять. Но однозначно, фраза «имя первой миниатюры для записи» берется или из картинки или из вашего шаблона.
            Плюс, если у вас выводится не просто миниатюра, а миниатюра с ссылкой, то у тега <a> тоже есть свой title. Приведенный Владом код, будет работать корректно, если в шаблоне главной страницы (index.php) миниатюра вызывается примерно так:

            <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_post_thumbnail('thumbnail')?></a>

            А в самом изображении прописаны Заголовок и Атрибут alt (проверить это можно на странице картинки в консоли через меню Медиафайлы).

          • Большое спасибо, ваш код очень помог!

          • Влад, Большое спасибо 🙂

  • Спасибо!

  • Спасибо, Саша! Тема важная, так как многие вордпрессовцы начали задавать такие вопросы. Теперь я знаю, какую статью для ответа им нужно будет изучать. 😉

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

  • Привет. спасибо за инфу, но есть один нюанс, в исходном коде , создается почемуто 2 титла

    Есть вариант это как то устранить?
    пример:

    <a href="http://sait.ru/wp-content/uploads/2014/10/50ec3f.jpg" title="Модели личности" rel="nofollow"></a>
    • Георгий, в примере title один указан. Какая у Вас версия WordPress и когда появляется второй title — сразу после вставки изображения или после редактирования его параметров?

  • Спасибо Вам за статью.
    искала подобное решение, и рада что нашла

  • Спасибо! Актуально. Получилось вставить код в файл function.php. Но alt и title прописаны одинаково по имени фала. Как сделать, чтобы alt и title отличались друг от друга?

  • Александра,добрый день! Подскажите, пожалуйста, есть ли варианты сделать скачиваемые ссылки на сайте с левой стороны? И как это сделать? Надо прописывать код заново, или движки wordpres имеют такую функцию? Заранее Вас благодарю за ответ!!!

  • Или сделать так, чтоб ссылки были справа в выдвижном окошке?

  • Я только заметила, что title перестал прописываться. Некоторые обновления wordpress проходят под девизом «Лучшее враг хорошего». Интересно, а после установки этого кода или плагина, обновляются коды у картинок, которые уже были загружены и вставлены без атрибута title? Или теперь надо все перепроверять и обновлять те картинки у которых этого атрибута нет?

    • Oksana, нет. Этот код будет работать для новых картинок, для остальных придется перепроверять и вставлять.

  • Sql запрос для восстановления title у всех изображений, не забудьте сделать резервную копию базы данных

    UPDATE `wp_posts`
    SET `post_content` = REPLACE(`post_content`, '<img ', CONCAT('<img title="', `post_title`, '" '))
    WHERE `post_type` = 'post' OR `post_type` = 'page'
    • Евгений, я так понимаю в title всех изображений добавится название статьи? Не лучшее решение, тайтл для изображения лучше бы вытягивать из записей с post_type = attachment и post_mime_type = image по id вложения (картинки).

      • Евгений, я так понимаю в title всех изображений добавится название статьи?

        Да, добавится.

        Не лучшее решение, тайтл для изображения лучше бы вытягивать из записей с post_type = attachment и post_mime_type = image по id вложения (картинки).

        Можно, тут все индивидуально, но мне подошел вариант выше. (у меня названия постов идеально подходят для title изображений)

  • Установила код в Ваш плагин function.php, теперь title вставляется сразу после img. Но это для новых изображений. А вот для прежних не получается отредактировать изображения как у вас показано на рисунке 2, потому ято у меня нет такой графы- дополнительные настройки((( Как быть в таком случае?

    • Лора, если Дополнительными настройками раньше не пользовались, то они могут быть просто скрыты.

      Как открыть поля с дополнительными настройками

      Чтобы появились поля, как у меня на картинке, нужно просто кликнуть на фразе Дополнительные настройки.

      • Дело в том, что у меня нет возможность кликать по данной фразе, потому что у меня ее просто НЕТ… Вот ссылка на скрин, на котором показано все, что видно у меня при клике на Изменить картинку…
        https://fotki.yandex.ru/next/users/neznakomka0305/album/476468/view/906907

        • Лора, этот пункт есть при изменении параметров изображения через редактор текста, а не через редактор медиа-файлов

          Дополнительные параметры при редактировании изображения через редактор текста

          • Спасибо за подсказку. теперь нашла. просто я не пользуюсь визуальным редактором… работаю в html режиме, потому что при переходе с него на визуальный и наоборот иногда происходят некоторые сбои…
            Но зато теперь, благодаря вам узнала как добавить атрибут title… Я в некоторых статьях просто в html режиме вписала вручную этот атрибут, сделала , а потом прочла вашу статью и задумалась, а правильно ли так ? Но ведь по идее, если я сама пропишу этот адрибут, то это будет то же самое или я ошибаюсь?

          • Лора, верно — одно и то же. Нету разницы как прописывать title для картинки — кодом в HTML-редакторе или в специальном поле визуального редактора.

  • Теперь такая же ерунда стала со ссылками в статьях. Вообще не виду теперь куда там в визуальном редакторе Тайтл ссылке прописывать. Лишь через html вставляется!

  • Александра, спасибо! Помогло. От wordpress прямо «подстава» какая-то, только недавно обнаружил что всё что старательно и осмыслено прописывал в заголовках изображений, не выводится на странице в title.

    Теперь придется несколько сотен изображений перелопачивать и прописывать заново всё ((

    Может кто-нибудь подскажет SQL запрос? чтобы не название статьи было у всех изображений, а уже заполненная информация к каждому изображению выводилась? ведь где-то в базе эта инфа есть…

  • Здравствуйте.
    Подскажите пожалуйста как вставить тайтлы в картинки МетаСлайдера по названию имиджа
    В башке он в диве и я вставил код wp_title: <div title="» class=»art-header-clip»>

    но это не совсем то, что я хочу.

  • Отличная статья, мне данный способ подошёл под 3 разные темы. Спасибо!

  • ЧТОБЫ добавить TITLE к картинкам галереи добавьте в function.php
    function titles_gallery($atts,$img) {
    $atts['title'] = trim(strip_tags( $img->post_title ));
    return $atts;
    }
    add_filter('wp_get_attachment_image_attributes','titles_gallery',10,2);

  • Подскажите, а как задать условие для выполнение кода? Например, что бы он выполнялся только если контент принадлежит к странице с определенным шаблонам, а к остальным нет. Спасибо.

  • Александра здравствуйте. Может сталкивались с проблемой когда добавляется фото в виде галереи (на пример трех фото) но alt, title пропадают, нет в коде. Если отдельно добавить каждое то alt, title есть . WordPress 4.7.3.

    • По-умолчанию, заполненный атрибут alt добавляется в картинки обычные и в галерее. А для автоматической вставки title нужно использовать плагин https://ru.wordpress.org/plugins/restore-image-title/

      Попробуйте отключить все плагины, активировать стандартную тему (например, Twenty Sixteen) и проверить добавляется ли заполненный alt при вставке галереи и фото.

      • Благодарю!
        Так и получилось, при отключенном плагине alt сохраняется в галерее.

Комментировать

Ваш e-mail не будет опубликован. Обязательные поля помечены *

*

wp-puzzle.com logo