CSS LINK customization

#321119
  • Resolved Johan
    Rank Math free

    Hi,

    I am trying to style my breadcrumbs menu. I’m using OXYGEN Builder with Rank Math plugin.
    Right now, my breadcrumb link to the start page is default style, i.e blue.

    What code snippet do I add in my custom CSS to change that? I can’t get it to work. I only seem to be able to style the breadcrumb text that indicates my current page viewing (which is not a link).

    START / CURRENT PAGE

    I want to style the “START” but right now am only able to style the simple text “CURRENT PAGE”.

    My DIV box is called
    #shortcode-27-7{

    }

    Thanks!

Viewing 11 replies - 1 through 11 (of 11 total)
  • Hello,

    Thanks for contacting us and sorry for any inconvenience that might have been caused due to that.

    Can you please share the URL of your site in the sensitive data section so we can check and provide a custom CSS code?

    Looking forward to helping you.

    Johan
    Rank Math free

    Hello Jaideep Asrani

    Thank you for very quick reply!

    I am currently developing the site offline, using Laragon for hosting my wordpress. Is there a way to give you any useful information despite this?

    Kind regards, Johan

    Hello,

    If you are using the Rank Math breadcrumbs the data will all be inside a nav tag with the class rank-math-breadcrumb and the first one can be selected with the following selector:

    
    .rank-math-breadcumb p a:first-child
    

    Hope this helps solve your issues.

    Don’t hesitate to get in touch if you have any other questions.

    Johan
    Rank Math free

    Hello,

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

    Thank you.

    Hello,

    Could you please try applying the CSS code directly inside your theme’s custom CSS and see if that produces the desired result?

    Looking forward to hearing back from you.

    Johan
    Rank Math free

    Hi Miguel,

    Thank you very much for the assist.
    Unfortunately I still don’t get it to work by putting the code inside main CSS.

    Hello,

    Could you try adding the below-mentioned CSS Code to your site and check if this helps?

    nav.rank-math-breadcrumb p a:first-child {
        color: #ff0000 !important;
    }

    This will apply red color to the first page included in the breadcrumb.

    Let us know how it goes.

    Looking forward to helping you.

    Thank you.

    Johan
    Rank Math free

    Hi Kamlesh,

    Thank you very much for your help.
    The provided CSS doesn’t change anything for me.

    I’ve found a way to alter the link color, by using the GUI of Oxygen, I go to Global styles and change the color of all links. That soemhow changes the breadcrum link. My other links I can tag with other styleselectors and change em indivudally. This seems to work for the moment. Once I’ve hosted the page I will get back to you and maybe you can find what im missing!

    Thanks

    Hello,

    I am glad that you found a resolution.

    Yes, do get in touch with us once you have a link to the live page and we will help you out the best.

    If you 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.

    Johan
    Rank Math free

    Thank you all for the quick help! I truly appreciate it!

    Hello,

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

    If you don’t mind us 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 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 11 replies - 1 through 11 (of 11 total)

The ticket ‘CSS LINK customization’ is closed to new replies.