Add javascript library to Octopress posts?

StackOverflow https://stackoverflow.com/questions/10965506

  •  13-06-2021
  •  | 
  •  

Question

For different posts (generated through rake new_post[my_post]), I want to add a javascript function that is to be only included in that post, and nowhere else on the blog.

I can do this by hand-editing the public/my_post/index.html file but then every time I do a rake generate, I will have to do this again.

Is there a built in way to make this happen in Octopress?

Cheers

Was it helpful?

Solution

In 2.1 you will be able to inject per page/post JavaScript or CSS assets into the header by setting some vars in the yaml front matter.

Currently you can simply insert a link or script tag inside of the post or page itself and it will be loaded in place. Example:

<script type="text/javascript" src="/path/to/file.js"></script>
<link rel="stylesheet" type="text/css" href="/path/to/file.css">

OTHER TIPS

Supposing you needed this.js and that.js in a post save them under the newly created /javascripts/custom/ directory.

Than in your default layout add, inside the <head> tag, something like:

{% if page.custom_javascript %}
    {% for js in page.custom_javascript %}
        <script type="text/javascript" src="/javascripts/custom/{{ js }}"></script>    
    {% endfor%}
{% endif %}

Finally you can inject per-post javascript simply adding to the post YAML front-matter the field custom_javascript:

---
layout: post
title: "Insert javascript inside head with Octopress"
custom_javascript: [this.js, that.js]
---

Of course you can use a similar approach for others things you need to inject into the <head>.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top