How do I add breadcrumbs function inside header class? - Support

Resolved Sanuja.com
4 years, 1 month ago

Rank Math free
First of all, thank you so much for the free plugin that beats every other SEO plugin.

I am trying to add breadcrumbs to a customized WP Twenty Fourteen theme. I only need the breadcrumbs in Pages not Posts. So I found the header php file for the Pages; content-page.php. I would like to have the breadcrumbs appars just above the Page title just like how the theme shows categories on Pages just above the title (eg: https://sanuja.com/blog/how-to-fix-wp-error-establishing-a-database-connection). Since Pages don’t have categories, I thought this would be a perfect location.

The original code for the title is:
```
	<?php
		// Page thumbnail and title.
		twentyfourteen_post_thumbnail();
		the_title( '<header class="entry-header"><h1 class="entry-title">', '</h1></header>' );
	?>
```
Where I need to add the rank_math_the_breadcrumbs(); is indicated by **RANK MATH BREADCRUMBS HERE** :
```
	<?php
		// Page thumbnail and title.
		twentyfourteen_post_thumbnail();
		the_title('<header class="entry-header"> **RANK MATH BREADCRUMBS HERE** <h1 class="entry-title">', '</h1></header>' );
	?>
```
For some reason I am unable to do it without getting a syntax error. If I just pass the function as:
```
	<?php
		// Page thumbnail and title.
		twentyfourteen_post_thumbnail();
		if (function_exists('rank_math_the_breadcrumbs'))
		the_title('<header class="entry-header"> rank_math_the_breadcrumbs(); <h1 class="entry-title">', '</h1></header>' );
	?>
```
It is just going to print the rank_math_the_breadcrumbs(); as a string. You can see that here just above the title: https://sanuja.com/blog/exams/comptia-networkplus (note I have a test breadcrumb just underneath it.

Any advice on how I can integrate the function into that title string? Thank you so much. 🙂

Viewing 10 replies - 1 through 10 (of 10 total)

Michael Davis
4 years, 1 month ago

Rank Math pro
Hello,

Thank you for contacting Rank Math and sorry for any inconvenience that might have been caused due to that.

Please try the following:
```
<?php
	// Page thumbnail and title.
	twentyfourteen_post_thumbnail();
	if (function_exists('rank_math_the_breadcrumbs'))
	the_title('<header class="entry-header">'. rank_math_the_breadcrumbs(). '<h1 class="entry-title">', '</h1></header>' );
	?>
```
Looking forward to helping you. Thank you.
Sanuja.com
4 years, 1 month ago

Rank Math free

Hi Michael,

I tried that and it will result in displaying the breadcrumbs just outside (left hand side) of the title not just above the title. So did not seems to work.

You can check this on any of my Pages now with “?nocache” attached to the end of the link. Any page under https://sanuja.com/blog/exams/ …

Thank you so much.
Sanuja.com
4 years, 1 month ago

Rank Math free
I also tried the following but moving <header> tags out of the the_title string. But it also created a large gap between the title and the breadcrumbs:
```
<header class="entry-header">
<?php
	// Page thumbnail and title.
	twentyfourteen_post_thumbnail();
	if (function_exists('rank_math_the_breadcrumbs'))
	the_title(rank_math_the_breadcrumbs(). '<h1 class="entry-title">', '</h1>' );
	?>
</header>
```
When I look at Posts with Categories right on top (where I would see breadcrumbs on pages), this is the code I see:
```
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
	<?php twentyfourteen_post_thumbnail(); ?>

	<header class="entry-header">
		<?php if ( in_array( 'category', get_object_taxonomies( get_post_type() ), true ) && twentyfourteen_categorized_blog() ) : ?>
		<div class="entry-meta">
			<span class="cat-links"><?php echo get_the_category_list( _x( ', ', 'Used between list items, there is a space after the comma.', 'twentyfourteen' ) ); ?></span>
		</div>
			<?php
			endif;

		if ( is_single() ) :
			the_title( '<h1 class="entry-title">', '</h1>' );
			else :
				the_title( '<h1 class="entry-title"><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h1>' );
			endif;
			?>
```
I wonder if that is helpful for doing the something except not categories but Rank Math breadcrumbs on Pages.

Thank you.
Michael Davis
4 years, 1 month ago

Rank Math pro
Hello,

This should do:
```
<?php
		// Page thumbnail and title.
		twentyfourteen_post_thumbnail();
          if (function_exists('rank_math_the_breadcrumbs'))
               rank_math_the_breadcrumbs();
the_title( '<header class="entry-header"><h1 class="entry-title">', '</h1></header>' );
	?>
```
If it still won’t work then we might need to take a closer look at the settings. Please edit the first post on this ticket and include your WP logins in the designated Sensitive Data section.

It is completely secure and only our support staff has access to that section. If you want, you can use the below plugin to generate a temporary login URL to your website and share that with us instead:

https://wordpress.org/plugins/temporary-login-without-password/

You can use the above plugin in conjunction with the WP Security Audit Log to monitor what changes our staff might make on your website (if any):

https://wordpress.org/plugins/wp-security-audit-log/

We really look forward to helping you.
Sanuja.com
4 years, 1 month ago

Rank Math free

Hello,

I have updated the sensitive data as requested. Can you please check further?

Thank you.
Michael Davis
4 years, 1 month ago

Rank Math pro
Hello,

The code I provided above is working flawlessly.

The white space from the margin is added by your custom CSS on entry-header class. You can remove this or override it by adding the following to your css:
```
.entry-header{
 margin-left:0 !important;
}
```
Hope that helps. If you have any further question(s), please let us know. Thank you.
Sanuja.com
4 years, 1 month ago

Rank Math free
Thank you Michael. But adding the custom CSS,
```
.entry-header{
 margin-left:0 !important;
}
```
hides the Rank Math breadcrumbs on desktop view underneath the left sidebar. I used it with the above,
```
<?php
		// Page thumbnail and title.
		twentyfourteen_post_thumbnail();
          if (function_exists('rank_math_the_breadcrumbs'))
               rank_math_the_breadcrumbs();
the_title( '<header class="entry-header"><h1 class="entry-title">', '</h1></header>' );
	?>
```
Thank you so much and I really appreciate your help.
Uzair
4 years, 1 month ago

Hi,

There must be some issue with your CSS then.

If you are not sure about that, we recommend hiring a frontend developer to help you figure out why that CSS is causing the breadcrumbs to hide.

If you need help with anything else, please open a new support ticket here so we can help.

We are always here for assistance.

Sanuja.com
4 years, 1 month ago

Rank Math free

Thank you for all your help. Great support and I will look into this myself. Since this is now seems to be unrelated to RankMath itself, I am marking this resolved.

All the best and keep up the good job!

Uzair
4 years, 1 month ago

Hello,

We are super happy that this resolved your issue. If you have any other questions in the future, know that we are here to help you.

If you don’t mind me asking, could you please leave us a review (if you haven’t already) on https://wordpress.org/support/plugin/seo-by-rank-math/reviews/#new-post about your overall experience with Rank Math? We appreciate your time and patience.

If you do have another question in the future, please feel free to create a new forum topic, and it will be our pleasure to assist you again.

Thank you.

Viewing 10 replies - 1 through 10 (of 10 total)

The ticket ‘How do I add breadcrumbs function inside header class?’ is closed to new replies.