الملاحة المخصصة

لنأخذ الموقع i18n-demo.github.io كمثال لشرح كيفية تخصيص التنقل.

الملفات المقابلة للمناطق المرقمة في الشكل أعلاه هي كما يلي:

1. اليسار .i18n/htm/t1.pug
2. حق .i18n/htm/t2.pug

pug هي لغة القالب التي تولد HTML .

➔ انقر هنا لتتعلم قواعد اللغة pug

يتم استخدام سلسلة التنسيق ${I18N.sponsor} في الملف لتنفيذ التدويل، وسيتم استبدال محتواها بالنص i18n.yml في دليل اللغة المصدر.

الملف المطابق لنمط شريط .i18n/htm/topbar.css :

[!WARN] لا تكتب css و js في pug ، وإلا فسيكون هناك خطأ.

مكونات الويب

لا يمكن كتابة js في pug إذا كان التفاعل مطلوبًا، فيمكن تحقيقه عن طريق إنشاء مكون ويب.

يمكن للمكونات تعريف مكون صفحة الويب في md/.i18n/htm/index.js ثم استخدام المكون في foot.pug .

من السهل إنشاء مكونات الويب، مثل <x-img> المخصصة0 .

customElements.define(
  'x-img',
  class extends HTMLElement {
    constructor() {
      super();
      var img = document.createElement('img');
      img.src = '//p.3ti.site/i18n.svg';
      img.style = "height:99px;width:99px;";
      this.append(img);
    }
  }
)

تتم الإشارة حاليًا إلى x/i-h.js في md/.i18n/htm/index.js ، وهو مكون ويب يستخدم لتدويل نص المحتوى المخصص للتنقل والتذييل، راجع الكود المصدري 18x/src/i-h.js