[Resolved] Customizing Breadcrumb Add On Text (GP Theme Link Color Attributes)

Home Forums Support Customizing Breadcrumb Add On Text (GP Theme Link Color Attributes)

  • This topic has 11 replies, 2 voices, and was last updated 1 month ago by Leo.
Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #1229981
    Marty

    Hi, I was able to successfully add Breadcrumbs NavXT to GP Premium using an Element.

    I’m trying to customize the color of the links that display in it (blue by default). However, nothing I tried works correctly – anything I’ve tried affects sitewide.

    I can’t isolate color settings to the breadcrumb link text (ex.: Home >> [category] >>).

    Is there a way I can do this, please? Thanks!

    #1230275
    Leo
    Staff
    Customer Support

    Hi there,

    For color, try this CSS:

    .entry-header .breadcrumbs a {
        color: #000000;
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    Any chance you can open a new topic for the separate question?

    Thanks ๐Ÿ™‚

    #1230328
    Marty

    Thank you Leo, but unfortunately the CSS you provided above has no effect.

    When I tried on my own, things like:

    a, a:visited {
        color: #999;
    }

    ..work but affect the whole site.

    (*I’ve removed the other question/topic as you requested, thanks).

    #1230334
    Leo
    Staff
    Customer Support

    I’m not seeing my CSS being added. It works when I used browser inspect tool to test:
    https://www.screencast.com/t/K99lHO7IqGZ

    Are you using any caching plugin? If so did you make sure to clear it first? Can you also disable all of them if you are still having issues?

    #1230351
    Marty

    Hi there – I’m not using an caching plugins for the test site/post.

    I think I found the problem. The CSS you gave me is being affected by this CSS I was given here for sizing the padding on mobile. When it’s removed your CSS works.


    @media screen and (max-width: 768px) {
    .separate-containers .inside-article, .separate-containers .comments-area,
    .separate-containers .page-header, .separate-containers .paging-navigation,
    .one-container .site-content, .separate-containers .widget.inner-padding {
    padding-left: 15px;
    padding-right: 15px;
    }

    Thanks.

    #1230409
    Leo
    Staff
    Customer Support

    Your CSS above is missing a closing } for @media screen and (max-width: 768px) {.

    #1230458
    Marty

    Thanks so much, the CSS you gave me worked! Sorry about that – apparently a stray bracket got put into another place so I wasn’t aware of the error before.

    Thanks for the help!

    #1230460
    Leo
    Staff
    Customer Support
    #1346352
    Marty

    Hi there – sorry to bother again about this topic but I’m still struggling with this issue.

    The code you gave me above last time isn’t effective when I’m trying it now, and anything I’ve done that works affects not only the breadcrumb links but also changes the menu bar links as well.

    URL: (removed)

    I hope I’m not wrong in thinking the color of the “Home ยป Posts Page ยป Product review” can be changed.

    Thank you! ๐Ÿ™‚

    #1346457
    Leo
    Staff
    Customer Support

    Looks like the breadcrumbs changed position.

    Try this instead:

    .inside-article .breadcrumbs a {
        color: #000000;
    }
    #1346843
    Marty

    Leo, thank you so much that worked!

    My apology for that I guess I am still slightly confused about using the Elements feature/locations and changed the breadcrumb location by mistake since the last time I was working on GP for the site.

    Sorry to take up your time and I’ll document my customizations to help ensure I don’t mess it up like that again.

    I really appreciate it a lot! ๐Ÿ™‚

    #1347225
    Leo
    Staff
    Customer Support
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.