Прыгожыя хлебныя крошкі WordPress: налада, дызайн

1. Функцыі хлебных дробак
2. Ці варта ўсталёўваць хлебныя крошкі на блог
3. Налада і стварэнне хлебных дробак з дапамогай плагіна WordPress SEO by Yoast
4. Як прыбраць назву артыкула ў "хлебныя дробкі"
5. Як змяніць знешні выгляд "хлебных дробак" з дапамогай CSS

Добры дзень, паважаныя чытачы. У гэтым артыкуле я падрабязна распішыцеся, што такое хлебныя крошкі WordPress, як іх зрабіць з дапамогай стромкага SEO-плагіна, наладзіць за пару хвілін і прыгожа аформіць, упісаўшы ў любы дызайн.

Хлебныя крошкі - гэта важны элемент навігацыі сайта, які выконвае дзве асноўныя функцыі: павышэнне юзабіліці (зручнасць выкарыстання элементаў і кантэнту сайта) і стварэнне правільнай перелинковки сайта. Звычайна хлебныя «драбніцу» выконваюцца ў выглядзе радка, у якой пазначыць шлях па сайту ад галоўнай старонкі да апошняй часткі, у якім знаходзіцца артыкул ці тавар. Паглядзім на прыкладах:

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

Функцыі хлебных дробак

Разбяром кожную функцыю падрабязней.

Па-першае, павышэнне юзабіліці сайта. Асноўная функцыя хлебных дробак - гэта пазначыць карыстачу, дзе ён знаходзіцца, у якім з падзелаў, падраздзеле і гэтак далей знаходзіцца артыкул ці тавар, якую ён чытае ў дадзены момант.

Глядзім на яшчэ адзін прыклад:

На фота паказаны хлебныя крошкі аднаго папулярнага інтэрнэт-крамы адзення. Тут мы бачым, што абодва тавару джынсаў знаходзяцца ў 4 катэгорыях:

1. Мужчынам (жанчынам);
2. Мужчынская адзенне (жаночая адзенне);
3. джынсы;
4. Прамыя джынсы.

Карыстальнік ў любы момант можа вярнуцца ў неабходную катэгорыя не выкарыстоўваючы больш складаныя элементы навігацыі.

Па-другое, стварэнне правільнай перелинковки. Перелинковка - гэта адзін з самых высокаэфектыўных і бясплатных метадаў прасоўвання сайта, які асабліва важны для прасоўвання НЧ запытаў.

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

Ці варта ўсталёўваць хлебныя крошкі на блог

Хлебныя крошкі хоць і лічацца важным элементам навігацыі, іх выкарыстанне не заўсёды дарэчы. Дапусцім ў вас блог на вельмі вузкую тэму, якую ўдалося разбіць на 3, 4 ці 5 рубрык. Структура сайта пры гэтым вельмі простая і зразумелая. У такім выпадку выкарыстанне хлебных крошак не абавязкова.

Многія SEOшники рэкамендуюць выкарыстоўваць хлебныя крошкі, толькі калі блог мае рубрыкі, разбітыя на падрубрыкі, або больш складаную структуру. Я не згодны з такім меркаваннем, таму праводжу шэраг эксперыментаў у гэтым кірунак.

Вынікамі эксперыменту падзялюся ў асобным артыкуле.

Таксама многія спецыялісты ў пошукавым прасоўванне рэкамендуюць

У апошні час у мяне стаяць хлебныя крошкі створаныя з дапамогай функцыянальнага SEO ўбудовы WordPress SEO by Yoast. Дадзены убудова дазваляе ствараць даволі нядрэнныя хлебныя крошкі. Вось некалькі плюсаў:

• калі ў вас стаіць WordPress SEO by Yoast няма неабходнасці ў іншых убудовах і рашэннях;
• убудова разам з рубрыкамі выводзіць і падрубрыкі, адлюстроўваючы поўную структуру сайта;
• магчыма змяніць тэкст спасылкі на галоўную старонку;
• ўстаноўка падзельніка і прэфікса;
• ўстаноўка фармату таксанаміі (рубрыкі, пазнакі і г.д.)
• вылучэнне апошняй старонкі тлустым;
• з дапамогай CSS можна паэксперыментаваць з афармленнем хлебных дробак.

Хоць гэты убудова рэалізуе дадзеную функцыю далёка не ідэальна, у хуткім часе з бліжэйшымі абнаўленнямі, думаю, распрацоўшчыкі дададуць адсутнічаюць магчымасці.

