# Creating a Project in Creght | Creght Visual Documentation

> You can start a new project either from a template or as a blank project . If you are new to Creght, we recommend starting with a template.…

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

[Changelog](/en/blogs.md)

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

Basic

- [Get to Know Creght in 2 Minutes](/en/docs/get-start.md)
- [How to Register for Creght](/en/docs/signup.md)
- [Creating a Project in Creght](/en/docs/create-site.md)
- [Templates](/en/docs/tpls.md)

Design

- [Using the Editor](/en/docs/editor.md)
- [Basic Operations](/en/docs/operating.md)
- [Layouts in Creght](/en/docs/layout.md)
- [Position in Creght](/en/docs/position.md)
- [Size in Creght](/en/docs/size.md)
- [Breakpoints in Creght](/en/docs/breakpoint.md)
- [Overlays](/en/docs/popover.md)
- [Components in Creght](/en/docs/components.md)
- [Adding Third-Party Fonts](/en/docs/tp-font.md)
- [Duplicate and Deep Copy](/en/docs/deep-copy.md)

CMS

- [CMS (Content Management System)](/en/docs/cms.md)
- [Importing WeChat Official Account Articles into CMS](/en/docs/wxmp.md)

Site Setting

- [Page Settings](/en/docs/page-setting.md)
- [How to Upgrade a Plan](/en/docs/manage-plan.md)
- [SEO Settings](/en/docs/seo-setting.md)
- [Small Files (Site Verification)](/en/docs/verification-file.md)
- [Adding a Custom Domain in Creght](/en/docs/custom-domain.md)
- [How to Complete ICP Filing](/en/docs/beian.md)
- [Server Nodes](/en/docs/website-node.md)
- [How to Switch Sites](/en/docs/pxrp79jqtnyq.md)
- [Localization](/en/docs/localization.md)

AI

- [About Creght AI](/en/docs/creght-ai.md)

Tool

- [Convert Figma Designs into Live Websites](/en/docs/figma-to-creght.md)
- [3 Guidelines for Responsive Figma Layouts](/en/docs/figma-autolayout.md)
- [Covert Figma to live website](/en/docs/response-site.md)
- [Figma to Responsive Website: Interactions](/en/docs/figma03.md)
- [Compressing Video with FFmpeg](/en/docs/ffmpeg.md)
- [How to Add Clarity to Your Website](/en/docs/clarity.md)
- [Creating a Button Hover Effect](/en/docs/button.md)
- [How to Build a Reusable Collapsible FAQ Panel](/en/docs/collapse.md)
- [Responsive Navigation Tutorial](/en/docs/nav.md)

Basic/

# Creating a Project in Creght

You can start a new project either from a **template** or as a **blank project**.

If you are new to Creght, we recommend starting with a template. Templates usually demonstrate most of Creght’s core features, so you can quickly build a fully functional website by making simple edits.

## Starting from a Template

On the **Dashboard homepage**, you will see featured templates. Click **Use Template** to create a project from one of them:

