Compress Your HTML in Jekyll
While this tutorial has content that we believe is of great benefit to our community, we have not yet tested or edited it to ensure you have an error-free learning experience. It's on our list, and we're working on it! You can help us out by using the "report an issue" button at the bottom of the tutorial.
Get started with the plugin in two simple steps:
- Download and extract the plugin’s compress.html file and place it in the _layout folder of your Jekyll setup.
- In your topmost plugin, often default.html, add the following Front Matter:
--- layout: compress ---
Now that the plugin is installed and setup, you can configure its exact behavior in your _config.yml file. For example:
compress_html: clippings: all comments: [""] endings: [html, head, body, li, dt, dd, rt, rp, optgroup, option, colgroup, caption, thead, tbody, tfoot, tr, td, th] profile: false blanklines: false ignore: envs: 
And here’s a quick breakdown of the configuration options:
- clippings: An array of elements around which whitespace will be removed. Use the all keyword to include all the elements that are safe to manipulate. pre will be ignored to preserve whitespace.
- comments: An array with the start and end tags for comments to be removed. Notice the extra spaces, so that comments that don’t have that whitespace will be kept.
- endings: An array of optional end tags, which will be removed. Use the keyword all to remove all of them. In the above example I’m specifying all the optional end tags except for p.
- profile: Turn this flag to true in development mode to see a table added at the end of your page that displays a breakdown for the elements on the page.
- blanklines: Turn this flag to true if you want to collapse only blank lines and keep line breaks intact non-blank lines.
- ignore.envs: An array of Jekyll environment names where the compress layout should be turned off. This can be usefull if you want to turn compression off in development mode.
- startings: An array of optional start tags, which will be removed. For example: startings: [html, head, body]