Link to home
Start Free TrialLog in
Avatar of Lionel MM
Lionel MMFlag for United States of America

asked on

Wordpress Setting Default Fonts and Colors

I am about 3 months into figuring out wordpress (trying to). I have installed, customized, deleted and reinstalled many times over to get more and more comfortable with it and in using the "customize" sections of themes. The one thing that seems very clear to me is that different themes allow you to customize different aspects of fonts and colors. Some allow easy customizing to most aspects while  other themes do not allow a lot of customizing and also not so easily.

I have found that I spend a lot of time messing around with fonts & colors for all the various different aspects of the site (background, main text, button text, hover-over text, banner text, menu text, et.c etc.). So my question is this is there an easier way to add ccs code or some other mechanism to create a list of all these various features that need to be stipulated each time I reinstall or change a theme so that I have a sort of master file that I can use each time, something that stipulates what fonts and colors I want for all these features? Thank you.
Avatar of David Favor
David Favor
Flag of United States of America image

I think maybe this will assist.

https://wordpress.org/plugins/custom-css-manager-plugin/ which allow CSS to be injected into your site.

Be sure to comment which CSS goes which theme/plugin, as CCS persists across theme/plugin removal/change, so you can input your CSS once + toggle between different themes/plugins + retain your CSS.

This plugin allows very quick flipping between themes/plugins to test layout, without have to code up child themes or custom plugins.
Avatar of Lionel MM

ASKER

I found SiteOrigin CSS last night and it works, even allows me to copy and save. Will check out your suggestion and see how it works--thanks
SiteOrigin is AMAZING! In my opinion at least.

They have some really solid free themes that work as a good base for you to do your development.

If you are looking to build and customize themes, their stuff is the way to go.

Me, I just keep some default.css sheets in a main folder on my computer (and in the cloud) and for each new theme I'm working with, I use theme. Here's my method.

1) Install main theme.
2) Create child theme off of main theme.
3) Drop in css into style.css file and viola...styles, colors, etc, are there.

If you want your clients to be able to select their own colors for the theme ( once you are finished with their site ) then I recommend installing Advanced Custom Fields and setting up an options page. This way you can give you clients incredibly control over their site.

Hope this helps :)
can you give me the details on your approach please--like the sound of that
1) Install main theme.
2) Create child theme off of main theme.
3) Drop in css into style.css file and viola...styles, colors, etc, are there.
SOLUTION
Avatar of David Favor
David Favor
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Sorry, David beat me to posting that as I was giving a super detailed how-to ;)
OK since reading your comments and reading the provided link and trying to replicate this for myself I am still struggling a bit. You have likely given me the answer but I am just not recognizing it so allow me to ask this another way. This process of creating a child theme will allow me to copy the section(s) that deal with background color, main text font family & size & color, heading text font family & size & color, menu text font family & size & color, etc. and then copy that customization from one child theme's css to another child theme css? Is that right? So there is no process that allows me to create a "master css" that will govern all themes that I switch to and switch back and forth to & from without adding these customization to each child theme's css? Is that right? Thank you.
Correct.

Also Child Themes go much further.

You can package up a custom functions.php file + all sorts of other files to dramatically effect behavior.

Likely good for you to read through WordPress Functionality Plugins which provides a great table with suggestions on how to inject different types of code into your site.

Some code is best done via Child Theming, other coding best done via Functionality Plugins or custom plugins.
David, does that include the items I mentioned--they are not mentioned in your link or in the link from one of the comments it. For right now, as a relative beginner, I want to decide on fonts, size, and colors and use those same choices as I try out different themes. as an aside comment it is baffling to me that most themes default fonts are just horrible--most are not clear and clean. thanks
I agree with David.

In my experience, it's best to stick with a base theme as your starting point. I build one theme and only one theme, 1000 different ways, but it's always starting the same way.

I'm guessing here, but it looks like you might be trying to setup a way to model different possibilities for potential clients to show them a potential style of site they might like, but you want to keep the same css styles running on them, right?

Might want to look into Oxygen or a staging plugin where you can build templates on WordPress to quickly display what's in your head for your clients...just a thought.
No I am not trying to create something to sell to multiple clients--all I am trying to do is to find a way that when I switch from one theme to another that I can do something quick and easy to make the fonts, font sizes & fonts colors what I have found I like most without having to go to the customize theme section of each theme and change each feature one by one and theme by theme. The idea forwarded by David Favor looks good but my follow-up question was if that concept he talked about can be used for what I am asking about -- I could not find them mentioned in the example links provided (background color, main text font family & size & color, heading text font family & size & color, menu text font family & size & color, etc) .
ASKER CERTIFIED SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
OK thanks -- back when I used to work with NetObjects (20 years ago) there was some html code I used to put in the header or body (can't recall--haven't done that kind of work for 20 years now) and that would set all the colors, fonts and font sizes -- I guess I was hoping for something similar -- this is not my IT skills area -- doing this site as a favor for my family and now living to regret it -- thanks for the time and input anyway -- thanks you.
I really like the plugin suggested by David as it seemed it MIGHT do what I wanted https://wordpress.org/plugins/custom-css-manager-plugin/ but with security at a premium these days and since it has not been updated in over 2 years I am too scared to use it in a production website. However Andrew confirmed that what I was looking for really isn't possible and the best "solution" was for me to use the "child-theme" concept to minimize customization as I test themes and although I ahven't had the time to test this it does seem a compelling solution. Thanks for your time and suggestions.