Archived topic

How To Change Theme Colors Including Footer

28 replies · Started by Ryan on January 14, 2022

Viewing posts 1–15 of 29

January 14, 2022 at 4:18 pm #2080739

How do I change the color of my theme? I am wanting to change it so that it resembles a Red/Black/White theme. When I go to Appearance > Customize > Colors....I don't see how to change the footer color. Right now my footer is a Navy/Blue color and when I go to the Footer Bar, it shows that the current color is white.

January 14, 2022 at 5:06 pm #2080764

Hi there,

Any chance you can link us to the site in question?

You can use the private information field:
https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information

Let me know :)

January 14, 2022 at 6:19 pm #2080787

I just sent it via private message.

January 14, 2022 at 7:54 pm #2080812

I don't see it. Can you make sure to use this method?
https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information

January 15, 2022 at 1:43 pm #2081557

Here it is again.

January 15, 2022 at 1:53 pm #2081565

This should help:
https://youtu.be/QIN0EaPllO4?t=630

I would recommend watching the entire video :)

January 15, 2022 at 5:08 pm #2081678

Thanks for the video. Can you tell me how I can change the color of the contact button menu in the header?

January 15, 2022 at 5:16 pm #2081684

Are you using the new dynamic typography system?
https://docs.generatepress.com/article/dynamic-typography-overview/

If so it would be the accent color.

January 15, 2022 at 6:08 pm #2081701

I don't really know dude. I have a contact button in the header of the site that I am trying to change the color of. So it's more of a color issue than a typography issue. I don't see anywhere to change the color in the typography section. I'm able to change the color of all other header tabs plus all of my other buttons. I just can't seem to find where to locate the contact button to change the color.

January 15, 2022 at 6:16 pm #2081707

Sorry - I meant to say global colors and not dynamic typography:
https://docs.generatepress.com/article/global-colors-overview/

Try changing accent in the customizer:
https://docs.generatepress.com/article/global-colors-overview/#accent-colors

January 15, 2022 at 6:43 pm #2081729

Ok, I got it. But how can I remove the border around the contact button on the header menu?

January 15, 2022 at 7:35 pm #2081741

In that case, remove this block of code from Additional CSS field in the customizer:

.main-navigation:not(.slideout-navigation) .main-nav li.nav-button a {
	color: var(--accent);
	border: 3px;
	border-style: solid;
	line-height: 36px;
	border-radius: 2px;
	margin-left: 20px;
	transition: all 0.6s ease 0s;
}

.main-navigation:not(.slideout-navigation) .main-nav li.nav-button a:hover {
	color: var(--accent-hover);
}

January 15, 2022 at 7:53 pm #2081750

Under the "Services" tab on the "Search" theme, there are 4 blue icons. Is it possible to change the color of those icons?

January 16, 2022 at 5:06 am #2081924

Hi there,

the color of those icons are part of the SVG, so you would need to save those images make an edit using a desktop app like Illustrator and then re-add them to the site.

January 16, 2022 at 12:02 pm #2082442

I copy the file URL and open in a new browser, I then save the file. But when I open that SVG file in Illustrator, there is nothing there. Do you know why this is?

Also when I go to edit the icon in the backend, under "Icon" (Icon SVG HTML) it has this link:

So even if I change the color of the SVG and then upload it. How do I link to the icon?

This archived topic is closed to new replies.

Start building better websites today.