New Pro Theme – change color style into favorite color?

[Jan23]

Hi.

how can i change the Color-Style of News Pro theme?
I mean where i have to add the code for my favorite color?
thx for your help!
Kind regards,
Jan

[Marcy]

In your WordPress, go to Appearance > Customize > Colors.
Add the one you like.

---

Marcy | Amethyst Website Design | Twitter

[Jan23]

Hi,

sorry i mean how to change the color scheme into the color what i like.
I dont want to have the color scheme in "news pro green", pink, blue or orange.
Thx a lot for your help!

[Andykev]

Simple. You edit your .css to change the color to what you want. Find this part of your style.css which deals with the theme colors:

/* News Pro Blue
--------------------------------------------- */

.news-pro-blue .entry-title a:hover,
.news-pro-blue .footer-widgets a:hover,
.news-pro-blue .site-footer a:hover,
.news-pro-blue a {
	color: #27a3d1;
}

.news-pro-blue .entry-title a,
.news-pro-blue .genesis-nav-menu a,
.news-pro-blue .sidebar .widget-title a,
.news-pro-blue .site-title a,
.news-pro-blue .site-title a:hover,
.news-pro-blue a:hover {
	color: #000;
}

.news-pro-blue .button,
.news-pro-blue .button:hover,
.news-pro-blue .footer-widgets a,
.news-pro-blue .genesis-nav-menu .current-menu-item > a,
.news-pro-blue .genesis-nav-menu a:hover {
	color: #fff;
}

.news-pro-blue .site-footer a {
	color: #aaa;
}

.news-pro-blue .archive-pagination li a:hover,
.news-pro-blue .archive-pagination li.active a,
.news-pro-blue .button:hover,
.news-pro-blue .enews-widget input[type="submit"],
.news-pro-blue .entry-content .button:hover,
.news-pro-blue .home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-active a,
.news-pro-blue button:hover,
.news-pro-blue input:hover[type="button"],
.news-pro-blue input:hover[type="reset"],
.news-pro-blue input:hover[type="submit"] {
	background-color: #27a3d1;
}

.news-pro-blue .enews-widget input:hover[type="submit"] {
	background-color: #f5f5f5;
}

.news-pro-blue .home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-active a:hover {
	background-color: #fff;
}

There is a "green", "blue", "pink" and "orange". Now you have two choices. Edit the color which you would never use (perhaps pink?) and change the existing color HEX code to your preverence,
Such as "background-color: #e81857"...change it to something else. Do that for that "section" of the code (Pink). Now when you select that color option on your Admin Custom color choices, the
new color will show.

The second way, is to cut-paste the section (copy) and then rename it to your favoite color, actually adding a new block of color code to the theme.
You must ALSO go to your theme functions.php file and ADD that section to your color choices (again, copy an existing line and add, then change the name of the color). By doing this, you
have a new color choice.

Be aware of choosing colors as to how they affect hover and menus.

[Marcy]

Oh, goodness! I was working with AgentPress Pro, and saw that instead of News Pro. 🙂
Andykev's method will work to edit colors in News Pro.

---

Marcy | Amethyst Website Design | Twitter

[Jan23]

Hey,
great! Thanks a lot for your help, this was exactly what i was looking for!

[Author]

Posts