Så här lägger du till stilar till TinyMCE & Markdown Content

Många författare föredrar jobbar i Markdown eftersom det är ett enklare språk med färre hinder att klättra. Beviljas det är långt ifrån perfekt, men det erbjuder a renare vy av din text med lätthet av exporterar till HTML.

Tyvärr är standard Markdown-stilar oftast ganska tråkiga. Men med wysiwyg.css bibliotek, du kan ha ett pulserande dokument på nolltid.

Detta gratis CSS-bibliotek omvandlar alla dina grundläggande TinyMCE- eller Markdown-innehåll till formaterade, lättlästa block av HTML.

Du behöver inte veta någon komplex HTML / CSS för att använda det här plugin. Helt enkelt vikla det genererade innehållet in i en div med klassen .WYSIWYG, och du är helt upptagen.

Den verkliga svårigheten är att bygga en app som skulle automatisera denna process, eller lägga till det här biblioteket på backend för en användaradministratörspanel.

Men möjligheterna är oändliga, och du kan till och med använda det här för lokalt skrivande arbete om du föredrar att exportera ditt innehåll från Markdown till HTML.

Som standard har detta CSS-bibliotek stöd för alla större HTML-taggar tänkbar. Detta inkluderar alla rubriker, listor, länkar, pre / kodtaggar, figurer och till och med semi-obscure taggar som och . Det finns en full lista i GitHub repo om du vill kolla in det.

Om du definierar dina egna typografiska stilar kan dessa även skriva om standardinställningarna i stilarket. Så du kan få alla fördelar med wysiwyg.css blandas med dina egna typsnitt val.

Biblioteket kunde inte vara enklare att installera heller. Bara ladda ner en kopia lokalt eller dra det direkt använder sig av npm installera wysiwyg.css

Därifrån, du bara inkludera CSS-filen i ditt dokumenthuvud och låt det springa. Det riktar sig bara till innehållet inne i en behållare med klassen .WYSIWYG, så den här klassen ska pakka in vilken behållare du vill ha.

Biblioteket är fortfarande uppdateras halvt ofta, så du kan hitta senaste uppdateringar i huvudsak GitHub repo. Och om du har förslag eller idéer för nya uppdateringar kan du dela med skaparen Jeremy Thomas på hans Twitter-sida @ jgthms.