Accessing the Additional CSS Section in an FSE Theme

Spectra One is a Full Site Editing (FSE) theme, meaning you can customize your website’s appearance directly within the WordPress editor.

For Full Site Editing (FSE) theme, the process of adding custom CSS differs from traditional themes.

This guide will show you how to add custom CSS code to your Spectra One theme using the built-in Styles panel.

What is Custom CSS?

Custom CSS (Cascading Style Sheets) is a way to fine-tune the look and feel of your website beyond the theme’s built-in options. With CSS, you can change things like colors, fonts, and layouts.

Before diving into the steps, it’s helpful to have a basic understanding of CSS code. If you’re new to CSS, there are plenty of free online resources and tutorials available to get you started.

How Do You Add Custom CSS in an FSE Theme?

To add custom CSS to a block theme in the Spectra One theme using the Full Site Editor (FSE), you can follow these steps:

1. Access the Site Editor:

• Go to your WordPress dashboard.
• Navigate to “Appearance” and then select “Editor”.

2. Open the Styles Panel:

• In the Site Editor, click on the website preview to enable editing tools.
• Click on the Styles icon (represented by a half-shaded circle).

3. Add Custom CSS:

• Within the Styles panel, click on the three dots (ellipsis) icon next to the section title.
• Choose the “Additional CSS” option.
• Enter your custom CSS code in the provided text area.

4. Save Changes:

– Once you’ve added your CSS, make sure to save your changes by clicking the “Save” button.

Example:

If you want to change the background color of the header, you can add the following CSS:

header {
      background-color: #ff0000;
}

You can watch the below attached video for a better understanding.

We hope this document has been helpful in guiding you through the process of adding custom CSS in the Spectra One theme.

If you have any questions or need further assistance, please leave a comment below. Your feedback helps us improve our documentation and support.