how to create breadcrumb in wordpress without plugin

How to create breadcrumb in wordpress without plugin?

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.

ReadyMadeCode
Author: ReadyMadeCode

ReadyMadeCode.com is a website where you can find Free Online Tutorials - Website Development Tutorials, App Development Tutorials, Coding Tutorials,Website Designing and Development From popular programming languages or scripts or framework like php, laravel, html, css, javascript, nodejs, java, angularjs etc. Download Emails | E-Books.

View All Posts From ReadyMadeCode
Author Website : https://www.readymadecode.com
Scroll to top

Subscribe For Latest Updates

Enter your email address to subscribe and receive notifications of posts & updates by email.


Want a Website / App / Digital Marketing Solution

Website & App Development Packages

%d bloggers like this:
We have updated our memberships. Please check here
Close X