أداة المطور

i18nاستخراجأداة

معالجة ملفات HTML بسرعة لاستخراج محتوى النص وإنشاء ملفات موارد JSON موحدة للتدويل، مما يبسط تطوير مواقع الويب متعددة اللغات.

ابدأ الاستخراج استعادة HTML اعرف المزيد

index.html

<div class="header">
  <h1>Welcome</h1>
  <p>Sample text</p>
  <button>Start</button>
</div>

en.json

{
  "header.title": "Welcome",
  "header.description": "Sample text",
  "header.button": "Start"
}

الميزات الرئيسية

القدرات الأساسية

مساران قويان: استخراج النصوص من HTML إلى JSON، واستعادة HTML الأصلي من القوالب ذات المفاتيح باستخدام JSON

تحليل HTML

قدرات قوية لتحليل HTML تتعرف بدقة على محتوى النص وتستخرجه من علامات متنوعة مع التصفية التلقائية لأكواد البرامج النصية والنمط

إخراج JSON قياسي

يولد تلقائيًا ملفات موارد JSON قياسية للتدويل مع تعيينات مفتاح-قيمة وهياكل متداخلة للتكامل المباشر

استعادة HTML

قدم JSON للترجمة و HTML ذي المفاتيح t(...) لإعادة بناء HTML الأصلي واستعادة النصوص دون تغيير قوالبك

عملية بسيطة

ثلاث خطوات بسيطة

لقد بسطنا عملية تدويل HTML لإكمال سير العمل بالكامل في دقائق فقط

رفع ملفات HTML

حدد أو اسحب وأفلت ملفات HTML الخاصة بك للمعالجة. يدعم ملفات متعددة للمعالجة الدفعية.

تكوين خيارات الاستخراج

اضبط قواعد الاستخراج والبادئات والاستثناءات لتخصيص هيكل الإخراج لمتطلبات محددة.

تصدير ملفات JSON

أنشئ وقم بتنزيل ملفات موارد التدويل بتنسيق JSON للتكامل الفوري في مشروعك.

ابدأ الاستخراج جرب الاستعادة

أمثلة

شاهدها في العمل

جرب كيف تحول أداتنا محتوى HTML إلى موارد تدويل منظمة

الإدخال: ملف HTMLsource.html

<div class="header">
  <h1>Welcome to our service</h1>
  <p>This is a sample text to demonstrate i18n extraction.</p>
  <button title="Click to continue">Get Started</button>
</div>

الإخراج: ملف JSONtranslations.json

{
  "header.title": "Welcome to our service",
  "header.description": "This is a sample text to demonstrate i18n extraction.",
  "header.button.text": "Get Started",
  "header.button.title": "Click to continue"
}

مثال التكامل

بعد الاستخراج، يمكنك بسهولة دمج ملفات JSON مع مكتبات i18n الشائعة:

// React + i18next (example)
import i18n from 'i18next'
import { useTranslation } from 'react-i18next'
import translations from './translations.json'

i18n.init({ resources: { en: { translation: translations } } })

function Header() {
  const { t } = useTranslation()
  return (
    <div className="header">
      <h1>{t('header.title')}</h1>
      <p>{t('header.description')}</p>
      <button title={t('header.button.title')}>{t('header.button.text')}</button>
    </div>
  )
}

هل أنت مستعد للتدويل؟

ابدأ استخراج موارد التدويل من ملفات HTML الخاصة بك اليوم وبسط تطويرك متعدد اللغات

ابدأ الاستخدام الآن