How do I embed JavaScript in Jekyll?

I have a site hosted on GitHub pages, using Jekyll and Markdown code.

It seems like Jekyll doesn’t render any code that’s not in Markdown properly. I have custom JavaScript code to embed that’s supposed to allow users to make donations to my Stripe payment account. The JavaScript code is directly from Stripe, with HTML tags and everything. But Jekyll renders the code by printing most of it. I suppose because it’s not in Markdown code.

Help! Please!

HTML is allowed in Markdown you just need to be careful with the indents and/or remove them as they can be misinterpreted.

So if there are zero indents in the HTML/JavaScript code, it’ll be fine?

Yes, that’s my experience.
Indenting tells Markdown to convert into a code block, which is probably why it’s getting mangled for you.

1 Like

You can have indented html tags in a markdown file and it won’t get converted to plain text.

Just avoid empty lines. You can add them in a certain way but start with no empty lines.

Use .md or .html extension. Both work fine for html tags

Here is one of my pages with html and JS in markdown.

It looks funny if you view it as markdown on github but it’s fine in an IDE or rendering as a page. You can click the raw button to see how it looks

Excellent! Thank you.

Unless it’s a one-off for a single page, I would include the snippet in the post’s/page’s template. If the snippet should be included on some pages, you can use a custom front matter variable to enable/disable the snippet. Alternatively, you could create an include with the snippet and include it in your markdown files where you need it.