Introduction
Every CafeJS template is a bilingual Astro + TinaCMS website built on the same engine. This page covers what a template holds and the order to read these docs in.
What a template holds
- A bilingual website: Vietnamese at
/, English at/en/. Every page has both versions. - Content (text, images, menus, colours, SEO) is edited in the TinaCMS admin, whose interface is in Vietnamese, with a preview right beside the form.
- No database: all content is JSON files in
content/, kept in Git with the code. - Public pages are static HTML and load no React, so they are fast and run on any static host.
Pages are built from sections
Every page is a list of sections from top to bottom: banners, columns, rows of image and text, price lists, FAQs, forms… Each section has its own width, spacing and colour scheme, so a page can change pace without touching code. The full list is in 2.2 Pages and sections.
Tip
Open /design on the running site to see every section and its variants, along with the colours and the type scale.
In every template
- SEO: canonical, Open Graph, hreflang, structured data,
sitemap.xml,robots.txt; the admin shows a Google preview and keyphrase analysis. - Trackers: Google Analytics 4, Tag Manager, Meta Pixel, TikTok Pixel, Microsoft Clarity. Paste the IDs in the admin; trackers run after the visitor agrees.
- Blog: posts, categories, paged post lists, an RSS feed per language.
- Shop (off by default): products, categories and a cart that sends the order through Zalo, Messenger or phone.
- Preview admin: an admin visitors can open without signing in, edit and watch the preview change, with nothing saved.
Note
Examples in these docs come from the templates’ shared engine. Page, section and menu names in the template you bought may differ; the steps are the same.
What to read first
| You are | Read |
|---|---|
| The site owner or a writer | Part 2, starting at 2.1 Open the admin |
| A developer | 1.5 Run it locally, then part 3 |
| Having AI do the work | 4 Working with AI |