Starting to decommission this project in favor of Liquid Language Support by panoply, it has a lot of great features.

syntax package for Visual Studio Code.

Inspired by jekyll-atom

So this plugin was inspired by @Arcath's Atom plugin. So the roadmap will be to add the same "grammars" available for Atom inside of Visual Studio Code.

Forked from vscode-liquid

I'm using this as a basis to add Jekyll specific syntax highlighting support - for those curious as to why a new plugin... well that's because I plan on adding more that just front-matter support.

Using Emmet

If you want to use Emmet with Jekyll (HTML) you'll need to add the below to your users settings or workspace settings (the scss part is optional):

  "emmet.includeLanguages":{
    "jekyll": "html",
    "scss": "css"
  }

Theme support

Front-Matter support in VSCode color schemes is limited, currently, but hopefully that changes over time. You can check out the two VSCode color themes/schemes below to see the improvements: With the edition of the include source.yaml color scheme/theme support is pretty universal.

• Better Solarized Dark
  • VSCode Marketplace
  • Repo
• One Dark Rain Coat
  • VSCode Marketplace
  • Repo

If you'd like to add support to your color scheme add the following to your color schemes .json file

    {
      "name": "Jekyll Tags Front Matter",
      "scope": [
        "punctuation.output.jekyll",
        "punctuation.tag.jekyll",
        "frontmatter.jekyll"
      ],
      "settings": {
        "foreground": "#SOME_COLOR_YOU_LINK"
      }
    },

OR

    {
      "name": "Jekyll Tags",
      "scope": [
        "punctuation.output.jekyll",
        "punctuation.tag.jekyll"
      ],
      "settings": {
        "foreground": "#SOME_COLOR_YOU_LINK"
      }
    },
    {
      "name": "Jekyll Front Matter",
      "scope": [
        "frontmatter.jekyll"
      ],
      "settings": {
        "foreground": "#SOME_COLOR_YOU_LINK"
      }
    },

TODO:

• add pictures
• add Jekyll JSON
• add Jekyll XML