Change Default Breadcrumbs with Rank Math

This topic has 18 replies, 4 voices, and was last updated 1 year, 8 months ago by Elise Noromit.

Viewing 19 posts - 1 through 19 (of 19 total)

Author

Posts
February 2, 2023 at 5:44 pm #439961

Cioppi88
Participant

Hi guys,
I’m trying to follow the guide you posted here -> https://xtemos.com/forums/topic/integrate-rank-math-seo-breadcrumbs/ in order to change the default woocommerce breadcrumbs with Rank Math breadcrumbs.

Can you please explain better how can I do?
The step you show on this thread doesn’t works for me.

February 4, 2023 at 3:31 am #440352
Elise Noromit
Member
Hello,

Please copy this file woocommerce/global/breadcrumb.php from the parent theme to the child theme keeping the same route. https://monosnap.com/file/qodfeNwVQpaXb9EEfQiRjQM6M3gAnF

Add the code:
```
if ( function_exists('rank_math_the_breadcrumbs') ) {
	rank_math_the_breadcrumbs();
	return;
}
```
Everything would work: https://monosnap.com/file/PEgzv0xdK3v677VyXegZI9EQv9B17Q

If you have any questions please feel free to contact us.

Best Regards
April 20, 2023 at 5:25 pm #461042

studio84digital
Participant

Dear this works well for the shop archive and product pages. Can this be used for the page and post breadcrumbs for the theme as well?

April 20, 2023 at 5:45 pm #461046

studio84digital
Participant

Some examples where breadcrumbs are shown: portfolio header, customer dashboard, posts archive and single posts

April 21, 2023 at 10:48 pm #461377
Elise Noromit
Member
Hello,

Please add this code to the functions.php of the child theme:
```
if ( ! function_exists( 'woodmart_current_breadcrumbs' ) ) {
	function woodmart_current_breadcrumbs( $type, $return = false ) {
		if ( $return ) {
			ob_start();
		}

		if ( function_exists('rank_math_the_breadcrumbs') ) {
			rank_math_the_breadcrumbs();

			if ( $return ) {
				return ob_get_clean();
			}

			return;
		}

		if ( woodmart_get_opt( 'yoast_' . $type . '_breadcrumbs' ) && function_exists( 'yoast_breadcrumb' ) ) {
			?>
			<div class="yoast-breadcrumb">
				<?php echo yoast_breadcrumb(); // phpcs:ignore ?>
			</div>
			<?php
		} elseif ( 'shop' === $type ) {
			woocommerce_breadcrumb();
		} else {
			woodmart_breadcrumbs();
		}

		if ( $return ) {
			return ob_get_clean();
		}
	}
} 
```
If you have any questions please feel free to contact us.

Best Regards
April 22, 2023 at 12:23 pm #461422

studio84digital
Participant

Hey Elise,

Thank you. 2 more questions:
– I notice mentions of yoast seo, Do I have to enable the yoast seo settings in the theme settings for it to work?
– Does this replace the previous code for the products as well or do I have to use both?

Thx in advance.
Regards, Bart

April 24, 2023 at 4:14 pm #461741

Elise Noromit
Member

Hello,

You do not need to enable Yoas if you do not use it.

This code rewrites the original functionality.

If you have any questions please feel free to contact us.

Best Regards

May 10, 2023 at 1:57 pm #465884

studio84digital
Participant

Hey Elise,

I notice the breadcrumbs need some top padding/margin on shop and product pages. They are not alligned with other filters, see here:
https://media.studio84.be/JruprkGz

Any tips? Thanks in advance.

May 11, 2023 at 1:43 am #466066

Elise Noromit
Member

Hello,

Your site access is not valid, please provide the shop page URL we will give CSS to add top margin.

Best Regards

May 12, 2023 at 12:01 pm #466409

studio84digital
Participant

See extra information

May 14, 2023 at 12:35 am #466730
Elise Noromit
Member
Hello,

Please add this code to the Theme Settings > Custom CSS > Global:
```
nav.rank-math-breadcrumb{
margin-top:30px;
}
```
Best Regards
May 15, 2023 at 12:49 pm #466965

studio84digital
Participant

Perfect, thank you Elise

May 16, 2023 at 2:10 am #467139

Elise Noromit
Member

You are welcome!

Wish you a wonderful day!

August 22, 2023 at 11:33 pm #490587
Puddle123
Participant
Replying to comment #466730

nav.rank-math-breadcrumb{
margin-top:30px;
}

Is it possible to modify this code so that it only applies on the shop pages, not the product pages etc? It is needed on the shop page to have the breadcrumbs displayed on a level with the filters, but on the product pages the extra margin is wasting a lot of space. Please see screenshots.
- This reply was modified 1 year, 8 months ago by Puddle123.
Attachments:
You must be logged in to view attached files.
August 23, 2023 at 4:20 am #490616
Elise Noromit
Member
Hello,

Please try this code:
```
body.woocommerce-shop nav.rank-math-breadcrumb{
margin-top:30px;
}
```
Best Regards
August 23, 2023 at 11:25 am #490672

Puddle123
Participant

Thanks for your reply. Unfortunately that code didn’t work, the breadcrumbs don’t have the margin applied on the shop pages – screenshot attached.

Attachments:
You must be logged in to view attached files.

August 24, 2023 at 4:29 am #490892

Elise Noromit
Member

Hello,

Please provide the page URL with the breadcrumbs.

Best Regards

August 26, 2023 at 7:13 pm #491474

Puddle123
Participant

I can’t share our website URL as the website is in maintenance mode. However, I can share the same page from your WoodMart Demo: https://woodmart.xtemos.com/shop. It’s the breadcrumbs which are shown on the ‘shop’ pages.

August 27, 2023 at 5:33 pm #491560

Elise Noromit
Member

Hello,

This block is wrapped and if we add a margin all the content will move: https://gyazo.com/be1d9f3b3c0b373e7835b2e7da9e437e if I add the margin, I get this https://gyazo.com/6bca98934d0656dd7c71a6e88ffbe749

Please consider using the Woocommerce builder of WoodMart allowing to create custom templates for product pages and other functional pages that are not editable by default. Woocommerce builder is the inbuilt functionality widget included in the builder you use on the site.

Please check this manual: https://xtemos.com/docs-cat/woocommerce-layouts-builder/?theme=woodmart

If you have any questions please feel free to contact us.

Best Regards
Author

Posts