> ## Documentation Index
> Fetch the complete documentation index at: https://docs.ecomwize.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Edit section code

> Open the code of a section or page, edit it with live preview, or ask AI to change selected lines.

Code editing lets you change the code behind a section or the whole page, and see the result on the canvas as you type.

![The code panel next to the canvas](https://assets.ecomwize.io/docs/shots/code-panel.png)

> [!NOTE]
>
> Code editing is available on the Max plan. On other plans you see **Code editing. Available on the Max plan.** with an **Upgrade plan** button. See [Plans](https://docs.ecomwize.io/billing/plans.md).

## Open the code

**1. Pick what to edit**

Select a section on the canvas to edit its code. Select nothing to edit the whole page.

**2. Click Show code**

In the Style panel header, click **Show code**. A code panel opens. Drag its edge to resize it.

**3. Edit**

Type your changes. They show on the canvas live.

If the code is invalid, the panel shows an error and the change is not applied. Fix the error and your edit appears.

## Ask AI to change specific lines

Select lines in the code panel and click **Edit with AI**. The selected lines go to the [agent](https://docs.ecomwize.io/builder/ai-agent.md), so you can describe the change in plain words.

![The code panel with a section selected](https://assets.ecomwize.io/docs/shots/code-panel-crop.png)

> [!TIP]
>
> Save a version in [History](https://docs.ecomwize.io/builder/history.md) before large code changes, so you can restore it if needed.

## Related

> **[Style panel](https://docs.ecomwize.io/builder/style-panel.md)**

> **[The AI agent](https://docs.ecomwize.io/builder/ai-agent.md)**

> **[Plans](https://docs.ecomwize.io/billing/plans.md)**

> **[History](https://docs.ecomwize.io/builder/history.md)**


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.