Page Editor Tips
These tips help when a page technically works but does not yet feel visually clean. The most important lever is almost always structure: sections, slots, widths, and spacing.
Center Content
If content should not use the full width, you can constrain it from the sides with empty slots.
Structure:
| Slot | Content |
|---|---|
| empty slot | stays without component |
| slot with content | text, Support Box, Creator Links, or another component |
| empty slot | stays without component |
This creates a centered content area without artificially shrinking the content itself.
Limit Side Width
Use empty slots when an area needs more visual breathing room on the left and right.
Example:
- Choose or create a section with multiple slots.
- Leave an empty slot on the left.
- Place the actual component in the middle.
- Leave an empty slot on the right.
- Adjust slot widths until the middle area sits correctly.
Tip: Define only the width of the slot with content. The empty slots then share the remaining width and stay equal. This is the cleanest way to create even spacing left and right.
This works especially well for:
- centered Support Box on the page
- short intro text
- Creator Links as a compact block
- Goal Card without full page width
- HTML + CSS blocks that should not span the entire area
Limit the Main Area
If the complete section should not become wider, limit the main area through the matching properties. This is useful when multiple pieces of content should share one fixed maximum width.
Use this approach when:
- all components in a section should be constrained together
- the page feels too wide on large screens
- you want a clear content column instead of full screen width
Empty Slots or Main Lock
| Goal | Better Lever |
|---|---|
| Only one component should feel narrower | Empty slot, content, empty slot. |
| A whole section should be narrower | Limit the main area. |
| Content should sit side by side with outer spacing | Multiple slots with adjusted widths. |
| Mobile view should stay stable | Keep structure simple and avoid too many narrow slots. |
Good Default Structure
This structure works well for many areas:
| Slot | Width | Content |
|---|---|---|
| left | small | empty |
| center | large | actual component |
| right | small | empty |
This keeps the content centered and makes the page feel less crowded.
Preview Without Redirects
You can keep preview open in a second tab. It is live and receives changes directly from the editor.
External links intentionally do not open in preview. This includes normal href links, Creator Links, and CTA buttons. The advantage: you can check content, hover states, click areas, and layout without being redirected to an external page.
Saving still matters. Preview shows the current working state, while the public Tip page uses the saved and published version.
Common Mistake
Do not shrink every component individually just because it looks too wide. First check whether the section or slot structure should be adjusted instead.
In many cases, the cleanest solution is:
- Select section.
- Set fitting slots.
- Adjust slot widths.
- Place the component in the middle slot.
- Fine-tune colors, spacing, and typography afterward.