Zaradi preproste sintakse Markdown je odlična alternativa HTML-ju. Jezik je vedno podpiral vdelavo HTML, zdaj pa lahko greste drugače in v HTML vdelate Markdown.

Z uporabo preproste knjižnice lahko gostite vdelan Markdown na svojih spletnih straneh in ga sproti pretvorite v ustrezen HTML.

Kaj počne md-block?

Vaš trenutni postopek lahko vključuje ročno ustvarjanje datotek Markdown in njihovo nato pretvorbo v HTML. Tako deluje veliko sodobnih CMS aplikacij. Lahko pa uporabite okvir, kot je Angular za upodabljanje Markdown v strani.

Knjižnica md-block ni povsem alternativa; namesto tega izpolnjuje nekoliko drugačen primer uporabe. Pretvori vgrajeni Markdown v enakovreden HTML. Markdown lahko vdelate v svoje datoteke HTML in ga upodabljate na odjemalcu, ko zahtevate čas.

Takole bi lahko izgledalo:

<html>
<glavo>...</head>
<telo>
<md-blok>
# Naslov
Nekaj ​​*vgrajenega* Markdowna, ki ga lahko `md-block` pretvori namesto vas!
</md-block>
</body>
</html>

Dobro je, da svojo vdelano Markdown kodo poravnate levo, brez zamikov na začetku. Razlog za to je, da je začetni presledek lahko pomemben v Markdownu, za razliko od HTML.

Knjižnica uvaja lasten element HTML po meri, md-blok. Čeprav ta element ni del standarda HTML, to je veljavna tehnika. Standard spletnih komponent (MDN) vključuje API, imenovan Elementi po meri. Ta API podpira dinamično registracijo elementov po meri z uporabo JavaScripta.

Pred nalaganjem knjižnice md-block bo ta stran upodobljena na znan način:

Seveda lahko element md-block oblikujete tako, da je bolj podoben kot v urejevalniku besedil. Z vnaprej formatiranim presledkom in monospace pisavo je vsaj nekoliko lažje brati:

<stil>md-block { presledek: pre; družina pisav: monospace; }</style>

Morda boste želeli to vrsto rezultatov, če pišete vadnico o Markdownu. Omogoča vam razlago sintakse Markdown, hkrati pa vam omogoča enostavno urejanje vzorca Markdown:

Toda zabaven trik md-block je pretvorba tega Markdowna v končni HTML.

Tudi s privzetimi slogi brskalnika je vsebina zdaj prikazana tako kot vaš običajni HTML, čeprav ste jo v brskalnik poslali kot Markdown:

Kako uporabljati md-block

Ko na svojo stran dodate knjižnico md-block, lahko vanjo vpišete Markdown md-blok elementi. Knjižnica bo nato samodejno formatirala vaš Markdown, vi pa lahko nadaljujete z vdelavo Markdowna, kot želite.

Vendar pa obstaja nekaj različic tega postopka.

Pridobite skript na daljavo ali ga namestite sami

Najlažji način za začetek je referenca knjižnice na uradnem spletnem mestu md-block:

<vrsta skripta="modul" src="https://md-block.verou.me/md-block.js"></script>

To morda ni najučinkovitejši pristop, je pa zagotovo najhitrejši. Samo dodajte to kodo svoji glavo in vaša stran bo samodejno upodobila vse v elementu md-block v HTML:

Seveda lahko prenesete to datoteko JavaScript in jo gostite na svojem spletnem mestu. Lahko pa ga namestite prek npm:

npm namestite md-blok

Markdown Blocks vs. Inline Markdown

Privzeti element, imenovan po sami knjižnici, je md-blok. Lahko pa uporabite tudi md-razpon element za inline Markdown, kot je besedilo na sredini stavka:

Primer uporabe za inline Markdown je verjetno manj pogost, vendar ga lahko vseeno uporabite:

<str>Odstavek HTML, ki vsebuje <md-razpon>*ležeče*</md-span> besedilo.</str>

Kako sintakso označiti bloke Markdown kode s Prismom

Prizma je označevalnik sintakse, ki ga je soustvarila Lea Verou, ustvarjalka md-block. Uporabite ga lahko za označevanje vnaprej oblikovanih blokov kode na spletni strani, vključno s tistimi, ki jih ustvari md-block.

Torej, s tem HTML:

<html>
<telo>
<md-blok>
```javascript
funkcijokvadrat(število) {
vrnitev število * število;
}
```
</md-block>
<skript src="prism.js"></script>
</body>
</html>

Videli boste lepo oblikovano kodo s sintaktično upoštevanim poudarjanjem:

Vaše možnosti za pisanje na spletu so se pravkar povečale

Kako boste uporabljali md-block, je odvisno od vas, vendar obstaja veliko možnosti za inventivne rešitve z njegovo uporabo. Uporabite ga lahko za zagon zelo lahkega CMS za pisce, ki samozavestno uporabljajo Markdown, ne pa tudi HTML.

Markdown je popoln jezik za splošno občinstvo. Njegovo sprejetje z orodji, kot je Slack, bo najverjetneje še povečalo uporabo.