![image.png](https://fsb.huglight.cn/51f743a5973e3537ca62c6482d8964ed/image.png)

In the **Template Marketplace**, you can browse and choose from all available templates.

![](https://fsb.huglight.cn/project/mtdDqMgsnYi/mfsVrJDPEqn__image.png)

> 🔧 We are continuously updating our template library. If you cannot find a template that fits your needs, please share your requirements with us. We may prioritize building a template for you. For higher design requirements, we also provide **professional designer services**.

## Starting from a Blank Project

If you are already familiar with Creght, you may choose a **blank project** to build your website from scratch.

A blank project doesn’t mean you have to build block by block. To help you work more efficiently, Creght provides:

- **Website templates as references** – Create a template-based project, copy sections you like, and paste them into your own project.
- **Block templates** – Pre-designed blocks that can be copied and reused. Click here to explore block templates.

## Editing Your Website

In your project list, click **Design** to enter the editor.

![](https://fsb.huglight.cn/project/mtdDqMgsnYi/mfsVsttMBsJ__image.png)

If you start from a blank project, the first step is adding elements.

### Adding a Container Element

- Click the **box icon** in the top toolbar to enter container mode.
- Draw a container on the canvas by clicking and dragging.
![image.png](https://fsb.huglight.cn/a2ca8623e0228f7e1d10fb82f2c3e990/image.png)
- You can also use shortcuts for faster workflow:
  - **F** → Container mode
  - **T** → Text mode

💡 **Tip:** When designing a block, you can first build it outside the breakpoint area, and move it inside later. This helps you stay focused while editing.

### Adding a Text Element

- Click the **T icon** to enter text mode.
- Click anywhere on the canvas, then type your text.
![image.png](https://fsb.huglight.cn/df19d92dd1e87a74bb8f263b9870df9a/image.png)

### Adding a Block

While containers and text elements are the foundation of web design, adding them one by one can be inefficient.

That’s why the **Insert Panel** provides pre-made blocks.

- Click the **\+ icon** to expand the Insert Panel.
- Either **drag & drop** a block onto the canvas, or **click** it to auto-insert into the main container.
![](https://fsb.huglight.cn/project/mtdDqMgsnYi/mfsVteltJwX__image.png)

## Editing Elements

When you select an element, the right panel displays its settings.

![image.png](https://fsb.huglight.cn/7acb8a65f1bbed8bcd1957b0c1a327a8/image.png)

### Text Element Settings

From top to bottom: **Position, Size, Animation, Cursor, Style, Text, Transform, Accessibility**.

Only **Text** is exclusive to text elements; other properties are shared across element types.

### Container Element Settings

![image.png](https://fsb.huglight.cn/b705d562b0bc3f598b0af7a2d192ab0b/image.png)

From top to bottom: **Position, Size, Animation, Cursor, Style, Accessibility, Layout**.

- **Layout** is unique to containers and controls how child elements are arranged.

💡 **Tip:** The best way to learn is by experimenting. Don’t worry about breaking anything—you can always press **Ctrl+Z (⌘+Z)** to undo.

## Publishing Your Website

When ready, click the **Publish** button in the top-right corner, then click **Update** to deploy your site.

After publishing, Creght automatically assigns your site a **default domain** (visible in the publish dialog).

![](https://fsb.huglight.cn/project/mtdDqMgsnYi/mfsVtYJHppH__image.png)

Before going live, we recommend:

1. **Complete SEO settings** → Helps search engines index your site more accurately. Learn more here.
2. **Bind a custom domain** → Improves professionalism and brand authority. Learn more here.

🎉 Now your site is live! Next, we will explore Creght’s advanced features.

On this page

- [Starting from a Template](#starting-from-a-template)
- [Starting from a Blank Project](#starting-from-a-blank-project)
- [Editing Your Website](#editing-your-website)
- [Adding a Container Element](#adding-a-container-element)
- [Adding a Text Element](#adding-a-text-element)
- [Adding a Block](#adding-a-block)
- [Editing Elements](#editing-elements)
- [Text Element Settings](#text-element-settings)
- [Container Element Settings](#container-element-settings)
- [Publishing Your Website](#publishing-your-website)

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

This website is built with [Creght](/en.md)

![User Community](https://ugc.talizen.com/_assets/site/2061660904709165056/1781070374701__help_qr.webp)

User Community

## Links

- [Pricing](/en/price.md)
- [Solutions](/en/solution.md)
- [Customers](/en/customers.md)
- [Help Center](/en/help.md)
- [Contact Us](/en/contact.md)
- [Blog](/en/blogs.md)
- [Refund Policy](/en/tuikuan.md)

## Resources

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

## Comparisons

- [vs Shianxianle](/en/creght-vs-sxl.md)
- [vs Fanke](/en/creght-vs-fkw.md)
- [自己写代码 vs Creght](/en/compare/self-coding.md)
- [外包 vs 自己做](/en/compare/outsourcing.md)

## Terms

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

## Social Media

- [Xiaohongshu](https://www.xiaohongshu.com/user/profile/5a38606811be10715f4895b6)
- [Bilibili](https://space.bilibili.com/513308095)

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