Advertisements

How to create breadcrumb in wordpress without plugin?

Advertisements

In this article we will teach you how to create breadcrumb in wordpress without plugin.

Breadcrumb is important module of your website or blog. It allows your website visitors navigate through your website pages, posts or categories and increases your website’s page views.

First of all paste the code given below in your functions.php file located at root_directory_path/wp-content/themes/your_theme/functions.php

function get_breadcrumb() {

	echo '&#127962; <a href="'.home_url().'" rel="nofollow">Home</a>';
	
	if (is_category() || is_single()) {
		echo "&nbsp;&nbsp;&#187;&nbsp;&nbsp;";
		the_category(' &#187; ');
		if (is_single()) {
			echo " &nbsp;&nbsp;&#187;&nbsp;&nbsp; ";
			the_title();
		}
	} elseif (is_page()) {
		echo "&nbsp;&nbsp;&#187;&nbsp;&nbsp;";
		echo the_title();
	} elseif (is_search()) {
		echo "&nbsp;&nbsp;&#187;&nbsp;&nbsp;Search Results for... ";
		echo '"<em>';
		echo the_search_query();
		echo '</em>"';
	}
}

Now we have a function get_breadcrumb() and we can create breadcrumb at any place of our website or blog. Let’s say we are creating a breadcrumb in header of our website or blog. Then we will call function get_breadcrumb() at our header file located at root_directory_path/wp-content/themes/your_theme/header.php

<?php if (!is_home()): ?>
      <div class="breadcrumb">
        <?php get_breadcrumb(); ?>
      </div>
<?php endif; ?>

And here we have added a if condition !is_home() because we don’t want to show breadcrumb on home page of our website or blog.

And here below is a css of our breadcrumb. So, paste this css in your style.css file located at root_directory_path/wp-content/themes/your_theme/style.css

.breadcrumb{
	background: #FFF;
	margin-top: 2%;
	padding: 10px 20px;
}

That’s it Now you have learned how to create breadcrumb in wordpress without plugin and try, test and create your breadcrumb in your website or blog without plugin.

And if you want more tutorials and tricks about wordpress then visit our WordPress Page and follow us on facebook, twitter, tumblr, linkdedin and if you like this article then share this.