# Direct Editing: Update Content Without Credits | Creght AI Documentation

> In Creght, tweaking copy or swapping an image doesn't require AI. Most text and images on your pages support Direct Editing — double-click to change them, see t…

[![Creght](https://ugc.talizen.com/_assets/site/2061660904709165056/1780797461299__creght_logo.png)Help Center](/help)

[Changelog](/blogs)

[AI](/docs/ai/quick-create-first-website) [Visual](/docs/get-start)

Getting Started

- [Create Your First Website in 5 Minutes](/docs/ai/quick-create-first-website)
- [AI Website Creation Guide](/docs/ai/ai-create-website-guide)
- [Direct Editing: Update Content Without Credits](/docs/ai/ai-edit-content-guide)
- [Use Pick to Bring a Section from Another Template into Your Site](/docs/ai/pick-element-in-tpl)
- [Prompt Library](/docs/ai/prompt-lib)
- [AI Credits Guide](/docs/ai/ai-credits-guide)
- [Creght Skill](/docs/ai/creght-skill)

Backend

- [Add Login, Bookings, Private Pages, and More to Your Website](/docs/ai/backend-database-guide)
- [Configure OAuth Login: Google and GitHub](/docs/ai/backend-auth-guide)

Site Setting

- [Multilingual Website Setup Guide](/docs/ai/localization)
- [Domain Binding Guide](/docs/ai/custom-domain)
- [Alibaba Cloud Domain Purchase Guide (Beginner Version)](/docs/ai/aliyun-domain-registration-guide)
- [Redirect Setup Guide](/docs/ai/redirects)
- [Missing Pages: Redirect or 404?](/docs/ai/redirect-or-404)
- [Meta Pixel Integration Guide](/docs/ai/facebook-meta-pixel)

Advanced Usage

- [Configure Different Default Languages for Different Domains](/docs/ai/domain-locale-routing)

Getting Started/

# Direct Editing: Update Content Without Credits

In Creght, tweaking copy or swapping an image doesn't require AI. Most text and images on your pages support **Direct Editing** — double-click to change them, see the result instantly, and **spend zero credits**.

Save AI for what actually needs it (layout changes, new sections, bulk rewrites). For everyday copy edits, Direct Editing is all you need.

## Double-click to start editing

**Double-click any text** on the design canvas and two things happen:

- The text enters **in-place editing**: an amber outline appears and the cursor lands right where you clicked. Type your change, press **Enter to save** or **Esc to cancel**, or click anywhere else to save automatically.
- The **Element Edit** panel opens beside it, listing everything on this element you can edit directly.

![Double-click text for in-place editing with the element edit panel](https://fsu.creght.com/site/2066727200882692096/1783849938805__38.png)

The panel has two sections:

| Section | What it does | Credits |
| --- | --- | --- |
| **Direct edit** | Change text, images and component props — written straight into your code | Free |
| **AI instruction** | Describe complex changes in natural language for AI to make | Metered |

If the Direct edit section shows an input, that content can be changed at zero cost.

## Edit every prop of a component

When you select a **component** (a pricing card, carousel, button…), the panel lays out each of its props with its own control:

![Editing a component prop by prop](https://fsu.creght.com/site/2066727200882692096/1783849939559__39.png)

- **Text props**: edit names, prices, descriptions in place;
- **Color props**: pick from a color picker or type a value;
- **Boolean props**: toggle checkboxes like "highlighted" or "draggable";
- **Number props**: type values like animation duration or damping.

![Color, boolean and number props each get a proper control](https://fsu.creght.com/site/2066727200882692096/1783849940346__40.png)

Components reused across the page are handled too — Creght knows **which card you clicked**, and your change lands only on that instance's data.

## Edits go back to the real source

Note the **source badge** next to each prop, like `PLANS[0].price`. It tells you where this content actually lives: a data list, a translation file, a shared constant, or CMS content.

Direct edits are **written back to that source**, not just painted over:

- Changing "¥399" on a pricing card updates the matching entry in the pricing data list;
- On a multilingual site, edits update the current language's translation file — other languages are untouched;
- Editing shared copy used in several places (like your site name) updates every usage, and the badge tells you so up front;
- For **CMS** content, the panel links you straight to the CMS entry to edit it there.

## Replace images

Select an image and the Direct edit section lets you:

- **Upload a new image** or paste an image URL;
- Edit the **alt text** (good for SEO);
- Adjust the **object fit** (cover, contain…).

Just like text, images sourced from data lists or shared config are written back to the data source.

## When to use AI instructions

Direct editing covers most text and images on a page. A few things are computed at runtime (like conditionally assembled copy) and can't be edited safely in place — in those cases the panel offers the **AI instruction** box instead; describe the change in one sentence.

These are also better jobs for AI:

- Layout, spacing and visual style changes;
- Adding or removing page sections;
- Bulk edits ("translate all button labels to English");
- Changing a component's structure or behavior.

## Shortcuts

| Action | How |
| --- | --- |
| Enter in-place editing | Double-click text |
| Save | Enter, or click anywhere else |
| Cancel | Esc |
| Open the element edit panel | Double-click any element |

From fixing a typo to reworking a whole pricing table, direct edits land in seconds — no queue, no wait, no credits. Leave the complex stuff to AI; leave the simple stuff to a double-click.

On this page

- [Double-click to start editing](#double-click-to-start-editing)
- [Edit every prop of a component](#edit-every-prop-of-a-component)
- [Edits go back to the real source](#edits-go-back-to-the-real-source)
- [Replace images](#replace-images)
- [When to use AI instructions](#when-to-use-ai-instructions)
- [Shortcuts](#shortcuts)

![Creght](https://ugc.talizen.com/_assets/site/2061660904709165056/1780797461299__creght_logo.png)

This website is built with [Creght](/)

[Discord](https://discord.gg/Qvq2nmZNnb)

## Links

- [Pricing](/price)
- [Help Center](/help)
- [Contact Us](/contact)
- [Blog](/blogs)
- [Refund Policy](/tuikuan)

## Resources

- [All Resources](/resources)
- [Templates](/templates)
- [Components](https://creghtlib.site.creght.com)
- [Animations](/effects)
- [Figma to Creght](/figma2creght)
- [API for AI](/api)

## Terms

- [Terms of Service](/legal/terms)
- [Privacy Policy](/legal/privacy)
- [Acceptable Use Policy](/legal/acceptable-use)

## Social Media

- [Twitter](https://twitter.com)
- [Facebook](https://www.facebook.com)
- [LinkedIn](https://www.linkedin.com)

[蜀ICP备2023038192号-2](https://beian.miit.gov.cn)