Site Designer Guide
components save-component my-components custom reuse workflow

Saving your own components

Once you have designed a section you are happy with — a CTA banner, a feature row, a footer — you can save it as a component and reuse it across every page in the project. This is how you build your own personal UI kit inside Site Designer.

Step-by-step: saving a component

  1. Design a section on the canvas until the layout, styles, and content are where you want them.

  2. In the Layers panel, click the outermost container element of the section — the element that wraps all the content you want to save together.

  3. Right-click the element and choose Save as Component from the context menu.

  4. Type a descriptive name in the dialog. Use a format that helps you find it later — for example: “CTA - Dark full width” or “Nav - Sticky with logo left”.

  5. Click Save. The component appears immediately in the My Components tab of the Components panel.

Organizing with folders

As your component library grows, folders keep it manageable.

  1. In the My Components tab, right-click in an empty area of the panel.

  2. Choose New Folder and type a folder name (for example: “Headers”, “CTAs”, “Footers”).

  3. Drag components into the folder to organize them.

A good folder structure mirrors the sections of a typical page: Navigation, Heroes, Features, Testimonials, Pricing, CTAs, Footers. Add folders for project-specific sections as needed.

Renaming components

Double-click the component’s name in the My Components panel. The name becomes editable inline. Press Enter to confirm.

Overwriting a saved component

If you update a section and want the saved component to reflect the new version:

  1. Select the outermost element of the updated section.
  2. Right-click → Save as Component.
  3. Type the exact same name as the existing component.
  4. Confirm the overwrite when prompted.

This replaces the saved version in the library. Instances already placed on pages are not affected — they remain as they were.

Sharing components with team members

Project components are stored inside the .rsd project file. To share your component library:

  • Share the project file — Open the .rsd file in Site Designer and components are available in My Components immediately.
  • Build a components-only project — Create an .rsd file that is solely a reference library of components, not a real site. Share this file with your team as the canonical UI kit.