اللغات

اللغات المتوفرة

كل نص وعنوان زر ووصف صورة ورسالة نموذج وعنوان صفحة موجود باللغتين.

كيف تُختار اللغة

• الصفحات الإنجليزية بلا لغة في العنوان، والصفحات العربية تبدأ بـ /ar.
• الزائر الذي يفتح / بمتصفح يفضّل العربية يُوجَّه إلى /ar. وهذا يتم في src/proxy.ts.
• قائمة اللغة في الترويسة، وفي القائمة على الهواتف، تبدّل اللغة وتُبقي الزائر في الصفحة نفسها. ويتذكر الموقع الاختيار للزيارة التالية.
• لكل لغة عنوانها ووصفها وعنوانها الأساسي الخاص، وكل صفحة تخبر محركات البحث بمكان اللغة الأخرى.

من اليمين إلى اليسار

في الصفحات العربية، يضبط src/app/[locale]/layout.tsx القيمتين lang="ar" وdir="rtl" على الصفحة، فينعكس التخطيط كله: الترويسة والبطاقات ونموذج لوحة التحكم وإمالته ثلاثية الأبعاد، وتُقرأ النماذج من اليمين إلى اليسار.

تستخدم المكوّنات أصناف Tailwind المنطقية التي تتبع الاتجاه، مثل ms-2 وpe-4 وstart-0 وtext-start. عندما تضيف عناصر، استخدم هذه بدلًا من ml-* أو pr-* أو left-* أو text-left، وإلا ظهرت الصفحة العربية بشكل خاطئ.

تبقى بعض العناصر من اليسار إلى اليمين في اللغتين عمدًا: الطرفية وشجرة الملفات في بطاقات الميزات، والرسوم البيانية، وأرقام الهواتف في صفحة التواصل.

أين توجد النصوص

النصوص مقسمة إلى أربعة مجلدات تحت messages/، في كل منها en.json وar.json:

غيّر نصًا

• غيّر القيمة في الملف الإنجليزي وما يقابلها في الملف العربي. أبقِ المفاتيح نفسها في الملفين.
• المفتاح المفقود من أحد الملفين يظهر اسمه بدل النص في صفحة تلك اللغة.
• الكلمات بين الأقواس المعقوفة، مثل {year} و{count} و{name}، يملؤها الموقع. أبقها كما هي.

تسميات الموقع بالعربية

عندما تكتب عن الموقع بالعربية، استخدم التسميات التي يعرضها:

أضف لغة

1. 01

   أضف رمزها إلى التوجيه

   أضف رمز اللغة إلى locales في src/i18n/routing.ts. مثلًا الفرنسية:

   src/i18n/routing.tsنسخ

   locales: ["en", "ar", "fr"],
2. 02

   أضف ملفات رسائلها

   في كل مجلد من المجلدات الأربعة تحت messages/، انسخ en.json برمز اللغة الجديدة وترجم القيم. أبقِ كل مفتاح وكل كلمة بين أقواس معقوفة، واضبط metadata.ogLocale في messages/common/fr.json، مثل fr_FR. لمجلد home:

   الطرفيةفي Publino-templateنسخ

   cp messages/home/en.json messages/home/fr.json
3. 03

   أضفها إلى قوائم اللغة

   أعطها علمًا ورمزًا في src/components/LanguageSwitcher/index.tsx (flagComponents وlocaleIsoCodes)، وعلمًا واسمًا في src/layouts/Navbar/components/MobileLanguageSwitcher.tsx (flagComponents وlocaleNames). تأتي الأعلام من country-flag-icons، مثل FR.
4. 04

   اضبط اتجاهها، إن احتاجت إلى ذلك

   تُعامل العربية وحدها على أنها من اليمين إلى اليسار. للغة أخرى بهذا الاتجاه، وسّع فحوص locale === "ar" في src/app/[locale]/layout.tsx وsrc/features/home/DashboardMockup/components/index.tsx وsrc/features/home/WhyChooseUs/index.tsx.

أعد تشغيل yarn dev أو ابنِ من جديد، فتعمل اللغة الجديدة على عنوانها، وهو هنا /fr. وتلتقطها الروابط الأساسية وروابط اللغات وخريطة الموقع تلقائيًا.