Moslashtirilgan Navigatsiya

Navigatsiyani qanday sozlashni tushuntirish uchun demo saytni misol qilib olaylik i18n-demo.github.io

Yuqoridagi rasmdagi raqamlangan maydonlarga mos keladigan fayllar quyidagilar:

  1. Chap .i18n/htm/t1.pug
  2. To'g'ri .i18n/htm/t2.pug

pug HTML ni hosil qiluvchi shablon tilidir.

➔ Grammatikani oʻrganish uchun shu yerni bosing pug

${I18N.sponsor} format satri faylda xalqarolashtirishni amalga oshirish uchun ishlatiladi va uning mazmuni manba til katalogidagi tegishli i18n.yml bilan almashtiriladi.

Navigatsiya paneli uslubiga mos keladigan fayl .i18n/htm/topbar.css :

[!WARN] pug ga css va js yozmang , aks holda xato bo'ladi.

Veb Komponentlari

js pug da yozib bo'lmaydi. Agar o'zaro ta'sir zarur bo'lsa, unga veb-komponentni yaratish orqali erishish mumkin.

Komponentlar veb-sahifa komponentini md/.i18n/htm/index.js da belgilashi va keyin foot.pug dagi komponentdan foydalanishi mumkin.

Maxsus <x-img> kabi veb komponentlarini yaratish oson.

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);
    }
  }
)

Hozirda x/i-h.js ga havola qilingan md/.i18n/htm/index.js , u 18x/src/i-h.js xalqarolashtirish va moslashtirilgan kontent matni uchun ishlatiladigan veb-komponentdir.