tannerdolby / eleventy-plugin-metagen

Eleventy shortcode that generates document metadata

Home Page:https://www.npmjs.com/package/eleventy-plugin-metagen

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Add support for CSS & JS related shortcode parameters

tannerdolby opened this issue · comments

Add ability to specify css field which can be a string representing a CSS file which will become <link rel="stylesheet" href="style.css"> or an array of CSS filepaths which will map to a list of <link> elements

Provide an array of CSS filepaths to css and JS filepaths to js:

{% metagen 
    css=["style.css", "foo.css"],
    js=["script.js", ["bar.js", "async"]]
    ...
%}

=>

<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="foo.css">
<script src="script.js"></script>
<script src="bar.js" async></script>

For inline CSS/JS use inline_css or inline_js. Provide strings as input which will represent the content for inline styles or js scripts.

{% metagen 
    inline_css="h1 { color: #f06; }",
    inline_js="console.log('hello world');"
    ...
%}

=>

<style>h1 { color: #f06; }</style>
<script>console.log('hello world');</script>