Instalacja i konfiguracja bułki tartej WordPress. Jak zrobić bułkę tartą bez wtyczki Breadcrumb NavXT

Pozdrowienia, drodzy czytelnicy bloga. W tym artykule pokażę jak zrobić pasek nawigacyjny, który będzie widoczny u góry przed nagłówkami artykułów. Dzięki temu łańcuchowi nawigacji jest to dla mnie proste wtyczka dlaWordPressa— Bułka tartaNavXT, co oznacza „bułka tarta”.

Wtyczka otrzymała taką nazwę, ponieważ jej autorowi, Johnowi Havlikowi, spodobała się bajka o braciach Grimm, w której chłopiec Jaś posypał bułką tartą, aby znaleźć drogę powrotną. To prawda, bardziej logiczne byłoby nazwanie wtyczki „kamykami”, ponieważ według opowieści z bajki Jaś i Małgosia nie mogli znaleźć drogi powrotnej, ponieważ bułka tarta została zjadana przez ptaki. No cóż, nie o to chodzi, najważniejsze jest to, że ta wtyczka pomoże odwiedzającym nie zgubić się na Twojej stronie i poinformuje Cię dokładnie, gdzie i w jakiej kategorii (części witryny) się aktualnie znajdują.

Dodatkowo wtyczka Breadcrumb NavXT pomaga równomiernie rozłożyć ciężar statyczny na wszystkie strony serwisu, co jest bardzo ważne dla jego promocji Wyszukiwarki. Na wypadek, gdybyś tak myślał linkowanie wewnętrzne(optymalizacja) strony nie jest aż tak ważna, polecam przeczytać tę, dzięki której zmienisz swój punkt widzenia.

Dlatego w tym artykule pokażę, jak to wdrożyć tę nawigację na swojej stronie internetowej lub blogu za pomocą Wtyczka Breadcrumb NavXT , jak również prosty kod.

Instalowanie wtyczki chlebowej Bułka tarta NavXT.

1 ) Jak zwykle pobierz wtyczkę i wgraj ją na bloga, aktywuj.

2 ) Teraz musimy umieścić specjalny kod w miejscu, w którym chcesz zobaczyć linię bułka tarta. Aby to zrobić, przejdź do „ wygląd» „edytor” i wybierz plik, do którego wkleisz kod. Najczęściej kod wtyczki wstawiany jest do pliku „single Entry” (single.php) bezpośrednio przed lub po tytule artykułu. Jeśli w ogóle nie rozumiesz kodów, po prostu poszukaj dwóch tagów na samym początku kodu

