Guide to creating breadcrumbs in WordPress without using Plugin

Guide to creating breadcrumbs in WordPress without using Plugin

, also called hierarchical links, are one of the very useful components on the website. It helps to display the structure of your website content, and also bookmark and help google know the links in the website.

In search results, breadcrumbs will help you display category names instead of displaying regular links, which is also considered to be more SEO friendly and also one of the indispensable components of the SEOer.

breadcrumbs giúp hiển thị đường dẫn thư mục bằng tên thay vì link thô như trước

breadcrumbs help display directory paths with names instead of raw links as before

For users, breadcrumbs can help them access faster instead of having to dig into the menu.

Sự tường minh của breadcrumbs giúp người dùng dễ dàng truy cập hơn

The breadth of breadcrumbs makes it easier for users to access

Create breadcrumbs in WordPress

To create breadcrumbs in WordPress there are many ways, the simplest is to use Plugin. But usually when creating a website with wordpress I usually optimize the best possible, ie limit the use of Plugin as much as possible. Plugins can have more unnecessary functions that make your website worse and may conflict with many other plugins. My website only has 1 plugin to create sitemap, I will write my own function to use.

Open the functions.php file in your theme and add the following paragraph and file.

function dimox_breadcrumbs() {

$delimiter = '/';

$home = 'Trang chủ'; // Thay cho 'Home' link

$before = '<span>'; // trước mỗi link và $after = '</span>'; // sau mỗi link

if ( !is_home() && !is_front_page() || is_paged() ) {

echo '<ul class="clearfix">';

global $post;

$homeLink = get_bloginfo('url');

echo '<li><a href="' . $homeLink . '">' . $home . '</a></li> ' . $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 . ' '));

echo $before . 'Danh m?c "' . single_cat_title('', false) . '"' . $after;

} elseif ( is_day() ) {

echo '<li><a href="' . get_year_link(get_the_time('Y')) . '">' . get_the_time('Y') . '</a></li> ' . $delimiter . ' ';

echo '<li><a href="' . get_month_link(get_the_time('Y'),get_the_time('m')) . '">' . get_the_time('F') . '</a></li> ' . $delimiter . ' ';

echo $before . get_the_time('d') . $after;

} elseif ( is_month() ) {

echo '<li><a href="' . get_year_link(get_the_time('Y')) . '">' . get_the_time('Y') . '</a></li> ' . $delimiter . ' ';

echo $before . get_the_time('F') . $after;

} elseif ( is_year() ) {

echo $before . get_the_time('Y') . $after;

} elseif ( is_single() && !is_attachment() ) {

if ( get_post_type() != 'post' ) {

$post_type = get_post_type_object(get_post_type());

$slug = $post_type->rewrite;

echo '<li><a href="' . $homeLink . '/' . $slug['slug'] . '/">' . $post_type->labels->singular_name . '</a></li> ' . $delimiter . ' ';

echo $before . get_the_title() . $after;

} else {

$cat = get_the_category(); $cat = $cat[0];

echo get_category_parents($cat, TRUE, ' ' . $delimiter . ' ');

echo $before . get_the_title() . $after;

}

} elseif ( !is_single() && !is_page() && get_post_type() != 'post' && !is_404() ) {

$post_type = get_post_type_object(get_post_type());

echo $before . $post_type->labels->singular_name . $after;

} elseif ( is_attachment() ) {

$parent = get_post($post->post_parent);

$cat = get_the_category($parent->ID); $cat = $cat[0];

echo get_category_parents($cat, TRUE, ' ' . $delimiter . ' ');

echo '<li><a href="' . get_permalink($parent) . '">' . $parent->post_title . '</a></li> ' . $delimiter . ' ';

echo $before . get_the_title() . $after;

} elseif ( is_page() && !$post->post_parent ) {

echo $before . get_the_title() . $after;

} elseif ( is_page() && $post->post_parent ) {

$parent_id = $post->post_parent;

$breadcrumbs = array();

while ($parent_id) {

$page = get_page($parent_id);

$breadcrumbs[] = '<li><a href="' . get_permalink($page->ID) . '">' . get_the_title($page->ID) . '</a></li>';

$parent_id = $page->post_parent;

}

$breadcrumbs = array_reverse($breadcrumbs);

foreach ($breadcrumbs as $crumb) echo $crumb . ' ' . $delimiter . ' ';

echo $before . get_the_title() . $after;

} elseif ( is_search() ) {

echo $before . 'T?m ki?m cho "' . get_search_query() . '"' . $after;

} elseif ( is_tag() ) {

echo $before . 'Th? Tag "' . single_tag_title('', false) . '"' . $after;

} elseif ( is_author() ) {

global $author;

$userdata = get_userdata($author);

echo $before . 'Ðãng b?i ' . $userdata->display_name . $after;

} elseif ( is_404() ) {

echo $before . 'L?i 404' . $after;

}

