Snippet

Jak łatwo dodać okruszki do swojego motywu WordPress

Jak dodać okruszki do motywu WordPressDodaj okruszki do strony WordPressWtyczka okruszki WordPressWłącz okruszki w WordPressFragment kodu okruszków dla WordPressSamouczek dotyczący okruszków w motywie WordPressZainstaluj okruszki w WordPressRęcznie dodaj okruszki do WordPressKonfiguracja okruszków WordPressDodawanie nawigacji okruszków w WordPress

Objaśnienie

Okruszki nawigacyjne to jak ślad linków, który pokazuje, gdzie znajdujesz się na stronie internetowej. Pomagają użytkownikom łatwo wrócić do poprzednich stron. Oto jak ten kod dodaje okruszki do Twojego motywu WordPress:

  • Podłączenie: Kod łączy funkcję okruszków nawigacyjnych z określoną akcją za pomocą add_action. Oznacza to, że informuje WordPress, kiedy i gdzie wyświetlić okruszki.
  • Link do Strony Głównej: Zaczyna od dodania linku do strony głównej, która jest punktem wyjścia dla ścieżki okruszków.
  • Strony Kategorii i Tagów: Jeśli znajdujesz się na stronie kategorii, tagu lub niestandardowej taksonomii, pokazuje hierarchię terminów prowadzących do aktualnego. Pomaga to użytkownikom zobaczyć ścieżkę, którą przeszli, aby tam dotrzeć.
  • Pojedyncze Posty: Dla pojedynczych postów zawiera linki do archiwum typu postu oraz do wszelkich kategorii, do których należy post, kończąc na tytule posta.
  • Strony: Na stronach pokazuje strony nadrzędne prowadzące do aktualnej strony, jeśli takie istnieją.
  • Strony Wyników Wyszukiwania i 404: Obsługuje również wyniki wyszukiwania i strony błędu 404, wyświetlając odpowiednie komunikaty.

Aby wyświetlić okruszki, używasz funkcji wp_dudecom_get_breadcrumbs() wszędzie tam, gdzie chcesz, aby się pojawiły w swoim motywie.

Kod

1<?php 2// Add breadcrumbs to WordPress theme 3 4// Hook the breadcrumbs function to an appropriate action 5add_action('wp_dudecom_breadcrumbs', 'wp_dudecom_display_breadcrumbs'); 6 7/** 8 * Display breadcrumbs navigation 9 */ 10function wp_dudecom_display_breadcrumbs() { 11 // Security check: Ensure this is not accessed directly 12 if (!defined('ABSPATH')) { 13 exit; 14 } 15 16 // Start the breadcrumbs output 17 echo '<nav class="wp-dudecom-breadcrumbs" aria-label="breadcrumb">'; 18 echo '<ul>'; 19 20 // Home link 21 echo '<li><a href="' . esc_url(home_url('/')) . '">' . esc_html__('Home', 'textdomain') . '</a></li>'; 22 23 // Check if we are on a category, tag, or custom taxonomy archive 24 if (is_category() || is_tag() || is_tax()) { 25 $term = get_queried_object(); 26 if ($term->parent != 0) { 27 $ancestors = array_reverse(get_ancestors($term->term_id, $term->taxonomy)); 28 foreach ($ancestors as $ancestor) { 29 $ancestor_term = get_term($ancestor, $term->taxonomy); 30 echo '<li><a href="' . esc_url(get_term_link($ancestor_term)) . '">' . esc_html($ancestor_term->name) . '</a></li>'; 31 } 32 } 33 echo '<li>' . esc_html($term->name) . '</li>'; 34 } 35 36 // Check if we are on a single post 37 elseif (is_single()) { 38 $post_type = get_post_type(); 39 if ($post_type != 'post') { 40 $post_type_object = get_post_type_object($post_type); 41 echo '<li><a href="' . esc_url(get_post_type_archive_link($post_type)) . '">' . esc_html($post_type_object->labels->singular_name) . '</a></li>'; 42 } 43 $categories = get_the_category(); 44 if ($categories) { 45 $category = $categories[0]; 46 $ancestors = array_reverse(get_ancestors($category->term_id, 'category')); 47 foreach ($ancestors as $ancestor) { 48 $ancestor_category = get_category($ancestor); 49 echo '<li><a href="' . esc_url(get_category_link($ancestor_category)) . '">' . esc_html($ancestor_category->name) . '</a></li>'; 50 } 51 echo '<li><a href="' . esc_url(get_category_link($category)) . '">' . esc_html($category->name) . '</a></li>'; 52 } 53 echo '<li>' . esc_html(get_the_title()) . '</li>'; 54 } 55 56 // Check if we are on a page 57 elseif (is_page()) { 58 global $post; 59 if ($post->post_parent) { 60 $ancestors = array_reverse(get_post_ancestors($post->ID)); 61 foreach ($ancestors as $ancestor) { 62 echo '<li><a href="' . esc_url(get_permalink($ancestor)) . '">' . esc_html(get_the_title($ancestor)) . '</a></li>'; 63 } 64 } 65 echo '<li>' . esc_html(get_the_title()) . '</li>'; 66 } 67 68 // Check if we are on a search page 69 elseif (is_search()) { 70 echo '<li>' . esc_html__('Search results for:', 'textdomain') . ' ' . esc_html(get_search_query()) . '</li>'; 71 } 72 73 // Check if we are on a 404 page 74 elseif (is_404()) { 75 echo '<li>' . esc_html__('Error 404', 'textdomain') . '</li>'; 76 } 77 78 echo '</ul>'; 79 echo '</nav>'; 80} 81 82/** 83 * Function to display breadcrumbs 84 */ 85function wp_dudecom_get_breadcrumbs() { 86 do_action('wp_dudecom_breadcrumbs'); 87} 88?>

Instrukcja

Lokalizacja pliku: Dodaj kod do pliku functions.php swojego motywu lub utwórz plik własnej wtyczki.

Wymagania wstępne: Nie są wymagane dodatkowe wtyczki ani ustawienia.

Kroki wdrożenia:

  1. Dostęp do plików WordPress:
    • Zaloguj się do panelu administracyjnego WordPress.
    • Przejdź do Wygląd > Edytor motywu, jeśli edytujesz plik functions.php, lub użyj klienta FTP, aby uzyskać dostęp do plików WordPress, jeśli tworzysz wtyczkę.
  2. Dodaj kod:
    • Skopiuj podany fragment kodu.
    • Wklej go do pliku functions.php aktywnego motywu lub do pliku własnej wtyczki.
    • Zapisz zmiany.
  3. Wyświetl okruszki nawigacyjne:
    • Zdecyduj, gdzie chcesz, aby okruszki nawigacyjne pojawiały się w twoim motywie (np. nagłówek, stopka lub konkretne pliki szablonów).
    • Otwórz odpowiedni plik szablonu (np. header.php, single.php, page.php).
    • Wstaw następującą funkcję w miejscu, gdzie chcesz, aby okruszki nawigacyjne były wyświetlane: wp_dudecom_get_breadcrumbs();
    • Zapisz zmiany w pliku szablonu.
  4. Przetestuj okruszki nawigacyjne:
    • Odwiedź swoją stronę internetową i przejdź przez różne strony, posty i kategorie, aby upewnić się, że okruszki nawigacyjne wyświetlają się poprawnie.

Jeśli potrzebujesz pomocy przy wdrożeniu lub bardziej zaawansowanej funkcjonalności, rozważ skorzystanie z usług wp-dude.com.