1. зміст
2. "Хлібні крихти" на сайті за допомогою плагіна WordPress SEO by Yoast
3. Як змінити зовнішній вигляд "хлібних крихт" за допомогою CSS
4. Як прибрати назву статті в "хлібних крихтах"
5. Мікророзмітки "хлібних крихт", schema.org та інше
6. Відповіді на запитання

Привіт друзі! про "Хлібні крихти" на WordPress я колись уже писав, але це було в далекому 2010-му році. З тих пір деякі речі змінилися, як в технічному плані, так і в моїй голові. Тому я вирішив написати цей урок.

"Хлібні крихти" - це блок для користувача, який дає йому інформацію де він знаходиться (в якій рубриці або категорії), допомагає знайти схожі пости / товари. Крім зручності для користувача, цей блок покращує внутрішню перелинковку і допомагає пошуковим систем більше розуміти структуру Вашого сайту. Загалом, ці самі "крихти" повинні бути, як я вважаю, на будь-якому сайті.

зміст

1. Як вивести "хлібні крихти".
2. Як змінити зовнішній вигляд "крихт".
3. Як прибрати назву статті в "останній гілці".
4. Мікророзмітки "хлібних крихт", schema.org та інше.

Ось так виглядають "хлібні крихти" на моєму блозі:

Раніше висновок "хлібних крихт" здійснювався через код, який вмонтував верстальник, без всяких плагінів. Але мене весь час не влаштовувало одне: там виводилася "остання гілка" крихт, тобто назва статті. Ось як це виглядало:

Я вважаю, що це неправильний варіант, так як на такій маленькій ділянці коду відбувається надмірна концентрація ключових слів, причому йде повне дублювання, а одне з них навіть в тезі h1, що ще підсилює ефект цієї ключової фрази.

Загалом, як я вважаю, що це переоптімізацію і таке неприпустимо. Так як я далеко не проггер, я просто фізично не знав, як прибрати це дублювання і просто "забив" на це.

І тут абсолютно випадково з Твіттера я переходжу на сайт свого друга Віталія і потрапляю на статтю " Як прибрати дубль назви статті в хлібних крихтах WordPress SEO by Yoast " . І про ура, я нарешті-то знаходжу рішення своєї проблеми.

Плагін WordPress SEO by Yoast давно став моїм улюбленим плагіном і я чомусь не користувався даними його функціоналом. Я за звичкою ( "по-старому") ставив окремий плагін Breadcrumb NavXT. У підсумку, я прийшов до висновку, що "хлібні крихти" найкраще виводити за допомогою плагіна WordPress SEO by Yoast.

"Хлібні крихти" на сайті за допомогою плагіна WordPress SEO by Yoast

Як зробити "хлібні крихти"

Розпишу, як слід виводити їх:

1. У Вас повинен бути встановлений плагін WordPress SEO by Yoast .
2. В адмінці сайті переходимо в розділ SEO -> Хлібні крихти:
3. Ставимо галочку навпроти "Включити" хлібні крихти "":
4. Визначаємося з роздільником між пунктами, у мене це символ ">", а також потрібно ввести текст посилання на головну сторінку (у мене просто WPnew.ru), не забуваємо натиснути на кнопку нижче "Зберегти зміни" (в рядку "Записи" не забудьте поставити "Рубрика"):
5. Ось код, який потрібно вставити (взяв звідси https://kb.yoast.com/kb/implement-wordpress-seo-breadcrumbs/ ):

   

6. У нашій темі WordPress шукаємо файл single.php, відкриваємо його:
7. Там шукаємо код the_title (код, який відповідає за виведення заголовка статті):
8. Рядком ВИЩЕ або навіть ще трохи вище (дізнаєтеся методом проб) вставляємо скопійований PHP код:
9. Ось так трохи жахливо в візуальному плані у вас можуть нарешті вилізти ці самі "хлібні крихти" (покажу на прикладі свого сайту):

Як змінити зовнішній вигляд "хлібних крихт" за допомогою CSS

1. На скріншоті вище блок вийшов досить симпатичним, але на деяких сайтах за замовчуванням виходить вкрай некрасиво. Що ми робимо? Просто присвоюємо будь CSS клас "хлібним крихтам":
2. І вже в style.css своєї теми прописуємо ті стилі, які нам потрібні, в моєму випадку це виглядає так:
3. Нагадаю, ви можете з легкістю скопіювати стиль будь-якого вподобаного елемента на будь-якому сайті, просто використавши Firebug (додаток для Firefox) , Та й прямо в ньому можете "погратися" з шрифтами та інше, щоб зрозуміти, як краще буде для Вашого сайту. З моїми стилями вийшло ось що (оформлення, по-моєму, дуже навіть симпатичне):

Як прибрати назву статті в "хлібних крихтах"

Далі потрібно визначитися, як прибрати "останню гілку", тобто назва статті. Як уже говорив, спасибі Віталію за наданий код, просто потрібно ось це Вам скопіювати:

<? Php if (function_exists ( 'yoast_breadcrumb')) {yoast_breadcrumb ( '<p id = "breadcrumbs">', '</ p>');}?>

Відкрити файл теми functions.php і на самому початку після октривающегося php вставити його:

Мікророзмітки "хлібних крихт", schema.org та інше

"Хлібні крихти" насправді можна вивести різними способами. Найголовніше, крім того, що ми бачимо візуально, потрібно переконатися в тому, що ваші "хлібні крихти" розуміють пошукові системи. Для цього використовуються мікророзмітки.

З плагіном WordPress SEO by Yoast з цим проблем немає, пошуковики все правильно сприймають. Якщо ж ви виводите "хлібні крихти" з використанням іншого плагіна або взагалі просто PHP коду, обов'язково перевірте правильність їх виведення за допомогою валідаторів мікроразметок:

1. Валідатор мікроразметок Google .
2. Валідатор мікроразметок Яндекс .

Ось приблизно, що ви повинні бачити в валідаторі Google (вбиваємо адресу будь-якої статті):

У валідаторі Яндекса аналогічно (повторюся, потрібно забивати посилання на статтю):

У підсумку потім в результаті видачі ми будемо бачити щось на кшталт:

Відповіді на запитання

Що робити, якщо в "хлібних крихтах виводяться рубрики?

Все дуже просто, в настройках встановлюємо таксономию "Рубрики":

Як задавати довільні назви категорій?

От і все. Начебто тема "хлібних крихт" розкрита. 🙂 Якщо є питання - задавайте, якщо що обов'язково доповню цей урок.

А як ви виводите "хлібні крихти" на своєму сайті?

Підпишіться на безкоштовні уроки

Сподобався урок? Ви не хочете пропускати нові безкоштовні уроки по створенню, розкрутці та монетизації блогу? тоді підпишіться на RSS або на електронну скриньку в формі вище і отримуйте нові уроки миттєво! також можете стежити за мною в Twitter.