Skip to main content

Markdown Widget

Found in the Elementor panel under Dotjuice → Markdown.

How it works​

The widget fetches the Markdown file you specify directly in the visitor's browser and converts it to HTML on the fly. Because the fetch happens in the browser, the source file needs to allow cross-origin requests — raw file URLs from GitHub (raw.githubusercontent.com) work well; a URL that isn't set up to allow this will fail to load, with a note in the browser's developer console.

Content settings​

SettingWhat it does
Markdown File URLThe direct URL to the raw Markdown file (not a formatted preview page — for GitHub, use the "Raw" file link, not the normal file view).

Styling​

SettingWhat it does
Text ColorSets the base text color for the rendered content.

The Markdown is converted to plain semantic HTML (headings, paragraphs, lists, code blocks, links) with no additional classes — headings, code blocks, and other elements will take on whatever styling your theme already applies to those standard HTML tags. If you want the rendered Markdown to look a specific way, style it through your theme's typography settings for headings, lists, and <pre>/<code> blocks, since this widget doesn't apply its own detailed formatting beyond the base text color.

Good to know​

  • Use the raw file URL, not a formatted view. For a GitHub file, click "Raw" on the file page and use that URL — the normal GitHub file-viewer page returns an HTML page, not the Markdown source, and won't render correctly.
  • The content loads via JavaScript after the page loads, so it won't appear in "view source" — this is expected and doesn't affect what visitors see.
  • If nothing appears, check your browser's developer console: the two most common causes are an incorrect URL (view page instead of raw file) or the source not allowing cross-origin requests from your domain.