Customized Nabigasyon

Kunin natin ang demo site i18n-demo.github.io bilang isang halimbawa para ipaliwanag kung paano i-customize ang nabigasyon.

Ang mga file na tumutugma sa mga may bilang na lugar sa figure sa itaas ay ang mga sumusunod:

1. Kaliwa .i18n/htm/t1.pug
2. Tama .i18n/htm/t2.pug

pug ay isang template na wika na bumubuo ng HTML 's.

➔ Mag-click dito para matutunan ang grammar ng pug

Ang format na string ${I18N.sponsor} ay ginagamit sa file upang ipatupad ang internasyonalisasyon, at ang nilalaman nito ay papalitan ng kaukulang teksto sa i18n.yml

Ang file na naaayon sa istilo ng navigation bar .i18n/htm/topbar.css :

[!WARN] Huwag isulat css at js sa pug , kung hindi, magkakaroon ng error.

Mga Bahagi Ng Web

js ay hindi maaaring isulat sa pug Kung kinakailangan ang pakikipag-ugnayan, maaari itong makamit sa pamamagitan ng paglikha ng isang bahagi ng web.

Maaaring tukuyin ng mga bahagi ang isang bahagi ng web page sa md/.i18n/htm/index.js at pagkatapos ay gamitin ang bahagi sa foot.pug .

Madaling gumawa ng mga bahagi ng web, gaya ng mga custom <x-img> .

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

Sa kasalukuyan, x/i-h.js ay tinutukoy sa md/.i18n/htm/index.js , na isang bahagi ng web na ginagamit para sa internasyonalisasyon ng nabigasyon at footer na naka-customize na teksto ng nilalaman Tingnan ang source code 18x/src/i-h.js