search

sparksuite / simplemde-markdown-editor

A simple, beautiful, and embeddable JavaScript Markdown editor. Delightful editing for beginners and experts alike. Features built-in autosaving and spell checking.
https://simplemde.com
MIT License
9.79k stars 1.12k forks source link

Syntax highlighting, theme and autocomplete #824

Open thefubon opened 2 years ago

thefubon commented 2 years ago

Please tell me how to add these: syntax highlighting, theme and autocomplete. Here is my code:

<link rel="stylesheet" href="//cdn.jsdelivr.net/simplemde/latest/simplemde.min.css">
<script src="//cdn.jsdelivr.net/simplemde/latest/simplemde.min.js"></script>

<textarea id="MyID" name="content"><?= @$data['content'] ?></textarea>

// SimpleMDE Config
var simplemde = new SimpleMDE({
  element: document.getElementById("MyID"),
  //autofocus: true,
  //lineWrapping: false,
  placeholder: "Type here...",
  renderingConfig: {
      singleLineBreaks: false,
      codeSyntaxHighlighting: true,
  },
  toolbar: ["preview", "side-by-side", "fullscreen"],
});

How do I add my own styles and scripts inside the editor so that it doesn't affect global styles? Example:

var simplemde = new SimpleMDE({
  css: https://cdn.jsdelivr.net/npm/uikit@3.9.4/dist/css/uikit.min.css
  js: https://cdn.jsdelivr.net/npm/uikit@3.9.4/dist/js/uikit.min.js
});