Customized Navigation

Cia peb coj lub vev xaib demo i18n-demo.github.io piv txwv los piav qhia yuav ua li cas rau kev hloov kho navigation.

Cov ntaub ntawv sib raug rau cov lej suav hauv daim duab saum toj no yog raws li hauv qab no:

  1. Sab laug .i18n/htm/t1.pug
  2. Txoj cai .i18n/htm/t2.pug

pug yog ib hom lus template uas generates HTML 's.

➔ Nyem qhov no kom paub cov qauv sau ntawv ntawm pug

Hom kab ntawv ${I18N.sponsor} yog siv rau hauv cov ntaub ntawv los siv kev ua haujlwm thoob ntiaj teb, thiab nws cov ntsiab lus yuav raug hloov nrog cov ntawv sib xws hauv i18n.yml

Cov ntaub ntawv sib raug rau cov style ntawm navigation bar .i18n/htm/topbar.css :

[!WARN] Tsis txhob sau css thiab js hauv pug , txwv tsis pub yuav muaj qhov yuam kev.

Web Cheebtsam

pug tsis tuaj yeem sau js Yog tias yuav tsum muaj kev sib cuam tshuam, nws tuaj yeem ua tiav los ntawm kev tsim lub vev xaib.

Cheebtsam tuaj yeem txhais cov nplooj ntawv web hauv md/.i18n/htm/index.js thiab tom qab ntawd siv cov khoom hauv foot.pug .

Nws yog ib qho yooj yim los tsim cov khoom hauv lub vev xaib, xws li kev cai <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);
    }
  }
)

Tam sim no x/i-h.js tau hais txog hauv md/.i18n/htm/index.js , uas yog lub vev xaib siv rau kev ua haujlwm thoob ntiaj teb ntawm kev taw qhia thiab cov ntsiab lus hauv qab cov ntsiab lus kho kom raug Saib qhov chaws 18x/src/i-h.js