Налада і стварэнне хлебных дробак з дапамогай плагіна WordPress SEO by Yoast

У гэтай артыкул я раскажу, як стварыць, наладзіць і аформіць хлебныя крошкі з дапамогай плагіна WP SEO by Yoast. Дадзены убудова я ўсім рэкамендую выкарыстоўваць у якасці асноўнага SEO ўбудовы.

Пачну з самага пачатку - ўстаноўкі плагіна. Спампаваць убудова можна тут старонка на WP.org . Усталёўваючы убудова.

Зараз можна прыступаць да непасрэднага рэдагавання хлебных дробак WordPress сайта:

1. У адмінку WordPress пераходзім у пункт SEO >> Дадаткова:

2. Загрузіце старонка дадатковых налад плагіна WordPress SEO by Yoast. Тут нас цікавіць старонка «Навігацыйная ланцужок (breadcrumbs)»:

Прабяжымся па наладах:

1. Пункт Уключыць навігацыйную ланцужок (breadcrumbs) - ставім галачку. Але для з'яўлення хлебных дробак на сайце неабходна ўсталяваць у код сайта наступную php функцыю, якая адказвае за выснову:

1. Усталёўваем падзельнік, у дадзеным полі можна ўставіць любы сімвал які падтрымліваецца HTML5. Вось парачка варыянтаў:
2. Тэкст спасылкі на галоўную старонку - Можна ўсталяваць дамен або проста «Галоўная»;
3. Прэфікс (асноўны) - слова ці сімвал перад усімі хлебнымі дробка. У мяне, напрыклад, вось такая стрэлачка ➥
4. Прэфікс навігацыйнай ланцужкі для архіваў - таксама што і вышэй толькі для старонак Архіваў;
5. Прэфікс навігацыйнай ланцужкі для старонак з вынікамі пошуку - для вынікаў пошуку;
6. Навігацыі ланцужок для старонкі 404 - для старонак з кодам адказу 404
7. Вылучыць тлустым шрыфтам апошняю старонку ў навігацыйнай ланцужку - дадзены пункт можна назваць непатрэбным переспамом. Так як часта апошняя старонка ў навігацыйнай ланцужку бывае ідэнтычная загалоўку старонкі;
8. Таксанамія, якая будзе паказана ў навігацыйнай ланцужку для тыпаў Запісаў - выбіраем паміж рубрыкамі (рэкамендавана), пазнакамі і фарматамі.
9. Захоўваем змены.

Пасля таго, як функцыі вываду хлебных дробак цалкам настроены, неабходна дадаць PHP код ўбудовы WP SEO by Yoast:

У файл: single.php

пасля радкі: get_header (); ?>

да радкі: <div id = "primary" class = "content-area">

Вставляем код:

<? Php

if (function_exists ( 'yoast_breadcrumb')) {

yoast_breadcrumb ( '

<P id = "breadcrumbs"> ',' </ p>

');

}

?>

Як прыбраць назву артыкула ў "хлебныя дробкі"

Далей трэба зразумець неабходна вам прыбраць "апошнюю галінку", гэта значыць назву артыкула, або непатрэбна !!! Калі неабходна прыбраць, то які капіюецца і вставляем код у файл тэмы functions.php:

Адкрываем файл тэмы functions.php і ў самым пачатку пасля октрывающегося php вставляем:

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

Як змяніць знешні выгляд "хлебных дробак" з дапамогай CSS

1. На скрыншоце вышэй блок атрымаўся даволі сімпатычным, але на некаторых сайтах па змаўчанні атрымліваецца вельмі непрыгожа. Што мы робім? Проста прысвойваем любы CSS клас "хлебным дробках":

2. І ўжо ў style.css сваёй тэмы прапісваем тыя стылі, якія нам патрэбныя, у маім выпадку гэта выглядае так:

Нагадаю, вы можаце з лёгкасцю скапіяваць стыль любога ўпадабанага элемента на любым сайце, проста выкарыстаўшы Firebug (дадатак для Firefox), ды і проста ў ім можаце "пагуляцца" са шрыфтамі і іншае, каб зразумець, як лепш будзе для Вашага сайта. З маімі стылямі атрымалася вось што (афармленне, па-мойму, вельмі нават сімпатычны):

Артыкул ўзятая з адкрытых крыніц:

1. http://samsebewebmaster.ru/samouchitel-wordpress/xlebnye-kroshki-wordpress.html

2. http://wpnew.ru/raskrutka-bloga/seo_optimizaciya/hlebnye-kroshki.html

Падобныя артыкулы: