The theme editor

The theme editor is where you customize Citera without touching code. Everything about your store’s look — sections, colors, fonts, layout — is edited here.

Opening the editor

The three panels

The editor has three main areas:

• Left panel — the list of sections on the current page, top to bottom. Click a section to expand its settings; drag to reorder; use the eye icon to temporarily hide.
• Center panel — a live preview of your store. It updates as you edit. Switch between desktop, tablet, and mobile view with the icons at the top.
• Right panel — the settings for whatever you clicked on (a section, a block, or theme settings). This is where you edit text, upload images, and change colors.

Sections vs blocks

Understanding this distinction is key.

• A section is a page-wide horizontal band. Examples: the hero banner, a featured collection, testimonials, the newsletter form. You add, remove, and reorder sections in the left panel.
• A block lives inside a section. It’s a smaller unit — an individual image card, a testimonial quote, a product option. You add blocks by clicking a section, then Add block in the right panel.

Editing text, images, and colors

• Text. Click the section, then edit in the right panel. Save is manual — hit Save in the top-right when done.
• Images. Click Select image, then either upload a new file or pick one already in your Files library.
• Colors. Most color choices are picked from your color schemes — see Understanding color schemes for the full system.

Preview without publishing

If you want to try big changes safely:

Undoing changes

The theme editor doesn’t have a global undo, but every change is saved to the theme file. If you break something:

• Use browser back inside the editor to step through recent field changes.
• For bigger reverts, duplicate a known-good theme back into the library (Actions → Duplicate on any older theme in your library).

Related

• Understanding color schemes
• Your first customization
• Homepage sections