Change color red ball in menu

Hi miriammetjuh,

How are you today? ??

You should be able to change the red ball color by using CSS code like this one:

.top-navigation .horisontal-navigation .current_page_item a:before {
    color: #000;
}

If your theme doesn’t have custom CSS field, then you may wish to use a child theme or a plugin like this one for this additional CSS. That way you’re protected when you come to upgrade.

Cheers,
Predrag

Hi Predrag,

Thank you so much for your response!

I made a stupid mistake, pasted your code in the Function template and now the whole website is gone? It just shows a blank page…
Could you pleassssse help me??

Already resolved my latest problem ??

Hi miriammetjuh,

Glad to hear you managed to get it fixed in the meantime ??

My suggestion is to never use WordPress editor to change files and stick to FTP or cPanel when editing files, this way you can make a backup of your file and get it back if changes cause any unwanted behaviour.

Cheers,
Predrag

Thanks Predrag, this was a one time mistake ??

Your code doesn’t seem to help.. or maybe I’m doing it wrong.
Do you have any (other) suggestions?

Hi miriammetjuh,

Hmm, strange, works fine on my installation…

Could you share your site URL so I could check it out directly and see what’s going on there? ??

Cheers,
Predrag

https://www.wereldhond.nl

Hi miriammetjuh,

Can you tell me where did you add the code after you removed it from functions because I don’t see that code loaded on your site and applying it directly in page inspector works?

Cheers,
Predrag

Probably didn’t do it right…

I don’t even know what you mean with ‘page inspector’ ??
Could you maybe walk me through it?

A lot of thanks for your help this far!!
cheers

Hi miriammetjuh,

Most of the browsers have page inspectors where you can check the code directly from your browser.
I prefer the Chrome’s one, when you right click on the red ball and click on inspect element you will see HTML structure and CSS styling for it.
This screenshot explains it better: https://screencast.com/t/MON9In57FTt

In CSS styling I can see now that the code is added but only for screens larger than 680 pixels and it’s added to theme style.css but there’s another CSS file loaded after it that rewrites the settings.

Can you try applying the code by using this plugin and see if it works after that:
https://www.ads-software.com/plugins/simple-custom-css/

Cheers,
Predrag