Выводит заголовок записи подготовленный для использования в атрибутах html тега.
Функция должна использоваться внутри Цикла WordPress.
Функция идентична функции the_title() , стой лишь разницей, что эта функция "чистит" заголовок от HTML тегов и меняет HTML сущности (< , > , " , ") на их HTML эквиваленты. Например, знак < будет заменен на < . К заголовку применяются функции-фильтры: esc_attr() и strip_tags()
Также эта функция может принимать параметры в виде строки: "before=
✈ 1 раз = 0.005307с = очень медленно | 50000 раз = 2.55с = быстро | PHP 7.1.2, WP 4.7.3
Хуков нет.
null/строку. null когда результат выводится на экран (echo=true). Заголовок когда результат возвращается (echo=true).
Параметры в виде массива или строки. Можно передать следующие параметры:
before
(строка)
Текст/HTML код который нужно разместить перед заголовком.
По умолчанию: ""
after
(строка)
Текст/HTML код который нужно разместить после заголовка.
По умолчанию: ""
echo
(логический)
Вывести на экран (true) или возвратить для дальнейшей обработки (false).
По умолчанию: true
По умолчанию: ""
Так как в этом атрибуте не допускается использования html тегов кавычек и прочего, то мы не можем там использовать функцию the_title(). Взамен используем the_title_attribute() :
" title=" "Permalink to: ", "after" => "")); ?>">
Здравствуйте, уважаемые читатели блога сайт. Валидатор Html кода и другие , будут выдавать предупреждения, если найдут на странице теги изображений IMG без прописанного внутри атрибута ALT .
Мой сайт и я чтобы быстро из-под них выйти убрал все атрибуты Alt и Title в тегах IMG, т.к. подозревал, что именно из-за их переоптимизации был наложен фильтр. Увы, но это не помогло и пришлось пять месяцев убить не переписывание текстов.
А вот сил на обратное добавление атрибутов ALT в статьи у меня уже не осталось. Сейчас, когда обновляю старые материалы, естественно, дописываю и ALT-ты, но далеко не все статьи я переписываю (не до всего доходят руки). Поэтому я и подумал о том, чтобы поставить «времянку».
Идея очень простая, а реализация изящная. Показанный внизу скрипт (функция для WordPress) просто ищет теги IMG, в которых атрибута alt нет вообще. Найдя такое безобразие она добавляет ALT и тупо прописывается в нем название статьи (содержимое тега Title страницы).
Да, решение не самое изящное, но зато простое и эффективное. Валидатор перестанет ругаться, да и поисковики смогут хоть как-то сориентироваться в том, о чем идет речь на данном изображении.
Итак, показанный фрагмент кода нужно добавить в файл функшион.пхп ( я о нем подробно писал) используемой вами темы оформления (сделайте его бекап обязательно). Посмотрите, где там уже вставлены подобные конструкции и постарайтесь не впихнуть ее внутрь какой-нибудь другой функции (лучше вставлять перед function другой функции, чтобы уж точно не ошибиться:
Function add_alt_tags($content) { global $post; preg_match_all("//", $content, $images); if(!is_null($images)) { foreach($images as $index => $value) { if(!preg_match("/alt=/", $value)) { $new_img = str_replace("post_title.""", $images[$index]); $content = str_replace($images[$index], $new_img, $content); } } } return $content; } add_filter("the_content", "add_alt_tags", 99999);
Теперь посмотрите исходной код какой-нибудь страницы вашего блога, где раньше не было прописано атрибутов ALT. Естественно, что это не должна быть страница из кеша (отдаваемая вашим плагином кеширования), а обновленная страничка, включающая в себя только что сделанные вами изменения.
В ее коде вы найдете ALT-ты хоть и одинаковые, но все же присутствующие.
Все лучше, чем ничего. ИМХО.
На страницах же, где альты были прописаны ничего не поменяется:
И еще на тему. Миниатюры в WordPress по умолчанию выводятся с пустыми тегами Alt (типа alt=""). Если это вам не нравится, то можете добавить в качестве альта к миниатюрам названия статей, из которых они были взяты. Заодно можете и атрибут Title к тегу Img добавить:
//добавление alt и title для миниатюр записей start function wph_alt_title_for_thumbnail($html) { $post_title = esc_attr(get_the_title()); //добавляем alt $html = preg_replace("/(alt=")(.*?)(")/i", "$1".$post_title."$3", $html); //добавляем title $html = str_replace("/>", "title="".$post_title."" />", $html); return $html; } add_filter("post_thumbnail_html", "wph_alt_title_for_thumbnail", 10, 1); //добавление alt и title для миниатюр записей end
Если к миниатюрам хотите добавить только альты, то можно использовать такой код:
//добавление alt и title для миниатюр записей start function wph_alt_title_for_thumbnail($html) { $post_title = esc_attr(get_the_title()); //добавляем alt $html = preg_replace("/(alt=")(.*?)(")/i", "$1".$post_title."$3", $html); return $html; } add_filter("post_thumbnail_html", "wph_alt_title_for_thumbnail", 10, 1); //добавление alt и title для миниатюр записей end
Удачи вам! До скорых встреч на страницах блога сайт
посмотреть еще ролики можно перейдя на");">
Вам может быть интересно
Как в WordPress можно выводить посты из категории с миниатюрами (их создание в Auto Post Thumbnail и catch_that_image)
Создаем для блога на WordPress кнопки добавления в социальные сети и закладки (без плагинов и скриптов)
Как отключить комментарии в WordPress для отдельных статей или всего блога, а так же убрать или наоборот подключить их в шаблоне
Пропало левое меню в админке WordPress после обновления
Хлебные крошки в Вордпресс без плагинов
Как убрать служебные ссылки с WP-JSON из исходного кода страниц вашего блога на WordPress
Файл functions.php из папки с темой WordPress и реальные примеры его использования
Проблема с All in One SEO Pack и ее решение - убираем rel=prev и исправляем rel=canonical, чтобы убрать из индекса дубли
Не так давно один из наших читателей задал вопрос: можно ли как-то добавить атрибут title в меню WordPress ? Этот атрибут отображает дополнительную информацию о ссылке в виде текстовой подсказки, которая появляется при наведении курсора. В данной статье мы покажем, как добавить атрибут title в меню WordPress .
title – это HTML-атрибут , который можно задать для любого элемента. Но чаще всего он используется именно в ссылках и изображениях.
Данный атрибут отображает дополнительную информацию о ссылке или картинке:
Обычно браузеры отображают title при наведении курсора мыши. Это позволяет пользователям увидеть, куда ведет ссылка.
Некоторые SEO-специалисты считают title HTML атрибут бесполезным, другие же верят, что этот атрибут крайне полезен для SEO , так как он позволяет предоставлять больше контента.
Разработчики WordPress удалили атрибут title из окна добавления ссылки в версии 4.2 . Раз уж мы заговорили об этом, то научимся добавлять title в меню WordPress .
Зайдите в раздел Appearance=> Menus (Внешний вид=>Меню ) и перейдите на вкладку Screen Options (Настройки экрана ), расположенную в правом верхнем углу:
Там откроется меню, в котором нужно будет поставить галочку в свойстве «Атрибут title ».
Затем пролистайте страницу и нажмите на любой элемент меню для его открытия. В нем вы увидите поле для атрибута title :
Теперь вы сможете добавлять любой текст в атрибут title WordPress для всех элементов навигационного меню. Не забудьте нажать на кнопку «Сохранить », чтобы не потерять изменения.
С помощью jQuery можно довести до ума этот атрибут, добавив разных эффектов при наведении курсора. Надеемся, что данная статья помогла вам разобраться в настройке атрибута title в меню WordPress .
Перевод статьи «How to Add Title Attribute in WordPress Navigation Menus » был подготовлен дружной командой проекта
Хорошо Плохо
Обязательный атрибут alt указывает альтернативный текст для отображения в тех случаях, когда изображение не может быть выведено из-за медленного соединения,…
Иконки - немаловажная часть любого дизайна. Многие иконки являются общепризнанными. К примеру, обозначения уборных в аэровокзалах. Ведь даже без знания языка,…
) - вещь важная и удобная во многих смыслах.
Один из вариантов его использования – создание блока ссылок, каждая из которых, имеет собственное оформление, например, вот такой Рубрикатор:
Блок ссылок с уникальными пиктограммками
Подобная возможность есть во многих премиум темах, полагаю, есть и плагины создающие подобное меню. Мое решение подойдет для любой темы WP, оно не окажется избыточным или несущим какую-либо дополнительную нагрузку на сервер, как это иногда бывает с плагинами. Для его реализации необходимы минимальные знания css и html (можно почитать об этом тут – htmlbook.ru ) и какой-либо html-редактор, например, бесплатный notepad++ (офсайт – notepad-plus-plus.org ).
Итак, первое, что нужно сделать, это создать произвольное меню – Консоль > Внешний вид > Меню (тут и далее, путь в официально локализованной версии WP ). Затем, в случае использования виджета произвольного меню Консоль > Внешний вид > Виджеты перетащить виджет в блок сайдбара и выбрать созданное ранее произвольное меню. Думаю, что данные действия просты и не нуждаются в скриншотах. Для темы “Twenty Ten” (wordpress.org/extend/themes/twentyten ) результат будет выглядеть так:
Внешний вид произвольного меню в теме “Twenty Ten”Для стилизации пунктов требуется не многое, сами иконки, предварительно загруженные в папку изображений используемой темы и небольшие правки внесенные в файл стилей темы – style.css . Иконки-пиктограммки можно найти так – google.com/search?q=бесплатные+иконки . Файл стилей находится, обычно, в корне папки используемой темы.
Для персонализации ссылок необходимо как-то выделить каждую из них, т.е. сделать так, чтобы она была уникальной по какому-либо из доступных к селекции средствами css признаков. В консоли WordPress можно добавить атрибут title (htmlbook.ru/samhtml/ssylki/atributy-ssylok) к ссылкам произвольного меню. Именно этот атрибут я и предлагаю использовать. Для определения значения этого атрибута нужно заполнить поле “Атрибут title” при редактировании ссылки Консоль > Внешний вид > Меню > Ваше произвольное меню, см. скриншот:
При заполнении значения данного поля важно использовать только латинские символы!
Для пункта “Записи” я использую значение “posts”, т.е. так:
Осталось изменить свойства данного элемента, для этого прописываем в файл style.css следующее:
Widget_nav_menu a { list-style: none; background: url(images/posts.png) no-repeat left center; }
Поясню. .widget_nav_menu – класс произвольного меню; a – селектор ссылки с атрибутом title, значение которого – posts; list-style: none; – убираем маркер пункта меню; background: url(images/posts.png) no-repeat left center; – определяем фоновый рисунок – пиктограммку данного конкретно пункта, т.е. персонализируем его. С последним свойством и его значениями можно ознакомиться по ссылке – htmlbook.ru/css/background , я лишь поясню, что images/posts.png это относительная ссылка на файл иконки которую вы желаете увидеть для данной ссылки, а left center это правила расположения данной иконки.
На сегодняшний день изображениям среди всего веб-контента отводится довольно большое место. Однако не все пользователи оптимизируют их для лучшего ранжирования всего сайта в целом. WordPress, среди своих прочих возможностей, предоставляет удобные инструменты для добавления альтернативного текста и заголовка изображения в соответствующие теги. В этом материале рассмотрим разницу между атрибутами alt /title и сферы их применения.
Альтернативный текст или alt является HTML -атрибутом, добавленным к тегу вставки изображения . Этот текст будет показан в том случае, если изображение по той или иной причине не будет загружено и отображено на странице. Такой ход дает информацию поисковым роботам о том, что именно изображено на фото. Обычно в теге alt пишут короткое описание изображения. Кроме того, атрибут служит также и для улучшения доступности сайта для людей с ограниченным зрением или для тех, кто использует устройства для чтения с экрана. Программа-читалка будет озвучивать текстовую часть страницы, а когда дойдет до изображения, то прочитает и текст, находящийся в alt . Благодаря этому, пользователи всегда будут знать, что нарисовано на картинке, даже если они ее не видят.
WordPress предоставляет довольно удобные инструменты для заполнения атрибута alt . Так, его можно указать уже при загрузке изображения. Для этого следует открыть запись или страницу, вставить курсор в место вставки изображения и нажать кнопку Добавить медиафайл .
После того, как будет нажата кнопка, откроется окно Медиабиблиотеки WordPress, где нужно будет указать локальное месторасположение файла-картинки. В итоге Вы увидите боковую панель с параметрами загруженного файла.
Как видно, на панели присутствует поле Атрибут alt . По умолчанию, оно является пустым. Задавать текст в атрибуте необходимо длиною из 2-3 слов, причем они должны точно описывать что на фото. Чтобы вставить изображение на сайт, следует нажать кнопку Вставить в запись .
Title — еще один атрибут HTML -тега вставки изображения . Он используется для заголовка картинки и обычно указывает на ее название. Отметим также, что текст внутри title не будет показан пользователю, если изображение не отображается на странице.
Атрибут заполняется уже после загрузки изображения на сайт. Для этого в Медиабиблиотеке WordPress следует выделить изображение, после чего появится знакомая боковая панель.
Title или заголовок нужно задавать осмысленно в зависимости от информации, представленной на изображении. В то же время текст должен отличаться от атрибута alt . Заголовок можно писать на русском языке или же использовать транслитерацию. Довольно часто владельцы сайтов используют его для SEO -оптимизации, указывая там ключевые слова. Также атрибут можно задать, находясь на странице редактирования записи или страницы. Для этого необходимо щелкнуть по картинке, и на появившейся дополнительной панели инструментов нажать кнопку редактирования с изображением карандаша. Вообще для оптимизации сайта рекомендуется для изображений использовать оба атрибута. Атрибут alt имеет одно преимущество — он помогает поисковым системам находить изображения на Вашем сайте и отображать их в результатах поиска по картинкам. При этом сайт получает дополнительный трафик из поисковиков. Еще одно преимущество обоих атрибутов — улучшение доступности сайта для людей с особыми потребностями.