Change the Page Background

Why Change Page Background?

Sometimes, you might want to change the background color of an entire page to match your design goals. 

For instance, if your theme uses a default white background, you may want to switch it to black for a bold, modern look that fits your brand image.

Change the Page Background with GemPages

Since GemPages does not currently offer a direct setting for changing the background, you should follow these steps to use custom code:

Step 1: Add a Custom Code Element

Open the page you want to edit in GemPages. Drag and drop the Custom Code element onto the page.

Open the Code Editor by selecting the Custom Code element and choosing “Edit code”.

Step 2: Insert and Customize the Code

Paste the following code into the CSS Code Editor:

body {  

    background: #3355ff !important;  

}

Replace #3355ff with the hex color code of your choice.

• E.g.: Use #000000 for black, #ffffff for white, or any other hex code to match your design preferences.

The !important ensures the background color is applied consistently across the entire page, overriding any conflicting styles.

We will soon upgrade and add this feature into Page Settings to help you set up more easily without adding custom code.

By following these steps, you can easily customize the background color of your page and create a design that aligns with your vision and branding.