Open the admin
The TinaCMS admin is where all content is edited: the form on the left, the page’s preview on the right. The admin’s interface is in Vietnamese; the site’s collection and field names are in English.
Admin addresses
| How it runs | Admin address | Where Save sends the content |
|---|---|---|
pnpm dev on your computer | http://localhost:4321/admin/index.html | Files in content/ on your computer |
| Live with TinaCloud | https://<your domain>/admin/ | TinaCloud commits to GitHub, then the host rebuilds the site |
| Static export | No admin online | Edit locally, rebuild and upload again |
Editing, step by step
- Open the admin address from the table above.
- The first time, press Vào chế độ chỉnh sửa (Enter edit mode).
- Pick a collection in the left bar (for example Pages), then the page to edit.
- The form shows on the left, the preview on the right.
- Press Lưu (Save).
Tip
Click a line of text in the preview and the form opens that very field.
The preview
The preview on the right is the page’s /preview/… copy (for example /preview/gioi-thieu/), redrawn as you type.
- Switching pages: pick another page in the admin’s list. While the editing panel is open, links in the preview don’t navigate.
- Clicking the preview: while the editing panel is open, a click on text, a button, a link or the menu selects that field in the form instead of acting. Press Ẩn khung chỉnh sửa (Hide editing panel) and they work as on the live site.
- Live in the preview: every section, the announcement bar, header, footer, menus, Theme and Colour schemes.
- Not live: the tab title and favicon; a scheme or menu created in the admin; the SEO & Tracking collection. These show after the next build.
Warning
Hiding a section does not keep its content private: the /preview/… page carries hidden sections too, and anyone with the address can open it. Don’t leave unpublished text in a hidden section.
The preview admin
A build made with pnpm build:review has an admin visitors can open without signing in. The Lưu (Save) button sits under an orange bar, “Bản xem thử: thay đổi sẽ không được lưu.” (preview only: changes are not saved). Visitors can edit and watch the preview change; nothing is saved, and reloading brings the original content back.
The admin’s collections
| Collection | Edits | File |
|---|---|---|
| Theme | Brand name, logo, favicon, fonts, type size, corner radius, button style, spacing, contact details, the shop switch | content/theme.json |
| SEO & Tracking | Site-wide SEO, verification codes, tracker IDs, visitor consent | content/seo.json |
| Colour schemes | The eight colours of each scheme | content/schemes/ |
| Header & footer | The announcement bar, header and footer of each language | content/chrome/ |
| Menus | Each language’s menus | content/menus/ |
| Pages | The pages, built from sections | content/pages/ |
A template with a blog adds Blog posts and Blog categories; with the shop on, Products and Product categories.