Elementor WordPress Plugin Backgrounds Usage Guide

In this article, we share the best user guide for working properly with backgrounds in the Elementor WordPress page builder plugin.

How To Change Sections Background Color In Elementor WordPress Plugin

This article shares the best user guide for working properly with backgrounds in the Elementor WordPress page builder plugin.

This post will learn about changing the background color simply for the entire page body, sections, columns, and individual elements. So, we will begin with the method for changing background color for the Elementor page on the section.

Elementor Backgrounds usage Guide

Section Backgrounds

Click on the “Edit Section” icon in the top middle part of the section. As a result, it opens up the ‘Edit Section’ field to the screen’s left. Choose the background color.

  • Firstly, on the Style icon to open the style tab for the Elementor section.
  • Secondly, click on the “Classic” option for Background type.
  • So, on “Color” to open up the color selector.
  • Select the color that you want from the palette for the background of the Elementor section.

[vc_row][vc_column][vc_video link=”https://www.youtube.com/watch?v=wuqwOlyM3rY”][/vc_column][/vc_row]

Body Backgrounds Elementor Page Usage Guide

Open the Elementor page settings menu. To the bottom left of the screen, click on the Settings icon to open up the settings menu for the Elementor page.

  • Firstly click on the Style tab of the Page Settings menu.
  • Secondly, select “Classic” as the background type under the “Body Style” dropdown.
    Choose the background color.
  • Finally, click on the color icon to open up the color selector and choose the color you want for the page background.

The HEX code of your color can also be in the text box below the color palette. After choosing the desired color, it will automatically set to the background of the Elementor page.

[vc_row][vc_column][vc_video link=”https://www.youtube.com/watch?v=bLDmRH4gEVI”][/vc_column][/vc_row]

Column Elementor Backgrounds Color Edit

Open the Edit Column tab. Right-click on the icon to the upper left point of the Elementor column to bring up the dropdown. From the drop-down, click on the “Edit Column” option. This will bring up the edit column pane to the left of the screen. Choose the background color.

  • Once on the Style icon to open the style tab for the Elementor column.
  • From on the “Classic” option for Background type.
  • Click on “Color” to open up the color palette.
  • Finally, select the color that you want from the panel for the Elementor Backgrounds of the column.

Individual Element Background Color

Open the editing pane for the Elementor element. Right-click on the icon to the upper right section of the element. Click on the edit element option from the drop-down. This will open up the editing pane to the left side of the window. Choose the background color.

  • Firstly, click on the Advanced icon to open the advanced tab for the Elementor element.
  • Secondly, open the Background drop-down in the advanced tab.
  • Click on “Color” to open up the color palette.
  • Select the color that you want from the panel for the background of the Elementor element.

[vc_row][vc_column][vc_video link=”https://www.youtube.com/watch?v=gCW0vlkSw_A”][/vc_column][/vc_row]