Sådan tilføjes stilarter til TinyMCE & Markdown Content
Mange forfattere foretrækker arbejder i markdown fordi det er et enklere sprog med færre forhindringer at klatre op. Gitt det er langt fra perfekt, men det byder på a renere visning af din tekst med lethed af eksporterer til HTML.
Desværre er standard Markdown-stilarter normalt ret kedelige. Men med wysiwyg.css bibliotek, du kan Har et levende dokument på ingen tid.
Dette gratis CSS-bibliotek forvandler alle dine grundlæggende TinyMCE- eller Markdown-indhold til formaterede, letlæselige blokke af HTML.
Du behøver ikke at vide noget komplekst HTML / CSS for at bruge dette plugin. ganske enkelt Indpak det genererede indhold ind i en div med klassen .wysiwyg
, og du er helt klar.
Det virkelige problem er at opbygge en app, der ville automatisere denne proces eller tilføje dette bibliotek på backend for et brugeradministratorpanel.
Men mulighederne er uendelige, og du kan endda bruge dette til lokalt skrivearbejde hvis du foretrækker at eksportere dit indhold fra Markdown til HTML.
Som standard har dette CSS-bibliotek støtte til alle vigtige HTML-mærker forestille sig. Dette omfatter alle overskrifter, lister, links, præ / kode tags, figurer og endda semi-obskure tags som og
. Der er en fuld liste i GitHub repo, hvis du vil tjekke det ud.
Hvis du definerer dine egne typografiske stilarter, kan disse endda omskrive standardindstillingerne i stilarket. Så du kan få alle fordelene ved wysiwyg.css blandet med dine egne skrifttype valg.
Biblioteket kunne heller ikke være lettere at opsætte. Lige Download en kopi lokalt eller Træk det direkte ved brug af npm installere wysiwyg.css
Derfra er du bare inkludere CSS-filen i dit dokumenthoved, og lad det køre. Det vil kun målrette indholdet inde i en container med klassen .wysiwyg
, så denne klasse skal pakke uanset hvilken beholder du ønsker.
Biblioteket er stadigvæk opdateret halv-hyppigt, så du kan Find seneste opdateringer i de vigtigste GitHub repo. Og hvis du har forslag eller ideer til nye opdateringer, er du velkommen til at dele med skaberen Jeremy Thomas på sin Twitter side @ jgthms.