[Resolved] Using Yoast Breadcrumbs – changing font with css not working

Home Forums Support Using Yoast Breadcrumbs – changing font with css not working

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #1039964
    Lawrence

    Hello

    I have read many questions that are similar with seemingly simple answers regarding how to change the font of the Yoast breadcrumbs using simple css. This was one of the solutions that worked for other people but it is not working on my site.

    #breadcrumbs {
    font-size: 14px;
    padding-bottom: 15px;
    }
    I went to the inspect page in my browser and was able to change the body link size but that affected everything else.
    Please advise!
    Thank you

    #1040050
    David
    Staff
    Customer Support

    Hi there,

    how are you adding the breadcrumbs to the site? Its currently being output in a Span tag with no class or ID.

    Be good if we can get a class on the element if not then you could try this:

    .site-content > span:first-of-type {
        font-size: 12px;
    }
    #1040458
    Lawrence

    David
    yes, that did work, thank you so much. As far as how I added the breadcrumbs; I took the shortcode and used the elements feature to make a hook. I copied and pasted the shortcode in the hook with nothing else. Is there somewhere in the element or the Yoast panel that you are suppose to add the class or id? If so I would rather go that route.

    #1040772
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Can you share the code you’re using in your Element? I believe WC has a parameter you can add to the function/shortcode which outputs a wrapper with a class/ID.

    #1040774
    Lawrence

    here it is wpseo_breadcrumb

    #1040777
    Lawrence

    that is it I removed the brackets
    sorry about that it doesn’t want to seem to paste into doc

    #1040788
    Tom
    Lead Developer
    Lead Developer

    What if you do the following instead?:

    <?php
    if ( function_exists('yoast_breadcrumb') ) {
      yoast_breadcrumb( '<p id="breadcrumbs">','</p>' );
    }
    ?>

    Be sure to check “Execute PHP” in the Element settings.

    Then you should have a #breadcrumbs selector to work with.

    #1040793
    Lawrence

    yes, that did the trick. Thanks so much!!!

    #1040796
    Tom
    Lead Developer
    Lead Developer
Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.