How to Change Table Background Color in WordPress

By default, WordPress tables are created with a transparent background. But often, you may need to change the table background per your website design and stylization needs.

This can help you create a cohesive visual identity, improving readability and user experiences. This article will explain two easy methods on how to change the background color in WordPress.

Method One: How to Change the Background Color in Default WordPress Table

Below, you can see a dummy table created with the default WordPress table block. Click the Table icon on the toolbar to select the entire table block.

Select the table created by the default WordPress table block

Come to the Styles tab on the right sidebar. Click the Background option under the Color section. A color box will open up. You may select a Solid or Gradient color.  

Once you select a color, you’ll see it’s applied to the background of the table in real-time.

Change the background color of the default WordPress table

Method Two: How to Change the Background Color of the Table Created with the TableBerg Plugin

TableBerg is a promising table builder plugin for WordPress. It allows you to add various types of information to the table to make it versatile and able to serve multipurpose objectives.

Below, you can see an image of a table that we created with this plugin. Hit the Select Cell icon on the toolbar consecutively three times to select the entire table. 

Note: Clicking for only once won’t select the entire table.

Select the entire table created with the TableBerg plugin

Come to the Styles tab on the right sidebar. Under the Color section, you’ll get multiple background color-changing options. They are Header Background Color, Even Row Background Color, Odd Row Background Color, and Footer Background Color.

Using each of these options, you can change the background color of the respective area of the table one by one. This part is kinda similar to the above method.

Change the background color of the TableBerg table

You can see the background color has been changed. We have selected two separate colors for the odd and even rows on the table.

Background color changed on the table created with the TableBerg plugin

However, the Header and Footer Background Color options won’t work until you enable the Header and Footer options for the table.

Come to the Settings tab on the right sidebar. Right under the tab, you’ll get options to enable the Header and Footer for the table. After that, you can change the background colors for these two options.

Enable the header and footer options

Conclusion

Hope you can now customize the background colors of your tables in WordPress anytime you want. But remember some colors cause an eye-screaming effect on readers’ eyes and disturb their readability scores. 

Plus, if you fail to use proper contrasting colors, this can also decrease the readability score. Hope you’ll keep these points in mind while changing the background color of your table. 

Leave a Reply

Your email address will not be published. Required fields are marked *