କଷ୍ଟୋମାଇଜ୍ ନେଭିଗେସନ୍ |

ନେଭିଗେସନ୍ କଷ୍ଟୋମାଇଜ୍ କରିବାକୁ ବ୍ୟାଖ୍ୟା କରିବାକୁ ଡେମୋ ସାଇଟ୍ କୁ ଏକ ଉଦାହରଣ ଭାବରେ ଗ୍ରହଣ କରିବା i18n-demo.github.io

ଉପରୋକ୍ତ ଚିତ୍ରରେ ସଂଖ୍ୟାଯୁକ୍ତ କ୍ଷେତ୍ରଗୁଡିକ ସହିତ ଅନୁରୂପ ଫାଇଲଗୁଡ଼ିକ ନିମ୍ନଲିଖିତ ଅଟେ:

1. ବାମ .i18n/htm/t1.pug
2. ଡାହାଣ .i18n/htm/t2.pug

pug ହେଉଛି ଏକ ଟେମ୍ପଲେଟ୍ ଭାଷା ଯାହା HTML ର ସୃଷ୍ଟି କରେ |

ବ୍ୟାକରଣ ଜାଣିବା ପାଇଁ ଏଠାରେ କ୍ଲିକ୍ କରନ୍ତୁ pug

ଆନ୍ତର୍ଜାତୀୟକରଣକୁ କାର୍ଯ୍ୟକାରୀ କରିବା ପାଇଁ ଫାଇଲରେ ଷ୍ଟ୍ରିଙ୍ଗ୍ ${I18N.sponsor} ବ୍ୟବହୃତ ହୁଏ, ଏବଂ ଏହାର ବିଷୟବସ୍ତୁ ଉତ୍ସ ଭାଷା ଡିରେକ୍ଟୋରୀରେ ସଂପୃକ୍ତ ପାଠ୍ୟ ସହିତ ବଦଳାଯିବ i18n.yml

ନାଭିଗେସନ୍ ବାର୍ ର ଶ style ଳୀ ସହିତ ଅନୁରୂପ ଫାଇଲ୍ ହେଉଛି .i18n/htm/topbar.css :

[!WARN] pug ରେ css ଏବଂ js ଲେଖନ୍ତୁ ନାହିଁ , ନଚେତ୍ ଏକ ତ୍ରୁଟି ଆସିବ |

ୱେବ୍ ଉପାଦାନଗୁଡ଼ିକ |

js ରେ pug ଲେଖାଯାଇପାରିବ ନାହିଁ | ଯଦି ପାରସ୍ପରିକ କ୍ରିୟା ଆବଶ୍ୟକ ହୁଏ, ଏହା ଏକ ୱେବ୍ ଉପାଦାନ ସୃଷ୍ଟି କରି ହାସଲ ହୋଇପାରିବ |

ଉପାଦାନଗୁଡ଼ିକ md/.i18n/htm/index.js ରେ ଏକ ୱେବ୍ ପୃଷ୍ଠା ଉପାଦାନକୁ ବ୍ୟାଖ୍ୟା କରିପାରିବ ଏବଂ ତାପରେ ଉପାଦାନକୁ foot.pug ରେ ବ୍ୟବହାର କରିପାରିବ |

ୱେବ୍ ଉପାଦାନଗୁଡିକ ସୃଷ୍ଟି କରିବା ସହଜ, ଯେପରିକି କଷ୍ଟମ୍ <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);
    }
  }
)

ସମ୍ପ୍ରତି x/i-h.js ରେ ରେଫରେନ୍ସ md/.i18n/htm/index.js , ଯାହାକି ନାଭିଗେସନ୍ ଏବଂ ଫୁଟର୍ କଷ୍ଟୋମାଇଜ୍ ହୋଇଥିବା ବିଷୟବସ୍ତୁ ପାଠ୍ୟର ଆନ୍ତର୍ଜାତୀୟକରଣ 18x/src/i-h.js ବ୍ୟବହୃତ ଏକ ୱେବ୍ ଉପାଦାନ |