Comment ajouter des styles au contenu de TinyMCE & Markdown
Beaucoup d'écrivains préfèrent travailler à Markdown parce que c'est un langage plus simple avec moins d'obstacles à franchir. Certes, il est loin d’être parfait, mais il offre un vue plus propre de votre texte avec la facilité de exporter en HTML.
Malheureusement, les styles par défaut de Markdown sont généralement assez ennuyeux. Mais avec le bibliothèque wysiwyg.css, vous pouvez avoir un document dynamique en un rien de temps.
Cette bibliothèque CSS gratuite transforme tout votre contenu de base TinyMCE ou Markdown en des blocs HTML formatés et faciles à lire.
Vous n'avez pas besoin de connaître le code HTML / CSS complexe pour utiliser ce plugin. Simplement envelopper le contenu généré dans une div avec la classe .Wysiwyg, et vous êtes tous ensemble.
La vraie difficulté est de créer une application qui automatiserait ce processus ou d’ajouter cette bibliothèque au backend pour un panneau d’administrateur..
Cependant, les possibilités sont infinies, et vous pourriez même utiliser cette pour l'écriture locale si vous préférez exporter votre contenu de Markdown à HTML.
Par défaut, cette bibliothèque CSS a support pour chaque balise HTML majeure imaginable. Cela inclut tous les en-têtes, listes, liens, balises de pré / code, chiffres et même des balises semi-obscures comme et . Il y a un liste complète dans le dépôt GitHub si vous voulez vérifier.
Si vous définissez vos propres styles typographiques, ceux-ci peuvent même réécrire les paramètres par défaut dans la feuille de style. Ainsi, vous pouvez obtenir tous les avantages de wysiwyg.css mélangé avec vos propres choix de polices.
La bibliothèque ne pourrait pas être plus facile à installer non plus. Juste télécharger une copie localement ou tire-le directement en utilisant npm installer wysiwyg.css
De là, vous venez inclure le fichier CSS dans votre tête de document et laissez-le fonctionner. Il ne fait que cibler le contenu à l'intérieur d'un conteneur avec la classe .Wysiwyg, donc cette classe devrait envelopper tout le conteneur que vous voulez.
La bibliothèque est toujours en cours mis à jour semi-fréquemment, afin que vous puissiez trouver les dernières mises à jour dans le dépôt principal GitHub. Et si vous avez des suggestions ou des idées de nouvelles mises à jour, n'hésitez pas à les partager avec le créateur Jeremy Thomas sur sa page Twitter @jgthms..
