Benotzerdefinéiert Navigatioun

Loosst eis den Demo Site als i18n-demo.github.io huelen fir ze erklären wéi Dir d'Navigatioun personaliséiere kënnt.

D'Dateien entspriechend den nummeréierte Beräicher an der uewe genannter Figur sinn wéi follegt:

lénks .i18n/htm/t1.pug
Richteg .i18n/htm/t2.pug

pug ass eng Schabloun Sprooch déi HTML generéiert.

D'Formatstring ${I18N.sponsor} gëtt an der Datei benotzt fir Internationaliséierung ëmzesetzen, a säin Inhalt gëtt duerch den entspriechende Text am i18n.yml ersat.

De Fichier deen .i18n/htm/topbar.css :

[!WARN] Schreift net css an js an pug , soss gëtt et e Feeler.

Web Komponenten

js kann net an pug geschriwwe ginn. Wann Interaktioun erfuerderlech ass, kann et erreecht ginn andeems Dir e Webkomponent erstellt.

Komponente kënnen eng Websäit Komponent an md/.i18n/htm/index.js definéieren an dann de Komponent an foot.pug benotzen.

Et ass einfach Webkomponenten ze kreéieren, sou wéi personaliséiert <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);
    }
  }
)

De Moment gëtt x/i-h.js an md/.i18n/htm/index.js referenzéiert, wat e Webkomponent ass fir d'Internationaliséierung vun der Navigatioun a footer personaliséierten Inhaltstext Kuckt de Quellcode 18x/src/i-h.js