Mira Astro documentation
Languages
Run your site in English and Odia, switch to one language, or add Hindi, Bengali, Spanish, Arabic or any other.
Mira ships in English and Odia. The first language has no prefix in its addresses (/about/), and every other language lives under its code (/or/about/). Each page links to its translations for search engines (hreflang tags), the sitemap lists every language, and the language switcher in the header takes visitors to the same page in the other language.
Where each language’s text lives
| What | Where |
|---|---|
| The list of languages | src/i18n/languages.mjs |
| Words the theme prints (buttons, “Open now”, the disclaimer) | src/i18n/ui.ts, one block per language |
| Your settings, menus and footer | src/site.config.ts, as { en: '...', or: '...' } |
| Pages, conditions, treatments, clinics, team and posts | A folder per language, such as src/content/pages/or/ |
Missing translations
If a page, condition, treatment, clinic, therapist or post has no file in a language yet, Mira uses the English file at that language’s address. You can launch a second language before everything is translated and fill in the rest over time.
Using one language only
- In
src/i18n/languages.mjs, delete theorline. - Delete the
orfolders insrc/content/pages/,conditions/,treatments/,locations/,team/andposts/. - Delete the
src/pages/or/folder.
The language switcher hides itself when there’s only one language. The or text in site.config.ts and ui.ts does no harm, but you can remove it.
Making Odia (or another language) the main one
Set defaultLang in src/i18n/languages.mjs to its code. That language then has no prefix, and English moves to /en/. Then rename src/pages/or/ to src/pages/en/ and change 'or' to 'en' in the file inside it: the default language’s RSS feed is the one directly in src/pages/, and every other language has its own folder.
Adding a language
Hindi as an example:
-
Register it. In
src/i18n/languages.mjs, add a line:hi: { name: 'हिन्दी', dir: 'ltr', locale: 'hi-IN' },nameis shown in the switcher,localecontrols how dates, times and prices are written, anddiris'rtl'for right-to-left languages such as Arabic or Urdu. -
Translate the theme’s words. In
src/i18n/ui.ts, copy theorblock, rename ithi, translate each line, and add it to the list:export const ui = { en, or, hi };. If you miss a line,npm run checktells you which. -
Add its feed. Copy
src/pages/or/tosrc/pages/hi/, and in the file inside it change'or'to'hi'. -
Translate your content. Create
hifolders next to theenones insrc/content/pages/,conditions/,treatments/,locations/,team/andposts/, and copy in the files you want to translate, keeping the same file names. Copysearch.mdtoo, so the language has its own search page. -
Translate your settings. Add
hi: '...'to the text insite.config.ts. Anything without a Hindi version falls back to English.
Indian and other scripts
The heading font, Lexend, covers Latin scripts only. Pages in Odia, Hindi, Bengali, Tamil and Telugu switch to the system fonts that phones, Windows and Macs already carry for those scripts (Noto Sans and Nirmala UI), with taller lines for the vowel signs. That adds nothing to page weight. The rules are at the end of src/styles/tokens/scale.css; add your language’s code there if it isn’t listed.
Right-to-left languages
With dir: 'rtl', the whole layout mirrors: menus, cards, arrows, hours tables and forms. Mira’s styles use logical directions throughout, so no extra CSS is needed. Pages in Arabic, Persian and Urdu use system fonts that carry those scripts.
Search in every language
Each language gets its own search index, built by npm run build, and visitors only see results in the language they’re reading.
Checking translations
The Odia in the demo is sample copy. Before you publish a language, have a native speaker read the pages and ui.ts.