### Configure pymdownx.arithmatex for Generic MathJax Source: https://facelessuser.github.io/MarkdownPreview/extras Configure the `pymdownx.arithmatex` extension with `generic: true` to enable generalized math notation processing. This setup is compatible with MathJax and potentially other libraries like KaTeX. ```python "markdown_extensions": [ { "pymdownx.arithmatex": { "generic": true, }, } ] ``` -------------------------------- ### Configure Python Markdown Extension Options Source: https://facelessuser.github.io/MarkdownPreview/usage Configure a specific Python Markdown extension by making its entry a dictionary. This example shows how to enable the permalink feature for the Table of Contents (TOC) extension. ```json "markdown_extensions": [ { "markdown.extensions.toc": { "permalink": true } } ] ``` -------------------------------- ### Set Pygments Highlight Theme Source: https://facelessuser.github.io/MarkdownPreview/usage Customize the code highlighting theme by setting the 'pygments_style' option within the 'pymdownx.highlight' extension. 'emacs' is an example theme. ```json "markdown_extensions": [ "pymdownx.highlight": { "pygments_style": "emacs" } ] ``` -------------------------------- ### Configure Python Markdown Extension with Custom Function Source: https://facelessuser.github.io/MarkdownPreview/usage Configure a Python Markdown extension to use a custom function by specifying the function's import path within an object keyed by `!!python/name`. This example replaces the default slugify function for the TOC extension with one from PyMdown Extensions. ```json "markdown_extensions": [ { "markdown.extensions.toc": { "slugify": {"!!python/name": "pymdownx.slugs.uslugify"} } } ] ``` -------------------------------- ### Configure KaTeX JavaScript for Markdown Preview Source: https://facelessuser.github.io/MarkdownPreview/extras Include the KaTeX library and the extension's configuration script to enable KaTeX rendering. This script scans for math notation and converts it. ```json "js": { "markdown": [ "https://cdn.jsdelivr.net/npm/katex@0.10.0-alpha/dist/katex.min.js", "res://MarkdownPreview/js/katex_config.js" ] }, ``` -------------------------------- ### Configure KaTeX JavaScript Libraries Source: https://facelessuser.github.io/MarkdownPreview/extras?q= Include KaTeX and its configuration script to render mathematical notation. Ensure these are added to your JavaScript list. ```json "js": { "markdown": [ "https://cdn.jsdelivr.net/npm/katex@0.10.0-alpha/dist/katex.min.js", "res://MarkdownPreview/js/katex_config.js" ] }, ``` -------------------------------- ### Configure KaTeX CSS for Markdown Preview Source: https://facelessuser.github.io/MarkdownPreview/extras Provide the KaTeX CSS file and optionally include CSS for equation numbering. The 'default' CSS is also included here. ```json "css": { "markdown": [ "default", // <- The default Markdown CSS. "https://cdn.jsdelivr.net/npm/katex@0.10.0-alpha/dist/katex.min.css", // <- KaTeX CSS "res://MarkdownPreview/css/katex_eqnum.css" // <- Optional equation numbering CSS ] }, ``` -------------------------------- ### Configure Build Action Source: https://facelessuser.github.io/MarkdownPreview/usage Set the 'build_action' to control how Markdown files are processed. Options include 'build', 'browser', 'clipboard', 'sublime', and 'save'. ```json /* By default, Markdown Preview builds the HTML in the source directory. It expects the file to exist on disk. It pops up the build output panel etc. If you wish to override this behavior, you can change "build_action" build - The default build behavior. browser - Preview the file in your browser. clipboard - Copy the HTML output to the clipboard. sublime - Export the HTML to a Sublime tab. save - Run the normal save command that outputs to the source directory. It will also prompt for "save as" if the file does not exit on disk. All the build options use the default parser defined above in "parser" */ "build_action": "build", ``` -------------------------------- ### Configure Python Markdown Extensions Source: https://facelessuser.github.io/MarkdownPreview/usage Configure Markdown Preview with Python Markdown extensions by specifying their import paths in the `markdown_extensions` setting. All extensions must be specified in this format. ```json "markdown_extensions": [ "markdown.extensions.toc" ] ``` -------------------------------- ### Configure KaTeX CSS Files Source: https://facelessuser.github.io/MarkdownPreview/extras?q= Add the KaTeX CSS file and optionally the equation numbering CSS to your stylesheet configuration. The 'default' CSS is also included. ```json "css": { "markdown": [ "default", "https://cdn.jsdelivr.net/npm/katex@0.10.0-alpha/dist/katex.min.css", "res://MarkdownPreview/css/katex_eqnum.css" ] }, ``` -------------------------------- ### Configure File Path Conversions Source: https://facelessuser.github.io/MarkdownPreview/usage Manage how file paths are handled in the preview with the 'file_path_conversions' setting. Options are 'absolute', 'relative', or 'none'. ```javascript /* Sets how file paths are handled. Setting is a string value: (absolute | relative | none) absolute: converts relative local paths to absolute relative: converts relative local paths to a path relative to the HTML output none: does nothing */ "file_path_conversions": "absolute", ``` -------------------------------- ### Configure CriticMarkup Handling Source: https://facelessuser.github.io/MarkdownPreview/usage Set how CriticMarkup syntax is handled. Options include 'accept', 'reject', or 'none'. This setting primarily affects 'github' and 'markdown' parsers. ```json /* Sets how multimarkdown critic marks are handled. Setting is a string value: (accept | reject | none) accept: Accepts the proposed inserts and deletions (comments etc. are discarded) reject: Rejects the proposed inserts and deletions (comments etc. are discarded) none: does nothing Critic marks only affects "github" and "markdown" (Python Markdown). */ "strip_critic_marks": "none", ``` -------------------------------- ### Configure Mermaid Libraries Source: https://facelessuser.github.io/MarkdownPreview/extras Add these JavaScript libraries to your configuration to enable Mermaid UML rendering. Ensure the user configuration is loaded before the Mermaid loader. ```json "js": [ // Mermaid library "https://unpkg.com/mermaid@8.8.4/dist/mermaid.min.js", // User configuration, should be loaded before the loader "res://MarkdownPreview/js/mermaid_config.js", // Mermaid loader "res://MarkdownPreview/js/mermaid.js" ] ``` -------------------------------- ### Configure Theme for Light/Dark Mode Source: https://facelessuser.github.io/MarkdownPreview/usage Set the 'theme' option to control light/dark mode behavior. Options include 'dark', 'light', and 'auto' for system-based selection. ```json /* Preference for dark/light mode. Available options are: "dark", "light", and "auto". */ "theme": "auto", ``` -------------------------------- ### Include MathJax and Math Config JS Source: https://facelessuser.github.io/MarkdownPreview/extras?q= Include the MathJax library and the provided math configuration script to enable MathJax support. You can reference your own custom configuration file if needed. ```json "js": { "markdown": [ "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js", "res://MarkdownPreview/js/math_config.js" ] ) ``` -------------------------------- ### Include MathJax and Math Config JS Source: https://facelessuser.github.io/MarkdownPreview/extras Include the MathJax library and the extension's math configuration file to enable MathJax support. You can provide your own custom configuration file if needed. ```json "js": { "markdown": [ "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js", "res://MarkdownPreview/js/math_config.js" ] } ``` -------------------------------- ### Bind Shortcut to Select Parser for Target Source: https://facelessuser.github.io/MarkdownPreview/usage This keybinding opens a quick panel to select an enabled parser for a specified target, like previewing in the browser. ```json { "keys": ["alt+m"], "command": "markdown_preview_select", "args": {"target": "browser"} } ``` -------------------------------- ### Configure Mermaid JS Libraries Source: https://facelessuser.github.io/MarkdownPreview/extras?q= Include these JavaScript libraries in your configuration to enable Mermaid UML rendering. Ensure the user configuration is loaded before the Mermaid loader. ```json "js": [ // Mermaid library "https://unpkg.com/mermaid@8.8.4/dist/mermaid.min.js", // User configuration, should be loaded before the loader "res://MarkdownPreview/js/mermaid_config.js", // Mermaid loader "res://MarkdownPreview/js/mermaid.js" ] ``` -------------------------------- ### Configure Custom HTML Template Source: https://facelessuser.github.io/MarkdownPreview/usage?q= Specify a custom HTML template file for rendering markdown. This allows for full control over the output's structure and styling. Ensure the template includes placeholders like {{ HEAD }}, {{ BODY }}, and {{ THEME }}. ```json /* Specify a HTML template file to render your markdown within. Available place holders in HTML template: {{ HEAD }} - would be replaced by generated stylesheets, javascripts enabled above {{ BODY }} - would be replaced by HTML converted from markdown {{ THEME }} - specifiies preferred theme ` By setting "skip_default_stylesheet" to true you can use the styles only in your HTML template. In most cases you should turn this setting on to have a full-featured design. Refer to 'customized-template-sample.html' as a show case. */ "html_template": "/ABS_PATH_TO_A_HTML_FILE", ``` -------------------------------- ### Configure File Type Specific CSS Overrides Source: https://facelessuser.github.io/MarkdownPreview/usage Enable CSS overrides for specific file types. CSS files in the same directory as a markdown file, matching the configured file types, will be appended. ```json "css": { "markdown": ["default"], } // File must be of one type below "markdown_filetypes": [".md", ".markdown", ".mdown"], ``` ```json "allow_css_overrides": true, ``` -------------------------------- ### Configure Image Path Conversion Source: https://facelessuser.github.io/MarkdownPreview/usage Control how image paths are handled in the generated preview using the 'image_path_conversion' setting. Options include 'absolute', 'relative', 'base64', or 'none'. ```javascript /* Sets how image paths are handled. Setting is a string value: (absolute | relative | base64 | none) absolute: converts relative local paths to absolute relative: converts relative local paths to a path relative to the HTML output base64: coverts the local file to base64 and embeds it in the HTML none: does nothing */ "image_path_conversion": "absolute", ``` -------------------------------- ### Configure PyMdownx Arithmatex for Generic KaTeX Source: https://facelessuser.github.io/MarkdownPreview/extras Enable generic mode for PyMdownx Arithmatex to work with KaTeX. This allows for generalized math notation handling. ```json "markdown_extensions": [ { "pymdownx.arithmatex": { "generic": true, }, } ] ``` -------------------------------- ### Enable Simple HTML Output Source: https://facelessuser.github.io/MarkdownPreview/usage Use the `html_simple` option to generate a stripped-down HTML output. This mode omits HTML headers, inline styles, and IDs, providing only the bare minimum HTML tags and attributes. It also includes extension modifications. ```json /* Sets HTML output to a simple form: - No head - No body tags - ids, classes, and style are stripped out - Just bare minimum HTML tags and attributes - extension modifications included */ "html_simple": false, ``` -------------------------------- ### Inline CSS for Highlighting Source: https://facelessuser.github.io/MarkdownPreview/usage To inline CSS directly into HTML tags using the 'pymdownx.highlight' extension, set 'noclasses' to true. This is useful when 'pygments_style' is also configured. ```json "markdown_extensions": [ "pymdownx.highlight": { "noclasses": true } ] ``` -------------------------------- ### Configure Default CSS Inclusion Source: https://facelessuser.github.io/MarkdownPreview/usage Specify which CSS files to include for different parsers. The 'default' keyword includes the default CSS provided by Markdown Preview. ```json "css": { "markdown": ["default"], "github": ["default"], "gitlab": ["default"] }, ``` -------------------------------- ### Configure GitLab Markdown Parser Mode Source: https://facelessuser.github.io/MarkdownPreview/usage Set the GitLab mode for parsing Markdown. Use 'gfm' for tasklists and other GitHub Flavored Markdown features, or 'markdown' for standard Markdown documents. ```json /* Default mode for the gitlab Markdown parser : markdown (documents) or gfm (comments) see https://docs.gitlab.com/ee/api/markdown.html#render-an-arbitrary-markdown-document */ "gitlab_mode": "markdown", ``` -------------------------------- ### Include JavaScript Libraries for UML Diagram Generation Source: https://facelessuser.github.io/MarkdownPreview/extras Load necessary JavaScript libraries for rendering UML diagrams from 'sequence' and 'flow' code blocks. This includes Raphael, Underscore, js-sequence-diagrams, and flowchart.js. ```json "js": [ // Required libraries to transform UML notation "https://cdnjs.cloudflare.com/ajax/libs/raphael/2.2.7/raphael.min.js", "https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js", "https://cdnjs.cloudflare.com/ajax/libs/js-sequence-diagrams/1.0.6/sequence-diagram-min.js", "https://cdnjs.cloudflare.com/ajax/libs/flowchart/1.6.5/flowchart.min.js", // This library applies the above libraries to the fenced code blocks `flow` and `sequence`. "res://MarkdownPreview/js/uml.js" ] ``` -------------------------------- ### Enable External Markdown Parsers Source: https://facelessuser.github.io/MarkdownPreview/usage Enable the use of previously mapped external markdown parsers by listing their names in `enabled_parsers`. ```json "enabled_parsers": ["markdown", "github", "gitlab", "multimarkdown"], ``` -------------------------------- ### Configure GitHub Flavored Markdown Mode Source: https://facelessuser.github.io/MarkdownPreview/usage Set `github_mode` to `gfm` for parsing GitHub Flavored Markdown, which is necessary for features like tasklists. The default is `markdown`. ```json /* Default mode for the github Markdown parser : markdown (documents) or gfm (comments) see http://developer.github.com/v3/markdown/#render-an-arbitrary-markdown-document */ "github_mode": "markdown", ``` -------------------------------- ### Configure Default JavaScript Inclusion Source: https://facelessuser.github.io/MarkdownPreview/usage Specify which JavaScript files to include for different parsers. The 'default' keyword includes the default JavaScript provided by Markdown Preview. ```json "js": { "markdown": ["default"], "github": ["default"], "gitlab": ["default"] }, ``` -------------------------------- ### Configure YAML Frontmatter References and Destination Source: https://facelessuser.github.io/MarkdownPreview/usage Define `references` and `destination` within YAML frontmatter for managing external markdown files and output HTML paths. Relative paths are resolved against the source file's directory or the `basepath` setting. ```yaml --- # Builtin values references: - references.md - abbreviations.md - footnotes.md destination: destination.html # Meta Data title: Test Page author: - John Doe - Jane Doe # Settings overrides settings: markdown_extensions: - markdown.extensions.footnotes - markdown.extensions.attr_list - markdown.extensions.def_list - markdown.extensions.tables - markdown.extensions.abbr - markdown.extensions.toc - markdown.extensions.smarty - markdown.extensions.meta - markdown.extensions.wikilinks - markdown.extensions.admonition - markdown.extensions.md_in_html - pymdownx.highlight: pygments_style: github - pymdownx.progressbar - pymdownx.github - pymdownx.caret: superscript: false --- ``` -------------------------------- ### Control Build Panel Visibility Source: https://facelessuser.github.io/MarkdownPreview/usage Disable the build output panel by setting 'show_panel_on_build' to 'false'. This option controls whether the panel appears when using the build command. ```json /* do we show the panel when building with CMD+B */ "show_panel_on_build": true, ``` -------------------------------- ### Enable Line Numbers for Highlighting Source: https://facelessuser.github.io/MarkdownPreview/usage Add line numbers to code blocks when using the 'pymdownx.highlight' extension by setting 'linenums' to true. ```json "markdown_extensions": [ "pymdownx.highlight": { "linenums": true } ] ``` -------------------------------- ### Configure GitLab Personal Access Token Source: https://facelessuser.github.io/MarkdownPreview/usage Provide a personal access token for authenticating with the GitLab API. Ensure this token is kept secret and has minimal scopes for security. ```json /* Uses a personal token when parsing markdown with GitLab API. To create one for Markdown Preview, see https://docs.gitlab.com/ee/user/profile/personal_access_tokens.html. Warn: this secret *must not be shared* with anyone and at least you should create it with minimal scopes for security reasons. */ "gitlab_personal_token": "secret", ``` -------------------------------- ### Map External Markdown Parsers Source: https://facelessuser.github.io/MarkdownPreview/usage Map external markdown parser commands and arguments to a name. Each binary value must be an array with the path to the binary first, followed by flags and options as individual indexes. ```json "markdown_binary_map": { "multimarkdown": ["/usr/local/bin/multimarkdown", "--some-option", "some-value"] }, ``` -------------------------------- ### Include JavaScript Libraries for UML Diagrams Source: https://facelessuser.github.io/MarkdownPreview/extras?q= Add these JavaScript libraries to enable the transformation of `sequence` and `flow` code blocks into UML diagrams using js-sequence-diagrams and flowchart.js. ```javascript "js": [ // Required libraries to transform UML notation "https://cdnjs.cloudflare.com/ajax/libs/raphael/2.2.7/raphael.min.js", "https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js", "https://cdnjs.cloudflare.com/ajax/libs/js-sequence-diagrams/1.0.6/sequence-diagram-min.js", "https://cdnjs.cloudflare.com/ajax/libs/flowchart/1.6.5/flowchart.min.js", // This library applies the above libraries to the fenced code blocks `flow` and `sequence`. "res://MarkdownPreview/js/uml.js" ] ``` -------------------------------- ### PyYaml Format for Custom Function Source: https://facelessuser.github.io/MarkdownPreview/usage Illustrates the PyYaml format for specifying a custom function, which is similar to the syntax used for configuring Python Markdown extensions with functions. ```yaml markdown_extensions: - markdown.extensions.toc: slugify: !!python/name:pymdownx.slugs.uslugify ``` -------------------------------- ### Enable Auto-Reload on Save Source: https://facelessuser.github.io/MarkdownPreview/usage Enable the 'enable_autoreload' setting to automatically refresh the preview when you save your markdown file. This feature may not work with GitHub or GitLab parsers without an OAuth key. ```javascript /* Enable auto-reloaded on save. Will not work if GitHub parser or GitLab parser is used without oauth key specified. */ "enable_autoreload": true, ``` -------------------------------- ### Set GitHub API OAuth Token Source: https://facelessuser.github.io/MarkdownPreview/usage Provide a `github_oauth_token` to authenticate with the GitHub API for markdown parsing. This is recommended to avoid rate limiting when making frequent API calls. ```json /* Uses an OAuth token when parsing markdown with GitHub API. To create one for Markdown Preview, see https://help.github.com/articles/creating-an-oauth-token-for-command-line-use. Warn: this secret *must not be shared* with anyone and at least you should create it with minimal scopes for security reasons. */ "github_oauth_token": "secret", ``` -------------------------------- ### Configure HTML Head Inclusion Source: https://facelessuser.github.io/MarkdownPreview/usage Control whether the HTML head, including CSS and JavaScript, is included in the output. This setting applies to specific actions like 'build', 'browser', etc. ```json /* do we include the CSS when outputting HTML? */ "include_head": ["build", "browser", "sublime", "clipboard", "save"] ``` -------------------------------- ### Set Pygments CSS Class Source: https://facelessuser.github.io/MarkdownPreview/usage?q= Specify the CSS class to prepend to Pygments CSS styles. This should match the class used in the extension that controls Pygments highlighting. ```json /* This is the class to prepend to the pygments CSS styles. Make sure it matches whatever class(es) you've specified in the extension that controls Pygments highlighting. CodeHilite's default is "codehilite", while Highlight's (the extension that SuperFences uses) is "highlight". */ "pygments_css_class": "highlight", ``` -------------------------------- ### Enable GitHub Header ID Injection Source: https://facelessuser.github.io/MarkdownPreview/usage Set `github_inject_header_ids` to `true` to enable post-processing that injects IDs into headers. This ensures that CSS-generated clickable anchors work correctly when `github_mode` is `markdown`. ```json /* Enables a post process to inject header ids to ensure hrefs to headers work */ "github_inject_header_ids": true, ``` -------------------------------- ### Control Pygments CSS Injection Source: https://facelessuser.github.io/MarkdownPreview/usage Manage Pygments CSS injection with 'pygments_inject_css'. Set to 'true' to inject Pygments styles into the HTML. Also configure the style name and CSS class. ```json /* If Pygments is being used, you may want to inject one of the Pygment styles provided into the HTML. If so, enable this. */ "pygments_inject_css": true, /* Name of the Pygments style to inject. Available styles are those provided by Pygments plus "github", "github2014", "github_dynamic". */ "pygments_style": "github_dynamic", /* This is the class to prepend to the pygments CSS styles. Make sure it matches whatever class(es) you've specified in the extension that controls Pygments highlighting. CodeHilite's default is "codehilite", while Highlight's (the extension that SuperFences uses) is "highlight". */ "pygments_css_class": "highlight", ``` -------------------------------- ### Set Pygments Style Name Source: https://facelessuser.github.io/MarkdownPreview/usage?q= Define the name of the Pygments style to be injected. Available options include standard Pygments styles and specific GitHub-related styles. ```json /* Name of the Pygments style to inject. Available styles are those provided by Pygments plus "github", "github2014", "github_dynamic". */ "pygments_style": "github_dynamic", ``` -------------------------------- ### Strip YAML Frontmatter Source: https://facelessuser.github.io/MarkdownPreview/usage Set `strip_yaml_front_matter` to `true` to remove YAML frontmatter from markdown files. This option handles frontmatter similarly to meta data, with YAML keys overriding `meta` extension keys. ```json /* Strips the YAML front matter header and converts title to a heading */ "strip_yaml_front_matter": false, ``` -------------------------------- ### Control Pygments CSS Injection Source: https://facelessuser.github.io/MarkdownPreview/usage?q= Enable or disable the injection of Pygments styles into the HTML output. This setting is useful when controlling how Pygments styles are applied. ```json /* If Pygments is being used, you may want to inject one of the Pygment styles provided into the HTML. If so, enable this. */ "pygments_inject_css": true, ``` === COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.