I , które odpowiadają za wyświetlanie nazw publikacji. Mój kod wygląda następująco: <h2>" tytuł="(!JĘZYK:<?php the_title (); ?>!}"><?php the_title (); ?></h2> Gdy znajdziesz coś podobnego, natychmiast wklej przed nim ten kod nawigacyjny i zaktualizuj plik. <?php (bcn_display();) ?> Nawiasem mówiąc, jeśli nie lubisz nawigacji poziomej i chcesz, aby była wyświetlana w pionie, to musisz wstawić ten kod zamiast poprzedniego. <?php if (function_exists ("bcn_display_list")) { bcn_display_list(); }?> Dobrze, jak widać, masz teraz pasek nawigacyjny, ale bez wyświetlania daty publikacji na samym końcu, jak ja. Jeśli chcesz dołączyć go do swojego paska nawigacyjnego, wystarczy, że znajdziesz w swoim motywie kod odpowiedzialny za wyświetlanie daty publikacji i dodasz go po kodzie nawigacyjnym. <?php if (funkcja_istnieje("bcn_display")) (bcn_display();) ?>> Opublikowany<?php the_time (" j F Y"); ?></div> Jeżeli coś nie jest jasne to > - wyświetla mi taką strzałkę > i litera j - oznacza dzień, F - miesiąc, Y - rok. Myślę, że po takich wyjaśnieniach znalezienie takiego kodu nie będzie dla Ciebie trudne. OK, teraz spójrzmy na projekt. Sam styl czcionki i kolor łączy paska nawigacji są pobierane ze stylów motywu, ale jeśli Ci się nie podobają i chcesz je zmienić, po prostu dodaj tę dodatkową linię do kodu, który wkleiliśmy powyżej. <divclass="breadcrumb"></div> W rezultacie powinieneś otrzymać taki kod: <divclass="breadcrumb"> <?php if (funkcja_istnieje("bcn_display")) { bcn_display();> } ?> </div> Teraz przejdź do „edytora wyglądu” i otwórz plik „arkusza stylów” (style.css). I wklej <a href="https://rustrackers.ru/pl/setting-up-software/kakoi-princip-kodirovaniya-informacii-ispolzuetsya-v-kompyutere/">ten kod</a> prawie do samego dołu i zaktualizuj plik. .bułka tarta ( czcionka: pogrubiona 12px „Trebuchet MS”, Verdana, Arial; dopełnienie-dół: 10px; } .bułka tarta a( kolor: #1B7499; } .breadcrumb a:hover ( kolor: #EF0E0E; } Witam, drodzy czytelnicy bloga. Dzisiaj chcę porozmawiać o wtyczce do WordPressa, która jest używana na moim blogu w dwóch bardzo ważnych celach.Po pierwsze ułatwia nawigację, a po drugie rozwiązuje bardzo ważny problem - stworzenie prawidłowego linkowania wewnętrznego. Aby nie przedłużać intrygi, od razu powiem, że porozmawiamy o wtyczce Breadcrumb NavXT. Ale najpierw najważniejsze.Mówiłem już dużo o konieczności stworzenia odpowiedniego linkowania stron serwisu, tak aby ciężar statyczny przenoszony przez wszelkie linki zewnętrzne był równomiernie rozłożony na wszystkie strony projektu. Jest to szczególnie ważne.<h2>Dlaczego potrzebujesz bułki tartej w WordPress?</h2>Promocja poprzez LF ma szereg zalet, z których główną (szczególnie istotną w przypadku projektów niekomercyjnych) jest to, że nie wymaga inwestycji środków niezbędnych do zakupu linków zewnętrznych. Dzieje się tak dlatego, że awans w LF możliwy jest jedynie dzięki samej stronie wewnętrznej i stworzeniu prawidłowego linkowania, zgodnie z opisem.Nawiasem mówiąc, w przypadku projektów komercyjnych promocja przez niską częstotliwość ma również wiele zalet, z których główną jest znowu niższy koszt, ale poza tym odwiedzający, którzy przybyli z wyników wyszukiwania takich zapytań, będą znacznie bardziej skłonni do przeliczenia na banknoty niż goście, którzy pochodzili z zapytań o średniej i dużej częstotliwości (ze względu na niejasność tego ostatniego).Główną ideą prawidłowego linkowania jest zapewnienie, że ciężar statyczny przenoszony na różne strony serwisu (większość linków zewnętrznych zwykle prowadzi do strony głównej) przepływa bez problemów do tych, które są bezpośrednio promowane wzdłuż LF (gdzie artykuły rzeczywiście się znajdują).Jednak idealny schemat kołowy opisany w powyższym artykule jest trudny do wdrożenia w rzeczywistych warunkach, dlatego dobrym rozwiązaniem byłby schemat łączenia sferycznego. Z grubsza rzecz biorąc, taki schemat można przesadzić do tego stopnia, że im więcej będzie ogniw wewnętrznych, tym lepiej rozłożony zostanie ciężar statyczny. To jest jak rozgałęziony układ krwionośny, który pozwala krwi transportować tlen do wszystkich narządów wewnętrznych, nawet tych najbardziej oddalonych od płuc.Za każdym razem, gdy piszesz artykuły, możesz ręcznie dodać linki do innych materiałów w swojej witrynie, które będą istotne. To prawda, że bardzo poważnie podchodzisz do wewnętrznej listy zakotwiczeń, którą tworzysz dla każdego artykułu. Należy to zrobić w przybliżeniu w taki sam sposób, jak. Nie powinieneś używać tego samego nierozcieńczonego klucza we wszystkich odniesieniach do tego, cóż, wiesz, co mam na myśli.Jest to bardzo dobra metoda, jednak zawsze warto ją rozbudowywać i uzupełniać metodami automatycznymi. Jedną z najczęściej spotykanych opcji organizowania czegoś takiego są tzw. breadcrumbs, które rozszerzają możliwości poruszania się po zasobach. , a także utworzenie bloku linków do innych podobnych materiałów Twojego projektu, podobnych tematycznie do tego artykułu.Dziś chcę szczegółowo przyjrzeć się pierwszej opcji, ale o podobnych materiałach dla WordPressa w .Do implementacji breadcrumbów użyjemy wtyczki Breadcrumb NavXT. W zasadzie do tych celów można używać innych wtyczek WordPress, ale te przypadły mi do gustu najbardziej. To nawet możliwe.<h3>Instalowanie wtyczki Breadcrumb NavXT w WordPress</h3>OK, czas przejść do instalacji i konfiguracji wtyczki. Jeśli nagle nie wiesz, co to jest bułka tarta, nie ma problemu. Właściwie ja też na początku nie wiedziałam, bo to określenie zostało zaczerpnięte od mieszczaństwa i kojarzy się z ich mieszczańską bajką o Jaśku i Grecie, którzy używali ich do oznaczania ścieżki.W naszym rozumieniu ten element nawigacji serwisu należy nazwać „nicią Ariadny”, bo jest nam w jakiś sposób bliższy. No cóż, tak to nazywali. Dlatego zazwyczaj pojawiają się one gdzieś u góry okna witryny i zasadniczo stanowią ścieżkę do artykułu, który aktualnie czytasz.Na przykład bardzo lubię nawigację za pomocą okruchów i zawsze staram się znaleźć ich linię na dowolnej stronie, aby zrozumieć, gdzie właściwie jestem i jak przejść do sekcji, w której znajduje się ten wspaniały artykuł, aby przeczytać więcej na ten sam temat .Pamiętasz, co to jest bułka tarta? Myślę, że pamiętałeś, ale jeśli nie, spójrz na samą górę tego okna pod nagłówkiem tego bloga.Najpierw musisz pobrać Breadcrumb NavXT stąd. Instalacja wtyczki na WordPressie jest standardem. Połącz się ze swoim blogiem poprzez FTP (praca z klientem FileZilla została szczegółowo opisana) i otwórz folder na serwerze:/wp-content/pluginsRozpakuj archiwum za pomocą Breadcrumb NavXT i skopiuj powstały folder na serwer hostujący w katalogu (/wp-content/plugins). Teraz musisz przejść do obszaru administracyjnego WordPress, wybrać „Wtyczki” z lewego menu i w oknie, które zostanie otwarte, przejdź do zakładki „Nieaktywne”. Znajdź linię zawierającą to, czego potrzebujesz i kliknij tekst „Aktywuj” znajdujący się tuż poniżej.<h2>Wywoływanie Breadcrumb NavXT i dostosowywanie wyglądu okruchów</h2>Właściwie to wszystko. Teraz pozostał jeszcze jeden ważny szczegół: wybierz w szablonie WordPress (motywie) miejsce, w którym wyświetli się linia z nawigacją, i wstaw w to miejsce kod funkcji wtyczki Breadcrumb NavXT. Zadanie nie jest całkiem trywialne dla początkującego webmastera, który nie jest zaznajomiony ze strukturą silnika i działaniem jego motywów.Ale to prawdopodobnie Cię nie zmyli, ponieważ... zawsze możesz przeczytać, na szczęście nie ma tam nic skomplikowanego.Jeśli znasz już strukturę motywów i znasz cel niektórych szablonów, będziemy kontynuować. Ale w przeciwnym razie nadal radzę przynajmniej powierzchownie zapoznać się z tym, korzystając z materiału wskazanego powyżej (lub innego).Naszym zadaniem jest więc zidentyfikowanie tych plików z folderu z motywem, którego używasz, w którym będziemy musieli wstawić kod wywołujący okruchy. A potem będziesz musiał dokładnie zdecydować, gdzie w kodzie wstawimy to: <div class="breadcrumb"> <?php if(function_exists("bcn_display")) { bcn_display(); } ?> </div> Najpierw musisz połączyć się ze swoim blogiem poprzez FTP i otworzyć folder z motywem, którego aktualnie używasz:Wp-content/themes/Nazwa motywu WordPressTeraz opowiem Ci, jak sam zrobiłem wyjście z bułki tartej, a Ty możesz wszystko powtórzyć za mną lub użyć własnej wersji wstawiania.Jeśli spróbujesz zwizualizować przeznaczenie szablonów z motywu, otrzymasz mniej więcej taki układ:Z tego układu możemy wywnioskować, że będziemy musieli wstawić kod wywołujący Breadcrumb NavXT do tych szablonów, które odpowiadają za wyświetlanie treści w centralnej części bloga: INDEX, SINGLE, ARCHIVE, PAGE lub SEARCH.Co prawda nie wyświetliłem okruchów w INDEKSIE, który odpowiada za utworzenie strony głównej WordPressa, bo dodatkowa nawigacja tam byłaby niepotrzebna.Wstawiłem go do: SINGLE (odpowiedzialny za tworzenie stron z artykułami), ARCHIWUM (formularze stron kategorii, archiwa tymczasowe, archiwa tagów), PAGE (formularze do stron statycznych, np. „O blogu”).Kod wywołujący Breadcrumb NavXT umieściłem w tych szablonach w tym samym miejscu - na samym początku, zaraz po pierwszej linijce: <?php get_header(); ?> żeby wyszło tak: <?php get_header(); ?> <div class="breadcrumb"> <?php if(function_exists("bcn_display")) { bcn_display(); } ?> </div> Dodałem kilka właściwości CSS dla klasy BREADCRUMB do pliku kaskadowego arkusza stylów STYLE.CSS z folderu motywu:Bułka tarta (czcionka: pogrubiona 12 pikseli „Trebuchet MS”, Verdana, Arial; dopełnienie dolne: 10 pikseli; ) .breadcrumb a( kolor: #1B7499; ) .breadcrumb a:hover ( kolor: #EF0E0E; )Te właściwości definiują wygląd bułki tartej w WordPressie: , a . Określają także kolor linków z bułki tartej (.breadcrumb a) oraz kolor linków po najechaniu na nie myszką (.breadcrumb a:hover). Ogólnie radzę przeczytać stronę.<h2>Funkcje i ustawienia wtyczki Breadcrumb</h2>Jesteś wolny i możesz robić, co ci się podoba. Jak to mówią, mistrz jest mistrzem. Ale dzięki temu określiliśmy jedynie lokalizację okruchów chleba i ustaliliśmy ich wygląd. Ale ta wtyczka wciąż ma sporo ustawień.Aby to zrobić, przejdź do obszaru administracyjnego WordPress i wybierz „Breadcrumb NavXT” z lewego menu w obszarze „Ustawienia”. W oknie, które zostanie otwarte, zobaczysz kilka zakładek:<img src='https://i0.wp.com/ktonanovenkogo.ru/image/breadcrumb-navxt.png' height="607" width="541" loading=lazy loading=lazy>Na karcie Ogólne możesz ustawić parametry, które będą stosowane do wszystkich stron Twojego bloga. W polu „Separator” określ znak, który będzie pełnił rolę separatora w bułce tartej. W moim przypadku jest to symbol „>”, który jest oznaczony specjalnym kodem, ponieważ Symbol „>”, jeśli zostanie umieszczony jawnie, zostanie zinterpretowany przez WordPress jako znak otwierającego tagu HTML.Ogólnie rzecz biorąc, istnieją (mnemoniki), których na przykład nie można wstawić bezpośrednio. Tutaj jest kilka z nich:Kod mnemoniczny Symbol „ ” & &< < > > ¤ ¤ ¦ ¦ § § © ª ? « « ® ® ° ° ± ± µ µ ¶ ¶ · ¹ ? € € Wybierz dowolny symbol jako separator bułki tartej.W polu „Maksymalna długość” możesz ustawić długość kotwicy (tekstu linku) w znakach. Ustawiłem limit długości na 60 znaków nie ze względów projektowych, ale ze względu na optymalizację treści.Wyszukiwarki mogą mieć ambiwalentne podejście do linków z tymi samymi kotwami, dlatego skracam je w małych fragmentach, aby były unikalne. Możliwe, że nie jest to naprawdę konieczne, ale na wszelki wypadek.<img src='https://i2.wp.com/ktonanovenkogo.ru/image/plagin-breadcrumb-navxt.png' width="100%" loading=lazy loading=lazy>W polach „Prefiks” i „Sufiks” możesz wpisać tekst, który będzie poprzedzał lub podążał za linkiem do strony głównej w bułce tartej.<img src='https://i1.wp.com/ktonanovenkogo.ru/image/breadcrumb-navxt-glavnay.png' width="100%" loading=lazy loading=lazy>Należy pamiętać, że ten tekst zostanie umieszczony w atrybucie TITLE tagu A i może zostać uznany przez wyszukiwarki za alternatywną kotwicę. Mam na myśli to, że powinien używać słów kluczowych związanych ze stroną główną Twojego bloga.Nie zapomnij zapisać zmian w ustawieniach wtyczki Breadcrumb NavXT za pomocą przycisku o tej samej nazwie. Następnie możesz przeglądać wszystkie zakładki. Przykładowo na poniższej stronie możesz ustawić ustawienia linku prowadzącego do strony, na której się teraz znajdujesz:<img src='https://i1.wp.com/ktonanovenkogo.ru/image/nastroika-breadcrumb-navxt.png' width="100%" loading=lazy loading=lazy><img src='https://i2.wp.com/ktonanovenkogo.ru/image/breadcrumb-navxt-tekushay.png' width="100%" loading=lazy loading=lazy>W kolejnej zakładce „Posty / Strony” możesz skonfigurować wyświetlanie linków do stron z artykułami i stron statycznych Twojego bloga:<img src='https://i1.wp.com/ktonanovenkogo.ru/image/nastroika-hlebnye-kroshki.png' height="607" width="541" loading=lazy loading=lazy>W przypadku artykułów umieściłem poprzedzający napis „Aktualny artykuł” i ująłem tekst w cudzysłów, stosując kod mnemoniczny (patrz lista kodów mnemonicznych powyżej):<img src='https://i2.wp.com/ktonanovenkogo.ru/image/breadcrumb-navxt-statiy.png' width="100%" loading=lazy loading=lazy>Przejdź do kolejnej zakładki „Kategorie”. W zasadzie wszystkie te same ustawienia są tutaj powtarzane, jak w poprzednich. Nie ustawiłem ramki (prefiksu i sufiksu) dla linków do kategorii, ale ustawiłem ramkę dla stron archiwum:<img src='https://i0.wp.com/ktonanovenkogo.ru/image/hlebnye-kroshki-nastroiki.png' width="100%" loading=lazy loading=lazy>W rezultacie nawigacja na stronach internetowych archiwum wygląda następująco:<img src='https://i2.wp.com/ktonanovenkogo.ru/image/breadcrumb-navxt-rubriki.png' width="100%" loading=lazy loading=lazy> Witajcie drodzy czytelnicy! Dzisiaj porozmawiamy o tym, czym są breadcrumbs, jakie funkcje pełnią na blogu i co najważniejsze, jak zainstalować i skonfigurować wtyczkę Breadcrumb NavXT, która pozwala na tworzenie Bułka tarta WordPressa. <h2>Co to jest bułka tarta</h2> „Breadcrumbs” pokazują ścieżkę na blogu, którą należy przejść ze strony głównej do strony bieżącej. Jest to rodzaj łańcucha nawigacji, którego każdy link jest linkiem do strony wyższego poziomu. Najwyższym poziomem jest blog główny. W idealnym przypadku ścieżka do dowolnej strony bloga ze strony głównej powinna zająć maksymalnie 3 kliknięcia myszką. Właściwie to strona główna - kategoria - post Lub strona główna - kategoria - kategoria - post, ale nie dłużej. Jest to konieczne dla wygody nie tylko użytkowników, ale także wyszukiwarek. Wyszukiwarki mogą indeksować posty o głębszej treści z pewnym opóźnieniem. Dodatkowo ich znaczenie w oczach wyszukiwarek maleje wraz ze wzrostem poziomu zagnieżdżenia. W rezultacie staraj się umieszczać linki do najważniejszych i najciekawszych artykułów na blogu na stronie głównej. Podobna funkcja na stronie nazywa się inaczej - nawigator, bułka tarta, ścieżka w witrynie, ale najpopularniejszą nazwą jest „bułka tarta”. Nazwa ta pochodzi od baśni o Jaśku i Grecie, w której bohaterowie rozsypali okruchy chleba, aby znaleźć drogę powrotną. Oprócz wygody i nawigacji spełniają jeszcze jedną ważną funkcję - usprawniają wewnętrzne linkowanie stron blogów. Wcześniej mówiłem już o trzech ważnych i ciekawych wtyczkach do linkowania wewnętrznego, które gorąco polecam każdemu zainstalować na swoim blogu. Breadcrumb NavXT można łatwo dodać do tej listy. Kiedy wyszukiwarki indeksują artykuł na blogu, od razu widzą, do której kategorii on należy i pełną ścieżkę do głównej, co pomaga im określić strukturę bloga. Tylko nie zapomnij dodać go do swojego bloga zarówno dla wyszukiwarek, jak i użytkowników. <h2>Instalacja i konfiguracja wtyczki Breadcrumb NavXT</h2> Instalacja Breadcrumb NavXT różni się nieco od tej, więc przyjrzyjmy się temu szczegółowo: 2. Rozpakuj archiwum i wgraj folder z plikami wtyczek na serwer w katalogu wp-content/plugins. Aby to zrobić, użyj FileZilla. 3. Aktywuj wtyczkę w sekcji „Wtyczki” w panelu administracyjnym WordPress. 4. Teraz musisz wstawić następujący kod: Drugim najpopularniejszym miejscem jest nagłówek strony. Aby to zrobić, kod należy wstawić tylko do jednego szablonu - header.php. Nie potrafię podać dokładnego miejsca, wszystko zależy od tematu. Odpowiednia jest tutaj metoda naukowego szturchania - wklej kod, zapisz, zobacz wynik, jeśli Ci się nie podoba, zmień lokalizację kodu w szablonie. Niektóre zaawansowane motywy domyślnie wyświetlają na blogu nawigację, ale nadal polecam korzystanie z wtyczki Breadcrumb NavXT, ponieważ ma ona bardziej elastyczne ustawienia. W takich przypadkach należy zastąpić standardowy kod w szablonach motywów odpowiedzialnych za wyświetlanie bułki tartej podanym powyżej kodem wtyczki. Standardowy kod powinien być pod wieloma względami podobny do podanego kodu wtyczki, więc znalezienie go nie będzie trudne (zwykle jest on zamknięty w tagu div, ID lub class, który również ma tę samą nazwę - breadcrumb). Po dodaniu kodu możesz zmienić wygląd bułki tartej WordPress. Aby to zrobić, dodaj style do klasy Breadcrumb w pliku style.css motywu, którego używasz. Oczywiście do tego trzeba znać podstawy CSS, dlatego radzę przeczytać darmowy tutorial CSS od Vlada Merzhevicha, który można pobrać z mojego bloga. Ustawienia wtyczki znajdują się w sekcji „Opcje” - „Breadcrumb NavXT”. W internecie można znaleźć crack do niego, lecz niestety z najnowszymi wersjami wtyczki działa on bardzo krzywo – większość ustawień pozostaje w języku angielskim. Dlatego rozważę ustawienia w języku angielskim, podając tłumaczenia i moje uwagi w najważniejszych punktach. Pierwsza zakładka nazywa się „Ogólne”. <img src='https://i1.wp.com/fairheart.ru/wp-content/uploads/2012/04/Breadcrumb-NavXT-Settings.png' align="center" width="100%" loading=lazy loading=lazy> Separator Breadcrumb - symbol, który będzie używany jako separator pomiędzy linkami w łańcuchu Breadcrumb. Breadcrumb Max Title Długość - tytuł strony używany jest jako link w łańcuchu nawigacji, opcja ta ustawia maksymalną długość tytułu, 0 - używany jest cały tytuł bez jego obcinania. Strona główna Breadcrumb - czy wskazać główny blog w bułce tartej. Radzę włączyć tę funkcję i nazwać ją zgodnie z nazwą swojego bloga. - tekst, który będzie widoczny na blogu głównym jeśli nie jest linkiem. <img src='https://i0.wp.com/fairheart.ru/wp-content/uploads/2012/04/Home-Template-Unlinked.png' align="center" height="70" width="363" loading=lazy loading=lazy> Przejdź do zakładki Bieżący przedmiot, co oznacza „Bieżący przedmiot” lub „Aktualna lokalizacja”. <img src='https://i2.wp.com/fairheart.ru/wp-content/uploads/2012/04/nastroyka-Breadcrumb-NavXT.png' align="center" width="100%" loading=lazy loading=lazy> Połącz bieżący element — wyświetla nazwę bieżącej strony jako łącze do niej lub nie. Paged Breadcrumb - obsługa nawigacji po stronie. Po włączeniu liczby będą wyświetlane w formie menu nawigacyjnego. — szablon określający nazwę aktualnej pozycji, gdy włączona jest obsługa nawigacji strony. Następna sekcja nosi nazwę „Posty i strony” – posty i strony. Wyświetlanie posttaksonomii - pokazuje wszystkie możliwe ścieżki prowadzące do wpisu. Post taksonomia – może być wyświetlana w opcjach ścieżki postu. Na swoim blogu wybrałem standardową opcję - Nagłówki. Szablon strony i szablon strony (bez połączenia)— podobnie do omówionych powyżej szablonów postów i szablonów postów (bez linków), tylko one będą wyświetlane w przypadku opublikowanych artykułów. Następna w kolejce jest sekcja „Kategorie i tagi”. <img src='https://i1.wp.com/fairheart.ru/wp-content/uploads/2012/04/kategorii-i-tegi-Breadcrumb-NavXT.png' align="center" width="100%" loading=lazy loading=lazy> W tej sekcji opisano szablony służące do tworzenia okruszków dla kategorii i tagów. Po prostu wykonaj te same kroki, co w przypadku szablonów postów omówionych powyżej. W sekcji możesz ustawić szablony strony autora (Author), daty/archiwum (Date), wyników wyszukiwania (Search) oraz błędów 404. <img src='https://i0.wp.com/fairheart.ru/wp-content/uploads/2012/04/Miscellaneous-Breadcrumb-NavXT.png' align="center" width="100%" loading=lazy loading=lazy> Nie korzystam z innych opcji, więc nie będę się rozpisywał o ich przeznaczeniu. No cóż, wszystko sobie wyjaśniliśmy! Gratulacje! Na tym kończę moją historię i żegnam się z Wami, ale nie na długo, bo już niedługo na moim blogu pojawi się kolejny ciekawy artykuł! Nawigacja nawigacyjna umożliwia odwiedzającemu witrynę zorientowanie się, w którym miejscu witryny się aktualnie znajduje. Zazwyczaj taka nawigacja składa się z linii linków umieszczonych w łańcuchu pod nagłówkiem witryny.Nawigacja ta prowadzi ze strony głównej serwisu do kategorii, do stron z artykułami, do poszczególnych stron serwisu. Wszystkie linki w bułce tartej są aktywne, z wyjątkiem ostatniego, ponieważ to właśnie tam znajduje się odwiedzający i link do tej strony serwisu nie jest potrzebny.Nawigacja Breadcrumb dodaje kolejny element do wewnętrznego linkowania witryny i pozwala odwiedzającemu na wygodne poruszanie się po stronach i sekcjach witryny, zwiększając w ten sposób czynniki behawioralne.Określenie „bułka tarta” zostało zaczerpnięte z niemieckiej baśni braci Grimm. W tej bajce dzieci wyznaczały drogę do lasu, zostawiając po drodze okruchy chleba, aby korzystając z pozostawionych okruchów chleba miały możliwość powrotu do domu.Na swoim blogu opisałem już instalację bułki tartej za pomocą wtyczki.Breadcrumbs możesz zainstalować na swojej stronie internetowej bez pomocy specjalnej wtyczki. Ma to swoje zalety, ponieważ nie zwiększa obciążenia Twojej witryny. Dlatego wskazane jest, jeśli to możliwe, zastąpienie wtyczek używanych na stronie poprzez wstawienie kodu i różnych skryptów.Uwaga! Przed instalacją kodu wykonaj kopie zapasowe plików, w których będziesz wklejał kody, aby w razie problemów móc przywrócić funkcjonalność motywu WordPress.Aby zainstalować bułkę tartą, będziesz musiał wkleić kilka kodów do odpowiednich plików swojego motywu.Nie ma potrzeby instalowania nawigacji nawigacyjnej na stronie głównej bloga. Odwiedzający wpisując w wyszukiwarce nazwę witryny, w zdecydowanej większości przypadków zostanie w wynikach wyszukiwania przekierowany na stronę główną witryny.Jeśli użytkownik przyszedł z wyszukiwania na konkretną stronę, zobaczy swoją lokalizację w witrynie za pomocą bułki tartej. Strona główna będzie hiperłączem, a odwiedzający będzie mógł przejść do strony głównej, jeśli skorzysta w tym celu z nawigacji nawigacyjnej.<h2>Instalacja bułki tartej na stronie</h2>Dwie wersje kodu będą musiały zostać wstawione do następujących plików motywu: „Funkcje motywu (funkcje.php)”, „Pojedynczy wpis (single.php)”, „Szablon strony (page.php)”, „Archiwa (arhvie .php)”, „ Wyniki wyszukiwania (search.php)”.Pierwszy kod należy wkleić do pliku „Funkcje motywu (functions.php)” zainstalowanego na blogu tematycznym WordPress.// funkcja nawigacyjna dimox_breadcrumbs() ( $showOnHome = 0; // 1 - pokaż bułkę tartą na stronie głównej, 0 - nie pokazuj $delimiter = """; // podziel pomiędzy "okruchy" $home = "Home "; // link tekstowy "Strona główna" $showCurrent = 1; // 1 - pokaż tytuł bieżącego artykułu/strony, 0 - nie pokazuj $before = " "; // znacznik przed bieżącym "okruchem" $after = ""; // znacznik po bieżącym "okruszku" globalnym $post; $homeLink = get_bloginfo("url"); if (is_home() || is_front_page()) ( if ($showOnHome == 1) echo " <div id="crumbs">„ . $dom ”.</div>"; ) jeszcze (echo " <div id="crumbs"> " . $home . " " . $delimiter . " "; if (is_category()) ( global $wp_query; $cat_obj = $wp_query->get_queried_object(); $thisCat = $cat_obj->term_id; $thisCat = get_category( $thisCat); $parentCat = get_category($thisCat->parent); if ($thisCat->parent != 0) echo(get_category_parents($parentCat, TRUE, " " . $delimiter . " ")); "", false). $po; ) elseif (is_day()) ( echo "" .get_the_time("Y") . " " . $separator . " "; echo "" . get_the_time("F") . " " . $separator . " "; echo $ przed . get_the_time("d") . elseif (jest_miesiąc()) ( echo "" . get_the_time("Y") . " " "; echo $przed .get_the_time("F") . $po; ) elseif (is_year()) ( echo $przed . get_the_time("Y") . $po; ) elseif (is_single() && !is_attachment()) ( if (get_post_type() != "post") ( $post_type = get_post_type_object(get_post_type()); $slug = $post_type->rewrite; echo "" . $post_type->labels->singular_name . " " . $delimiter . " "; if ($showCurrent == 1) powtórz $przed . get_the_title() . $po; ) else ( $cat = get_the_category(); $cat = $cat; echo get_category_parents($cat, TRUE, " " . $delimiter . " "); if ($showCurrent == 1) echo $before . get_the_title() . $po; ) ) elseif (!is_single() && !is_page() && get_post_type() != "post" && !is_404()) ( $post_type = get_post_type_object(get_post_type()); echo $przed . $post_type-> etykiety->pojedyncza nazwa . $po; ) elseif (is_attachment()) ( $parent = get_post($post->post_parent); $cat = get_the_category($parent->ID); $cat = $cat; echo get_category_parents($ kot, PRAWDA, " " $delimiter . " " $parent->post_title . " " . elseif (is_page() && !$post->post_parent) ( if ($showCurrent == 1) echo $przed .get_the_title() .$po;) elseif (is_page() && $post->post_parent) ( $parent_id = $post->post_parent; $breadcrumbs = array(); while ($parent_id) ( $page = get_page($parent_id); $breadcrumbs = "ID). "">" ). „”; $parent_id = $strona->post_parent; ) $bułka tarta = array_reverse($bułka tarta); foreach ($breadcrumbs jako $crumb) echo $crumb . „ ”. $separator. „ ”; if ($showCurrent == 1) echo $przed . get_the_title() . $po; ) elseif (is_search()) ( echo $before . "Wyniki wyszukiwania dla zapytania "" . get_search_query() . """ . $after; ) elseif (is_tag()) ( echo $before . "Posty oznaczone "" . single_tag_title("", fałsz) . """ . $after; ) elseif (is_author()) ( global $author; $userdata = get_userdata($author); echo $before . "Artykuły autora " . $userdata->display_name . $after; ) elseif (is_404 ()) ( echo $przed . "Błąd 404" . $po; ) if (get_query_var("paged")) ( if (is_category() || is_day() || is_month() || is_year() || is_search () ||. is_tag() ||. is_author()) echo " ("; echo __("Strona") . " " .get_query_var("paged"); if (is_category() || is_day() || is_month( ) ||. is_year() ||. is_tag() || is_author()) echo ")";</div>"; ) ) // koniec dimox_breadcrumbs()Aby wstawić ten kod do pliku motywu zainstalowanego na Twojej witrynie, musisz wejść w „Panel administracyjny WordPress” => „Wygląd” => „Edytor => „Szablony” i tam kliknąć pozycję „Funkcje motywu (funkcje. php) "W oknie „Edytuj motywy”, w pliku „Funkcje motywu ((functions.php)” będziesz musiał wstawić pierwszy kod na samą górę pliku, po<?php, как это показано стрелкой на изображении.<img src='https://i2.wp.com/vellisa.ru/wp-content/uploads/2012/11/24.png' width="100%" loading=lazy loading=lazy>Nazwa wpisu na stronie głównej to „Strona główna”. Jeśli chcesz, możesz ją zmienić na nazwę swojej witryny. Aby to zrobić, w odpowiedniej linii kodu musisz zastąpić słowo „Strona główna” nazwą swojej witryny.Jeśli chcesz, aby strona witryny lub nawigacja nawigacyjna nie wyświetlała nazwy strony, na której aktualnie się znajdujesz, to w tym celu musisz w następnej linii zmienić cyfrę „1” na cyfrę „0”.Po wstawieniu kodu i dokonaniu w nim zmian według własnego uznania, kliknij przycisk „Aktualizuj plik”.Do kilku plików zainstalowanego motywu należy wstawić następujący kod: „Pojedynczy wpis (single.php)”, „Szablon strony (page.php)”, „Archiwa (arhvie.php)”, „Wyniki wyszukiwania (wyszukiwanie .php)” „ <?php if (function_exists("dimox_breadcrumbs")) dimox_breadcrumbs(); ?> W pliku „Pojedynczy wpis (single.php)”, odpowiedzialnym za strony z artykułami, kod jest wstawiany w miejsce widoczne na obrazku.<img src='https://i0.wp.com/vellisa.ru/wp-content/uploads/2012/11/33.png' align="center" width="100%" loading=lazy loading=lazy>Po wstawieniu tego kodu należy kliknąć przycisk „Aktualizuj plik”.W pliku „Archives (arhvie.php)” wklej ten kod w miejsce zaznaczone w ramce na obrazku.<img src='https://i1.wp.com/vellisa.ru/wp-content/uploads/2012/11/43.png' align="center" width="100%" loading=lazy loading=lazy>Następnie kliknij przycisk „Aktualizuj plik”.W pliku „Wyniki wyszukiwania (search.php)”, który odpowiada za przeszukiwanie serwisu, wklej kod w miejscu wskazanym na obrazku.<img src='https://i2.wp.com/vellisa.ru/wp-content/uploads/2012/11/53.png' align="center" width="100%" loading=lazy loading=lazy>Po wstawieniu kodu kliknij przycisk „Aktualizuj plik”.W pliku „Page Template (page.php)”, który odpowiada za strony statyczne, wstaw kod jak pokazano na obrazku.<img src='https://i0.wp.com/vellisa.ru/wp-content/uploads/2012/11/63.png' align="center" width="100%" loading=lazy loading=lazy>Po zainstalowaniu kodu kliknij przycisk „Aktualizuj plik”.To wszystko, bułka tarta jest teraz zainstalowana w Twojej witrynie. Musisz otworzyć swoją witrynę i zobaczysz zainstalowaną nawigację. Jeśli Twoja witryna była w tym momencie otwarta, konieczne będzie odświeżenie strony, aby zobaczyć wprowadzone zmiany.Możesz także dodać ten kod do pliku „Arkusz stylów (style.ccs)”:/* Bułka tarta / #crumbs ( padding:10px 10px 0 15px; max-height:20px; overflow:hidden; line-height: 180%; border-radius:0 0 8px 8px; -moz- border-radius:0 0 8px 8px; -webkit- promień granicy:0 0 8px 8px;)Kod ten wstawiany jest na samym końcu pliku „Arkusz stylów (style.ccs)” w celu zmiany wyglądu zainstalowanej nawigacji nawigacyjnej. Kod, który należy wstawić do pliku „Arkusz stylów (style.php)” może mieć inne cechy (wymiary, wcięcia itp.). Nie ma potrzeby osadzania tego lub podobnego kodu na swoim blogu.Na mojej stronie, w poprzednim szablonie, nie instalowałem tego kodu; bardziej podobał mi się wygląd bułki tartej bez tych ulepszeń.<h2>Wnioski z artykułu</h2>Teraz na Twoim blogu zainstalowano Breadcrumbs bez użycia wtyczki. Twórcą tej funkcji jest słynny bloger Dimox (Dmitry). Tak zwane „bułka tarta” służą poprawie nawigacji w witrynie i pomagają odwiedzającemu witrynę dowiedzieć się, gdzie się teraz znajduje. Odwiedzający dowolną stronę witryny rozumie swoją lokalizację w strukturze bloga za pomocą bułki tartej.Breadcrumbs to kolejny element wewnętrznego linkowania stron internetowych. Nawigacja po witrynie jest uproszczona, co jest wygodne dla osoby odwiedzającej witrynę, a pod tym względem zwiększają się czynniki behawioralne.Samo określenie „Bułka tarta” zostało zaczerpnięte z baśni braci Grimm „Jaś i Małgosia”, w której dzieci zabierano do lasu. Za pierwszym razem, gdy ojciec na rozkaz złej macochy zabiera brata i siostrę do lasu, ci odnajdują drogę powrotną dzięki temu, że zostawili po drodze kamyki. Za drugim razem dzieci nie miały kamyków, a zamiast kamyczków zostawiły po drodze okruszki chleba, które zjadały leśne ptaki i dzieci zgubiły się w lesie. Po różnych przygodach dzieciom udało się jednak wrócić do domu.Zazwyczaj nawigacja Breadcrumbs to pasek u góry strony, który wygląda mniej więcej tak:Wszystkie sekcje serwisu, z wyjątkiem ostatniej, są linkami. Ostatnia sekcja nawigacyjna to dokładnie strona, na której się aktualnie znajdujesz. Nie ma potrzeby tworzenia hiperłącza do tej strony.Ten ostatni element niekoniecznie musi być osobną stroną, ale np. nazwą kategorii, jeśli należysz do jakiejś kategorii. W takim przypadku tytuł kategorii nie będzie już hiperłączem.Breadcrumbs można zainstalować na stronie internetowej za pomocą wtyczki lub bez użycia do tego specjalnej wtyczki. Najpierw przyjrzyjmy się instalacji bułki tartej za pomocą wtyczki Breadcrumb NavXT.<h2>Wtyczka Breadcrumb NavXT</h2>Aby zainstalować wtyczkę Breadcrumb NavXT należy zalogować się do „Panelu administracyjnego WordPressa” => „Wtyczki” => „Dodaj nową”. W polu „Wyszukaj” należy wpisać wyrażenie „Breadcrumb NavXT”, a następnie kliknąć przycisk „Wyszukaj wtyczki”. W oknie „Zainstaluj wtyczkę” pod nazwą wtyczki „Breadcrumb NavXT” kliknij link „Zainstaluj”.W otwartym oknie „Instalacja wtyczki: Breadcrumb NavXT” kliknij link „Aktywuj wtyczkę”. Następnie na pasku bocznym „Panelu administracyjnego WordPress” pojawił się nowy element „Breadcrumb NavXT”. Jeśli klikniesz na ten element, będziesz mógł wejść w ustawienia wtyczki breadcrumbs.Okno ustawień Breadcrumb NavXT zawiera sporo ustawień tej wtyczki. Ustawienia Breadcrumb NavXT można pozostawić na ustawieniach domyślnych. Jeśli chcesz, w zakładce „Podstawowe” możesz zmienić pozycję „Link do strony głównej”.Teraz musisz wstawić następujący kod do plików motywu, w miejscach, w których będą wyświetlane bułki tarte: <div class="breadcrumb"> <?php if(function_exists("bcn_display")) { bcn_display(); } >? </div> Zaleca się wstawienie tego kodu do następujących plików motywu: „Pojedynczy wpis (single.php)”, „Szablon strony (page.php)”, „Archiwa (arhvie.php)”, „Wyniki wyszukiwania (search.php). php)”.Aby wstawić ten kod należy wejść w „Panel administracyjny WordPressa” => „Wygląd” => „Edytor” => „Szablony”.W szablonie „Single Post (single.php)”, który odpowiada za strony z artykułami, wstawiany jest kod w sposób pokazany na tym obrazku.<img src='https://i0.wp.com/vellisa.ru/wp-content/uploads/2012/11/22.png' align="center" width="100%" loading=lazy loading=lazy>Po wstawieniu kodu kliknij przycisk „Aktualizuj plik”.<img src='https://i0.wp.com/vellisa.ru/wp-content/uploads/2012/11/31.png' align="center" width="100%" loading=lazy loading=lazy>Kod zostanie wstawiony, następnie należy kliknąć przycisk „Aktualizuj plik”.Będziesz także musiał wstawić ten kod do pliku „Archives (arhvie.php)”, który jest odpowiedzialny za kategorie.<img src='https://i1.wp.com/vellisa.ru/wp-content/uploads/2012/11/41.png' align="center" height="252" width="365" loading=lazy loading=lazy>Po wstawieniu kodu kliknij przycisk „Aktualizuj plik”.A po zainstalowaniu kodu w plikach motywu WordPress, kod jest wstawiany do pliku „Wyniki wyszukiwania (search.php)”, który odpowiada za przeszukiwanie witryny. Wklej kod w miejscu pokazanym na obrazku.<img src='https://i2.wp.com/vellisa.ru/wp-content/uploads/2012/11/51.png' align="center" width="100%" loading=lazy loading=lazy>Ten obraz pokazuje, jak wygląda nawigacja nawigacyjna. Nazwa strony głównej nie została zmieniona na nazwę serwisu.<img src='https://i2.wp.com/vellisa.ru/wp-content/uploads/2012/11/61.png' align="center" height="134" width="323" loading=lazy loading=lazy>Możesz także wstawić następujący kod do pliku „Arkusz stylów (style.ccs)” (jest to opcjonalne):Bułka tarta (czcionka: pogrubiona 12 pikseli „Trebuchet MS”, Verdana, Arial; dopełnienie dolne: 10 pikseli; ) .breadcrumb a( kolor: #1B7499; ) .breadcrumb a:hover ( kolor: #EF0E0E; )W tym kodzie możesz zmienić rozmiar i czcionkę (czcionka: pogrubiona 12px „Trebuchet MS”, Verdana, Arial), dopełnienie (dopełnienie: 10px), a także kolor linków nawigacyjnych w stanie statycznym i po najechaniu kursorem najedź na nie kursorem myszy (możesz zmieniać wartości cyfrowe).Odczyty w tym kodzie można zmienić według własnego uznania lub można znaleźć inny podobny kod w Internecie. Możesz także obejść się bez instalowania tego kodu w pliku „Arkusz stylów (style.ccs)”. W motywie, który zainstalowałem, po zainstalowaniu kodu, czcionka trochę się zmieniła.W tym artykule omówiono instalowanie bułki tartej na stronie internetowej za pomocą wtyczki Breadcrumb NavXT. W następnym artykule omówimy to pytanie - jak zainstalować bez użycia wtyczki.<h2>Wnioski z artykułu</h2>Za pomocą wtyczki Breadcrumb NavXT na stronie instalowana jest nawigacja, tzw. „breadcrumbs”, która pomaga użytkownikowi zorientować się, w której sekcji serwisu w danym momencie się znajduje. <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+""+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy loading=lazy>");</script> </div> </div> </div> </div> <aside role="complementary"> <div class="block cat-list"> <div class="block-title"> <h3>Kategorie</h3> </div> <div class="block-content"> <ul> <li> <a href="https://rustrackers.ru/pl/category/internet/">Internet</a> </li> <li> <a href="https://rustrackers.ru/pl/category/windows-10/">Windows 10</a> </li> <li> <a href="https://rustrackers.ru/pl/category/multimedia/">Multimedia</a> </li> <li> <a href="https://rustrackers.ru/pl/category/utilities/">Narzędzia</a> </li> <li> <a href="https://rustrackers.ru/pl/category/network-and-internet/">Sieć i Internet</a> </li> <li> <a href="https://rustrackers.ru/pl/category/system-programs/">Programy systemowe</a> </li> <li> <a href="https://rustrackers.ru/pl/category/configuring-programs/">Konfigurowanie programów</a> </li> <li> <a href="https://rustrackers.ru/pl/category/os-problems/">Problemy z systemem operacyjnym</a> </li> </ul> </div> </div> <div> </div> </aside> </div> </div> </section> </div> <footer class="b-footer"> <div class="container"> <div class="b-footer-content"> rustrackers.ru - Darmowe programy na Twój komputer </div> </div> </footer> <div id="back-top" class="back-top bounce-out"> <a href="#" title="Szczyt"></a> </div> <script src="/bitrix/templates/newit_siteblog_response/site_files/js/libs/jquery/jquery.js"></script> <script src="/bitrix/templates/newit_siteblog_response/site_files/js/vendor/jquery.colorbox-min.js"></script> <script src="/bitrix/templates/newit_siteblog_response/site_files/js/scripts.min.js"></script> <script src="/bitrix/templates/newit_siteblog_response/site_files/js/custom/custom.js"></script> </body> </html>