[Resolved] Breadcrumbs style

[Espresso]

Hi Tom,

I have set up Yoast breadcrumbs and they work fine (I used the code you gave to another guy and added it to the hook “before header”.

However, as you can see…it has inherited all the style and background of the TOP header.

I would like to set a full width background and style them making the height thinner etc…

Any advice?

Here is the page:

https://www.espressotranslations.com/professional-translation-services/

Thanks a lot for your support.

Dan

[Tom]

Hi there,

Try removing this class from the breadcrumb container: page-header

[Espresso]

This is what I have now:

<?php if ( ! is_front_page() ) : ?>
<?php if ( function_exists(‘yoast_breadcrumb’) ) { ?>

<?php yoast_breadcrumb(‘<p id=”breadcrumbs”>’,'</p>’); ?>

<?php } ?>
<?php endif; ?>

BUt the breadcrumb doesn’t show anymore…

https://www.espressotranslations.com/professional-translation-services/

[Tom]

They’re hidden behind your sticky header.

You might need to adjust your CSS to this:

.custom-fixed-header + * {
    padding-top: 170px;
}

[Espresso]

That works, thanks. However, now on the home page, you can see the grey line:

https://www.espressotranslations.com/

Sorry for keeping bothering you!

[Espresso]

Sorted!

I added some padding to them and reduced the hight of the fixed header 🙂

Thanks for your help!
Dan

[Tom]

Glad you got it working 🙂

[Author]

Posts