Style Each Post With A Different Background Color

This code adds a color picker to the Edit Post screen enabling you to set the background color for each post ( Not the front page archive page background ) without adding CSS, editing default code or using any plugins.

It styles each posts entry class on your archive pages, in this example, the home or posts page.

However, if you want to use a custom field plugin like ACF or Toolset, create a field named background_color where background_color is your custom field key.

The code adds your background color using the color picker added to the Edit Post screen without using code to create a new loop.

Demo Video

Shows the color picker added to the Edit Post screen enabling you to set the background color of the entry when it displays on your posts page.

Works in any WordPress theme and tested using the Genesis Sample child theme by StudioPress.

Installation Steps

There’s 2 steps :

1. # Copy & paste the PHP code ( without the opening PHP tag ) to the end of your child themes functions file.

 


2. # On the Edit Post screen, choose the color for each specific post background.

 

Download Folder

Related Tutorials

• Change Post Background Color Based On Category
• Code Color Picker On Taxonomy Edit Screen To Style Post Meta On All Page Types Including Posts Page
• Add Color Picker To Edit Post Screen To Style Specific Single Post Elements