if ( get_query_var('paged') ) {

if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ' (';

echo __('Page') . ' ' . get_query_var('paged');

if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ')';

}

echo '

</ul>';

}

} // end dimox_breadcrumbs()

You can customize it to fit your themes in your comments next to the code line.

Như vậy là bạn đã có 1 breadcrumbs tự tạo rồi đấy. Bây giờ thì nó sẽ được sử dụng trong theme như thế nào. Hàm bên dưới sẽ dùng để hiển thị ra breadcrumbs đã tạo.

<?php if(function_exists('dimox_breadcrumbs'))
 {
    dimox_breadcrumbs();
 }?>

Integrate the Schema structure for Breadcrumbs to display on Google

Completing the above, you can only get breadcrumbs. To display it correctly on Google you need to declare its structure.

Please change the above code into the code below

function dimox_breadcrumbs() {

$delimiter = '/';

$home = 'Trang chủ'; // ch? thay th? cho ph?n 'Home' link

$before = '<span property="itemListElement" typeof="ListItem" itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb">'; // th? html ð?ng trý?c m?i link 
$after = '</span>'; // th? ð?ng sau m?i link

if ( !is_home() && !is_front_page() || is_paged() ) {

echo '<ul class="clearfix" typeof="BreadcrumbList" vocab="http://schema.org/">';

global $post;

$homeLink = get_bloginfo('url');

echo '<li property="itemListElement" typeof="ListItem" itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="' . $homeLink . '" property="item" typeof="WebPage" title="TUẤN ĐC" href="' . $homeLink . '" itemprop="url">' . $home . '</a><meta property="position" content="1"></li> ' . $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 . ' '));

echo $before . 'Danh mục "' . single_cat_title('', false) . '"' . $after;

} elseif ( is_day() ) {

echo '<li><a href="' . get_year_link(get_the_time('Y')) . '">' . get_the_time('Y') . '</a></li> ' . $delimiter . ' ';

echo '<li><a href="' . get_month_link(get_the_time('Y'),get_the_time('m')) . '">' . get_the_time('F') . '</a></li> ' . $delimiter . ' ';

echo $before . get_the_time('d') . $after;

} elseif ( is_month() ) {

echo '<li><a href="' . get_year_link(get_the_time('Y')) . '">' . get_the_time('Y') . '</a></li> ' . $delimiter . ' ';

echo $before . get_the_time('F') . $after;

} elseif ( is_year() ) {

echo $before . get_the_time('Y') . $after;

} elseif ( is_single() && !is_attachment() ) {

if ( get_post_type() != 'post' ) {

$post_type = get_post_type_object(get_post_type());

$slug = $post_type->rewrite;

echo '<li><a href="' . $homeLink . '/' . $slug['slug'] . '/">' . $post_type->labels->singular_name . '</a></li> ' . $delimiter . ' ';

echo $before . get_the_title() . $after;

} else {

$cat = get_the_category(); $cat = $cat[0];


echo $before. '<a property="item" typeof="WebPage" title="'.$cat->name.'" href="' . $homeLink . '/cat/'.$cat->slug.'" class="taxonomy category" itemprop="url">
<span itemprop="title" property="name">'.$cat->name.'</span> 
</a> <meta property="position" content="2">' . $after . ' / ' ;


echo $before. '<a property="item" typeof="WebPage" title="'.$cat->name.'" href="' . get_the_permalink() .'" class="taxonomy category" itemprop="url">
<span itemprop="title" property="name">'.get_the_title().'</span> 
</a> <meta property="position" content="3">' . $after;



}

} elseif ( !is_single() && !is_page() && get_post_type() != 'post' && !is_404() ) {

$post_type = get_post_type_object(get_post_type());

echo $before . $post_type->labels->singular_name . $after;

} elseif ( is_attachment() ) {

$parent = get_post($post->post_parent);

$cat = get_the_category($parent->ID); $cat = $cat[0];

echo get_category_parents($cat, TRUE, ' ' . $delimiter . ' ');

echo '<li><a href="' . get_permalink($parent) . '">' . $parent->post_title . '</a></li> ' . $delimiter . ' ';

echo $before . get_the_title() . $after;

} elseif ( is_page() && !$post->post_parent ) {

echo $before . get_the_title() . $after;

} elseif ( is_page() && $post->post_parent ) {

$parent_id = $post->post_parent;

$breadcrumbs = array();

while ($parent_id) {

$page = get_page($parent_id);

$breadcrumbs[] = '<li><a href="' . get_permalink($page->ID) . '">' . get_the_title($page->ID) . '</a></li>';

$parent_id = $page->post_parent;

}

$breadcrumbs = array_reverse($breadcrumbs);

foreach ($breadcrumbs as $crumb) echo $crumb . ' ' . $delimiter . ' ';

echo $before . get_the_title() . $after;

} elseif ( is_search() ) {

echo $before . 'T?m ki?m cho "' . get_search_query() . '"' . $after;

} elseif ( is_tag() ) {

echo $before . 'Th? Tag "' . single_tag_title('', false) . '"' . $after;

} elseif ( is_author() ) {

global $author;

$userdata = get_userdata($author);

echo $before . 'Ðãng b?i ' . $userdata->display_name . $after;

} elseif ( is_404() ) {

echo $before . 'L?i 404' . $after;

}

