19

I'd like to include some Web Audio API HTML5 code into a Jekyll post. Here's a clone of the HTML page + Javascript code that I'd like to include:

view-source:http://www.smartjava.org/examples/webaudio/example3.html

How should this be achieved?

Goren Berdichevsky
  • 417
  • 4
  • 8

2 Answers2

18

Actually, if you are using markdown to create your posts, you can use Liquid's include tag.

You just have to create a folder with the name _includes/ in the DocumentRoot of your project, then, create an HTML file inside, for example "mycomponent.html" and call it in your post with something like this:

{% include mycomponent.html %}

This file can have any HTML/CSS/JS you want.

Notice how you include just your HTML file; the external CSS/JS can be included in the layout that you're using.

fureigh
  • 113
  • 2
  • 5
kmil0v
  • 222
  • 2
  • 4
  • I don't think you can use `{% include foo.html %}` within a content of a post or a page. I've tried that it didn't work, and Jekyll's doc says it shouldn't work, either. – Teng L May 15 '20 at 03:11
  • @TengL just tested it and it worked. Within a markdown post (file extensioned with .md), within the content of the post I included the `{% include mytest.html %}` and the post correctly included and rendered the HTML. @kmil0v's answer gets an upvote from me! – ZAR Aug 25 '20 at 17:13
  • Does not work in posts; using this still renders as plaintext – Cade Brown Sep 06 '22 at 01:51
-4

You can simply write HTML code and it'd work. Learn more here

M. Inam
  • 301
  • 3
  • 7
  • please update your answer to include guidance on how to solve the problem and not just a link to an external resource. try to provide a bit of a summary/description at least – kimcodes Oct 26 '20 at 12:26