# Best Practices

# Take a Component-Based Approach

You can either build components via the Page Editor, or you can build them in the Component Editor - and then drag them onto a page after you‘re done.

We recommend using the latter approach as much as possible. It will make it much easier for you to apply updates en masse to components across your site.


# Avoid Unnecessary Duplication

When deciding how to handle different variations of a component, you may be tempted to create a new component for each variation. For example, you may decide to build both a Hero - One Button and a Hero - Two Buttons component - even if the only difference between them is the number of buttons.

A better approach would be to create only one Hero component which contains two buttons. You can then use the disabled option to hide the second button on pages where it isn‘t needed.


# Add Useful Labels

When building out a complex component with lots of nested elements, it may be difficult to tell what you are selecting when clicking around - especially if multiple elements share the same label. For example, when in Guided Select Mode, you may end up seeing something like this:

Default Labels


... notice how it's difficult to tell what is what since there are multiple Container components. To avoid this, you can click on the labels to edit them and provide more descriptive names:

Better Labels