Add "hook feature" to inject Javascript snippets etc.

[bep]

See

http://stackoverflow.com/questions/33163202/how-to-include-simple-javascript-within-hugo/33186584?noredirect=1#comment54212668_33186584

[siennathesane]

@bep is there a plan to add this functionality into hugo? It would be really nice to be able to be able to put small scripts into a page to load things like charts, plots, boxes, anything client-side rendered.

[KevinGimbel]

@mxplusb A workaround could be to have the scripts in your front matter and render them if needed inside your post / page template.

Front matter:

---
title: "My blog post with charts"
scripts: 
  - "/js/libs/chart.min.js"
---

Template:

{{ range .Page.Params.scripts }}
  <script async src="{{ . }}" type="text/javascript"></script>
{{ end }}

While this is not as powerful as hooks can be it might serve a similar purpose for scripts - and it's certainly better than loading all scripts on all pages if they are not needed.

---

Otherwise, I would love to see hooks! It's a great functionality in systems like WordPress.

[siennathesane]

@KevinGimbel huh, that could be useful!

I tried to load the a script from this metadata:

+++
date = "2017-01-29T22:33:03-08:00"
title = "test 1"
scripts: 
  - "static/sigma.min.js"
+++

But got build errors:

hugo.exe server --buildDrafts
Started building sites ...
Error: Error building site: Errors reading pages: Error:(4, 1): unexpected token for test-1.md
ERROR 2017/01/30 00:09:03 Error parsing page meta data for blog\test-1.md
ERROR 2017/01/30 00:09:03 (4, 1): unexpected token
ERROR 2017/01/30 00:09:03 (4, 1): unexpected token

When I build it with this markdown (including a script):

+++
date = "2017-01-29T22:33:03-08:00"
title = "test 1"
+++

test html:
  <script type="text/javascript">
  document.write("some text here.")
  </script>

It doesn't output some text here. Specifically, I'm not sure why, as blackfriday doesn't actually remove any HTML tags (to my knowledge). However, I was looking at helpers.StripHTML(), and it looks like all HTML tags are stripped. I'm not sure if the tags are stripped before or after blackfriday is parsing them.

I'm brand new to the hugo code base, but I did some research into what it uses for parsing (blackfriday) and how blackfriday works.

I'm wondering if adding a custom bluemonday policy to the blackfriday parsing might be helpful, and then removing the helpers.StripHTML() functionality would be a step in the right direction. Then you could have a parameter list in your config.toml that could customise a bluemonday policy to allow certain tags.

What are your thoughts?

[KevinGimbel]

@mxplusb you are mixing YAML and TOML in your metadata which is not supported. To declare an array in TOML use the following code:

+++
title = "my title"
scripts = [ "/path/to/script.js", "/path/to/script2.js" ]
+++

If you know you will always use one extra script you could also define it as a "standard" parameter instead of an array.

+++
title = "my title"
script = "/path/to/script.js"

and read it like this

{{ if isset .Params "script" }}
<script src="{{ .Params.script }}" type="text/javascript"></script>
{{ end }}

---

As for the bluemonday policies I cannot say much. The decision of adding it, or when to add it, is up to the Maintainers (@bep, @spf13 , @digitalcraftsman, et al).

[siennathesane]

Ah, gotcha, I didn't know it was TOML, thanks! That fixed the build errors, at least. Still not having a lot of luck with the inline script, but maybe one of the maintainers can comment on that.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. The resources of the Hugo team are limited, and so we are asking for your help.
If this is a bug and you can still reproduce this error on the master branch, please reply with all of the information you have about it in order to keep the issue open.
If this is a feature request, and you feel that it is still relevant and valuable, please tell us why.
This issue will automatically be closed in the near future if no further activity occurs. Thank you for all your contributions.

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.