Bootstrap Breadcrumbs to WordPress

How to Bootstrap Breadcrumbs to WordPress

wprocket

Bootstrap Breadcrumbs HTML

<!-- breadcrumb -->
<div class="breadcrumb-wrap"><nav aria-label="breadcrumb">
<ol class="breadcrumb">
 	<li class="breadcrumb-item">You are here</li>
 	<li class="breadcrumb-item"><a href="#">Home</a></li>
 	<li class="breadcrumb-item"><a href="#">Blog</a></li>
 	<li class="breadcrumb-item active" aria-current="page">Blog title here</li>
</ol>
</nav></div>

WordPress Breadcrumbs with Bootstrap Class

Add this code to functions.php

/**
 * Generate breadcrumbs
 */
function get_breadcrumb() {
    echo '<ol class="breadcrumb">';
    if (!is_home()) {
        echo '<li class="breadcrumb-item">You are here</li>';
        echo '<li class="breadcrumb-item"><a href="';
        echo get_option('home');
        echo '">';
        echo 'Home';
        echo "</a></li>";
        if (is_category() || is_single()) {
            echo '<li class="breadcrumb-item">';
            the_category(' </li><li class="breadcrumb-item"> ');
            if (is_single()) {
                echo "</li><li class='breadcrumb-item active'>";
                the_title();
                echo '</li>';
            }
        } elseif (is_page()) {
            echo '<li class="breadcrumb-item">';
            echo the_title();
            echo '</li>';
        }
    }
    elseif (is_tag()) {single_tag_title();}
    elseif (is_day()) {echo"<li class='breadcrumb-item'>Archive for "; the_time('F jS, Y'); echo'</li>';}
    elseif (is_month()) {echo"<li class='breadcrumb-item'>Archive for "; the_time('F, Y'); echo'</li>';}
    elseif (is_year()) {echo"<li class='breadcrumb-item'>Archive for "; the_time('Y'); echo'</li>';}
    elseif (is_author()) {echo"<li class='breadcrumb-item'>Author Archive"; echo'</li>';}
    elseif (isset($_GET['paged']) && !empty($_GET['paged'])) {echo "<li>Blog Archives"; echo'</li>';}
    elseif (is_search()) {echo"<li class='breadcrumb-item'>Search Results"; echo'</li>';}
    echo '</ol>';
}

Breadcrumb in Single.php

Add this code to single.php

<!-- breadcrumb -->
<div class="breadcrumb-wrap">
    <nav aria-label="breadcrumb">
        <?php get_breadcrumb(); ?>
    </nav>
</div>

GenesisPro728x90

Facebook
Twitter
LinkedIn
Pinterest
Tumblr
Anwer Ashif

Anwer Ashif

Founder of RainaStudio. Help businesses and individuals to create and outstand their online presence. Our success rate is measurable. Our blog served all around the world and counting.

Leave a Reply

Your email address will not be published. Required fields are marked *