if ( get_query_var('paged') ) {

if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ' (';

echo __('Page') . ' ' . get_query_var('paged');

if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ')';

}

echo '

</ul>';

}

} // end dimox_breadcrumbs()

You can customize it to fit your themes in your comments next to the code line.

And this is the test result on the google data checker

Google nhận dạng ra cấu trúc của Breadcrumb

Google identifies Breadcrumb’s structure

Do not care about the other 9 errors. That’s because I use meta tags of facebook, these tags are not recognized by google, so I made an error.

Update the new function

if(!function_exists('custom_breadcrumb')): 
		function custom_breadcrumb() {
			global $post;
 
			if(!is_front_page()){
				echo '<li> <a href="'.home_url().'">Trang chủ</a></li>';
			}
 
			if(is_singular(array('post'))){
				$cats=get_the_category();
				$catName=$cats[0]->name;
				$catID=get_cat_ID( $catName );
				$catLink=get_category_link($catID);
				echo '<li> <a href="'.$catLink.'">'.$catName.'</a></li>';
				$curTitle=get_the_title(($post->ID),0,14);
				$curTitle=(strlen($curTitle) >14)?substr($curTitle,0,14).'...':$curTitle;
				echo '<li class="active">'.$curTitle.'</li>';
			}
			// Your custom post type - Portfolio here
			if(is_singular(array('portfolio'))){
				$pType= get_terms('portfolio_type'); 
				if(is_array($pType)&& count($pType)>0){
					$portLink="#";
					$portName=$pType[0]->name;
					echo '<li> <a href="'.$portLink.'">'.$portName.'</a></li>';
				}
			}
			if(is_page()){ 
				$postParents=get_post_ancestors($post->ID);
				if(is_array($postParents) && count(($postParents)>0)){
					foreach ($postParents as $key => $value) {
						$pageLink=get_permalink($value);
						$pageTitle=get_the_title($value);
						echo '<li> <a href="'.$pageLink.'">'.$pageTitle.'</a></li>';
					}
				}
				$curTitle=get_the_title(($post->ID),0,14);
				$curTitle=(strlen($curTitle) >14)?substr($curTitle,0,14).'...':$curTitle;
				echo '<li class="active">'.$curTitle.'</li>';
 
 
			}
			if(is_category()){ 
				$category = get_category(get_query_var('cat'));
				$cat_id = $category->cat_ID;
				$theCat=get_cat_name($cat_id);
				echo '<li class="active">'.$theCat.'</a></li>';
			}
			if(is_tag()){
				echo '<li class="active">'.get_query_var('tag').'</a></li>';
			}
			if(is_author()){ 		
				echo '<li class="active">'. get_the_author_meta('user_nicename').'</a></li>';
			}
						if(is_search()){ 		
				echo '<li class="active">'. get_search_query().'</a></li>';
			}
 
		}
		endif;

Good luck !

Bài liên quan
Lượt xem