Change color of Header text and dots

Illdy
1

Hi,

How can I change the color of Header text (white) and dots (yellow) to some other color. Would like to know the css code that can be used to do the same. thanks!

2

Hello @sunny,

This is the CCSS code for dots:

#header .bottom-header span.span-dot{
    color: #ffde00;
}

This is for the header:

#header .bottom-header h2{
    color: #fff;
}

Regards

3

I’m looking to remove the dots in the header, but I guess changing the color would make it look like it’s gone too. Where in Editor would I paste this code? I’m not sure where to put it in between all the other html. Sorry, I’m quite new to web designing.

4

This code should be placed in a child’s theme stylesheet.css, ideally.

But you can use a Custom CSS plugin or place it inside Dashboard > Appearances > Editor > Style.css but keep in mind that this will get erased if you update the theme.

5

I am confused. I went to Dashboard > Appearances > Editor > Style.css and now, I am in the Illdy: Blog Page Template (page-templates/blog.php).

I am trying to remove to yellow dot just in the blog header, not on the front page. How do I do that?

Thanks for your patience and help.

Best,
Mary Ann

6

I’m trying to change the yellow color in general, but I can’t…

I’ve made my child with the css heather and the import include this:

#header .bottom-header span.span-dot{
    color: #0357A7 !important; /*#ffde00*/
}

#header .bottom-header h2{
    color: #f00 !important; /*fff*/
    text-shadow: 5px 5px 5px black !important;
}
#header .top-header .header-navigation ul li a:hover {
  color: #0357A7 !important;
  text-decoration: none;
}

.latest-news-button {
	background-color: #0357A7 !important;
}

But nothing happend… There’s the same color…
Some help will be very much appreciated.

7

Hello Mary Ann,

Unfortunately, I cannot assist you with removing the dots only on the blog page as it would require extensive custom work.

@xaeoc, please create a separate topic and provide the website link so I can have a look for myself.

Regards

8

Hi, just fix it… Thanks…

9

I wanted to remove the dots as well and this code worked for me.

#header .bottom-header span.span-dot {
display: none;
}

10

@bytenibbler

Where did you insert that code? Can you post a screen shot? Thanks!

Mary Ann

11

Hi,
That code worked for me to remove the dot on the front page and the blog page, but I only wanted to remove it on the blog page.

12

I FIGURED IT OUT!!! WOOOHOOOO! THANKS!

13

That’s great news!

Let me know if there’s anything else you need any help with.

Regards