localize.dev

الوثائق / Static HTML

ترجمة موقع ويب HTML الثابت، تلقائيًا

ترجمة موقع HTML الثابت: يتم إضافة علامات data-i18n إلى النسخ، ويحل محلها ملف صغير i18n.js لكل لغة، مع صفحات مترجمة اختيارية لكل لغة باستخدام hreflang للبحث عن المحركات.

كيف يعمل

يبقى النص في الصفحة ويحصل على علامة data-i18n؛ يتم استبدال i18n.js المولّد بلغة الزائر. تبقى الجمل حول العناصر المضمنة كاملة.

ضبط "htmlPages": true لكتابة كل صفحة مترجمة لكل لغة (es/index.html) مع روابط hreflang، بحيث تقوم محركات البحث بفهرسة كل لغة.

قبل وبعد

المخرجات الحقيقية للمحرك لهذا الملف. في تشغيل حقيقي، يقوم النموذج المستضاف بتسمية المفاتيح من السياق.

index.html · قبل
<h1>Send money anywhere</h1>
<p>Transfers arrive in <strong>minutes</strong>, not days.</p>
<input placeholder="Your email address" />
index.html · بعد
<h1 data-i18n="home.send_money_anywhere">Send money anywhere</h1>
<p data-i18n="home.transfers_arrive_in_minutes_not">Transfers arrive in <strong>minutes</strong>, not days.</p>
<input placeholder="Your email address" data-i18n-placeholder="home.your_email_address" />
locales/en.json
{
  "home": {
    "send_money_anywhere": "Send money anywhere",
    "transfers_arrive_in_minutes_not": "Transfers arrive in <strong>minutes</strong>, not days.",
    "your_email_address": "Your email address"
  }
}

ما يضيفه الإعداد

الإعداد الأول يقوم بإعداد ملف i18n.js مولد إذا لم يكن المشروع يحتوي عليه بعد:

  • i18n.js، مرتبط من كل صفحة، مع كل لغة مجمعة للصفحات المفتوحة من القرص
  • قائمة لغة <select data-i18n-switcher> اختيارية

قم بتشغيله

يتطلب CLI إصدار Node.js 22 أو أحدث.

npm install --save-dev localize-dev
npx localize-dev login

# Preview, then write the changes
npx localize-dev run --dry-run -l es,fr,de
npx localize-dev run -l es,fr,de

# Or open a pull request instead
npx localize-dev pr -l es,fr,de

أو أضف إجراء GitHub واحصل على طلب سحب عند كل دفعة. جربه على الكود الخاص بك أولاً في ملعب.