There is no such thing as a smarter edition natively implemented in WordPress, but I believe it will soon be available.
When you use the customizer to customize colors for example, you insert into your template HTML code one or more style
tags with ready codes based on the options you set in the editor.
Seeing the theme used in the print of your question, I see that it is Twenty Twelve
, I used it in localhost also to check it out and give you the specific answer for your case, so come on, this theme generates a style
for the header color and one for the blog background more or less like this in HTML:
<style type="text/css" id="twentytwelve-header-css">.....</style>
<style type="text/css" id="custom-background-css">.....</style>
Inside the style
tags contains the CSS code you've set up through the editor, after you've set up, open your WordPress in localhost and look at the source code and look for those snippets I mentioned and you will find them.
Since you want to set specific header and background colors for pages and publications, this can be done using WordPress conditionals like is_page
, is_single
, is_category
, is_tag
, and others that serve to perform checks on the current page.
Below is a sample code that I tested on localhost and had to create 3 pages ( example page , contact , about ) to If you are familiar with CSS, you can customize everything you want, I recommend that you enter it below the code <?php wp_head(); ?>
in the code. file header.php
of your template:
<?php if ( is_page( 'pagina-de-exemplo' ) ) { ?>
<style type="text/css">
.site-header h1 a, .site-header h2 { color: #dd3333; }
body.custom-background { background-color: #3333dd; }
</style>
<?php } elseif ( is_page( 'contato' ) ) { ?>
<style type="text/css">
.site-header h1 a, .site-header h2 { color: #33dd33; }
body.custom-background { background-color: #dd3333; }
</style>
<?php } elseif ( is_page( 'sobre' ) ) { ?>
<style type="text/css">
.site-header h1 a, .site-header h2 { color: #3333dd; }
body.custom-background { background-color: #33dd33; }
</style>
<?php } ?>
- Conditional Tags