Membangun Blog Multibahasa dengan Astro
10827
Membangun Blog Multibahasa dengan Astro
Mendukung banyak bahasa dalam blog membukanya untuk audiens global. Begini cara membangunnya menggunakan Astro dengan konten dwibahasa yang disimpan di Cloudflare D1.
Strategi Konten
Alih-alih route terpisah per bahasa, kita menyimpan kedua bahasa dalam record artikel yang sama:
CREATE TABLE articles (
id TEXT PRIMARY KEY,
slug TEXT NOT NULL,
title_en TEXT NOT NULL,
content_en TEXT NOT NULL,
title_id TEXT NOT NULL,
content_id TEXT NOT NULL,
...
);Pergantian Bahasa
Toggle sederhana beralih antara versi bahasa di sisi klien:
---
const { lang } = Astro.params;
const article = await getArticle(slug);
const title = lang === 'id' ? article.titleId : article.titleEn;
const content = lang === 'id' ? article.contentId : article.contentEn;
---
<h1>{title}</h1>
<div set:html={renderMarkdown(content)} />
<a href={lang === 'en' ? `/id/${slug}` : `/en/${slug}`}>
{lang === 'en' ? 'Bahasa Indonesia' : 'English'}
</a>Pertimbangan SEO
- Gunakan tag
hreflanguntuk SEO yang tepat - Buat sitemap dengan semua varian bahasa
- Atur atribut
langyang sesuai pada<html>
Manfaat Pendekatan Ini
- Single source of truth — kedua bahasa tetap sinkron
- Perawatan mudah — edit satu record, kedua bahasa terupdate
- Update atomik — publish kedua bahasa secara bersamaan
Comments
commenter 11mo ago
hey ini komentar