Editing Your Website

Two Ways to Edit

Our platform offers two powerful editing methods:

1. Chat-based editing — describe changes in natural language
2. Visual editor — click and edit content directly on the page

You can use both methods together for the best results!

Chat-Based Editing

The easiest way to make changes is by typing instructions in the chat panel.

How It Works

1. Open your site from the Dashboard
2. Type your edit request in the chat input at the bottom
3. Press Enter or click Submit
4. Watch the changes appear in the preview

Example Edit Prompts

Adding a New Page

Add a FAQ page with accordion-style questions about shipping, 
payment methods, and returns policy.

Changing Colors

Change the color scheme to a dark theme. 
Background: black, accent color: light blue.

Adding a Section

Add a customer testimonials section on the homepage.
Include 3 review cards with star ratings and quotes.

Updating Text

Change the hero section text to:
Headline: "Your Trusted IT Partner"
Subtitle: "We build solutions that work"

Modifying Layout

Make the product grid show 4 columns instead of 3.
Add more spacing between items.

Visual Editor Mode

For quick text and image changes, use the built-in visual editor.

Entering Edit Mode

1. Look at the preview panel on the right
2. Click the Edit button (✏️ icon) in the toolbar
3. The page will reload with editing enabled

What You Can Edit

In visual editing mode, you can:

Exiting Edit Mode

When you're done editing:

1. Click the Exit button in the toolbar
2. Your changes are saved automatically
3. The preview returns to normal view mode

Preview on Different Devices

Test how your site looks on various screen sizes:

Device Preview Options

How to Switch

1. Find the device icons in the preview toolbar
2. Click to switch between Desktop, Tablet, or Phone view
3. The preview will resize to show the responsive layout

Working with Pages

Switching Between Pages

If your site has multiple pages:

1. Look for the page dropdown in the preview toolbar
2. Click to see all available pages
3. Select the page you want to view or edit

Adding New Pages via Chat

Add a new "Gallery" page with a grid of photos 
and category filters at the top.

Deleting Pages

Remove the blog page from the site.

Fullscreen Preview

For a better view of your website:

1. Click the Fullscreen button (⛶) in the toolbar
2. The preview expands to fill the entire screen
3. All controls remain available
4. Click ✕ to exit fullscreen

Tips for Effective Editing

Be Specific

Instead of: "Make it look better"

Say: "Add a gradient background from blue to purple, increase the font size of headlines, and add subtle shadows to the cards."

Reference Existing Elements

Instead of: "Change some text"

Say: "In the hero section, change the headline to 'Welcome to Our Store' and the button text to 'Shop Now'"

Iterate Gradually

Make changes step by step:

1. First, get the structure right
2. Then, refine the content
3. Finally, polish the design

Undo Mistakes

If something doesn't look right, just ask:

Undo the last change and go back to the previous version.

Troubleshooting

Changes Not Showing?

1. Click the Refresh button (🔄) in the preview toolbar
2. Wait a few seconds for changes to apply
3. Check if the AI is still processing (loading indicator)

Edit Mode Not Working?

1. Make sure you're logged in
2. Refresh the entire page
3. Try entering edit mode again

Page Not Loading?

1. Check your internet connection
2. Try switching to a different page and back
3. Refresh the browser

Next Steps

• Master Writing Better Prompts
• Set up Forms for user submissions
• Ready to launch? Learn about Publishing