Search code examples
cssbackground-colorsquarespace

SquareSpace: Change section background color (Eamon / Ethan template)

Example template: https://eamon-demo.squarespace.com/#overview-eamon

Is there any possible way to change the background color of a single white section with text in the Ethan / Eamon theme? I've had no luck with

<style>
.body { 
background-color: lightblue; 
}
</style>

in the Advanced section of the page editor. I am looking to change only one of the section's background colors, I do not want to change them all. Thanks.

Solution! I was able to make it work on a section called "titles" adding the following to the CSS Editor:

section#titles { 
background-color: lightblue !important; 
}
Solution

  • Yes, it is possible by targeting via the CSS attribute selector. For example:

    [data-url-id='titles-eamon'] .content, [data-url-id='titles-eamon'] .content-inner {
    background-color: lightblue !important;
}

    The above code would be inserted via the CSS Editor. The data-url-id value corresponds the URL Slug of the index page section (see image).

    You can inspect the code of the page user your browser's developer tools (often by hitting F12 or CTRL+SHIFT+I). That will help you explore the code of the page for this and other similar issues/customization.

    enter image description here