Как да добавяте стилове към съдържанието на TinyMCE & Markdown

Много автори предпочитат работи в Markdown защото това е по-прост език с по-малко препятствия за изкачване. Разбира се, че е далеч от съвършенство, но предлага по-чист изглед на текста с лекотата на експортиране в HTML.

За съжаление, стандартните стилове по подразбиране обикновено са доста скучни. Но с библиотека wysiwyg.css, можеш има един жив документ за нула време.

Тази безплатна CSS библиотека трансформира всичките ви основни TinyMCE или Markdown съдържание в форматирани, лесни за четене блокове на HTML.

Не е нужно да знаете сложен HTML / CSS, за да използвате този плъгин. просто опаковане на генерираното съдържание в div с класа .WYSIWYG, и сте готови.

Истинската трудност е изграждането на приложение, което би автоматизирало този процес или добавяне на тази библиотека към бекенда за потребителски административен панел.

Възможностите обаче са безкрайни и дори можете да го използвате за местно писане ако предпочитате да експортирате съдържанието си от Markdown към HTML.

По подразбиране тази библиотека на CSS има поддръжка за всеки основен HTML етикет можете да си представите. Това включва всички заглавия, списъци, връзки, предварително / кодови маркери, цифри и дори полу-неясни маркери и . Има пълен списък в репо GitHub, ако искате да го проверите.

Ако дефинирате собствените си типографски стилове, те могат дори пренапишете настройките по подразбиране в таблицата със стилове. Така че можете да получите всички предимства на wysiwyg.css смесени с вашия собствен избор на шрифт.

Библиотеката също не може да бъде по-лесна за настройка. Просто изтеглете копие локално или дръпнете го директно използвайки npm install wysiwyg.css

От там, ти просто включете CSS файла в главата на документа и го пуснете. Ще се насочи само към съдържанието вътре в контейнера с класа .WYSIWYG, така че този клас трябва да обгръща какъвто и да е контейнер, който искате.

Библиотеката все още е се актуализира полу-често, значи можеш намерете последните актуализации в основния репо GitHub. И ако имате предложения или идеи за нови актуализации, можете да споделите с създателя Джереми Томас в неговата страница в Twitter @jgthms.