# JavaScript on page

**URL:** <https://discourse.gohugo.io/t/javascript-on-page/4166>\
**Category:** support\
**Created:** [September 25, 2016, 8:45pm UTC](https://discourse.gohugo.io/t/javascript-on-page/4166 "2016-09-25T20:45:58Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![flashpixx](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/flashpixx/32/1795_2.png) [@flashpixx](https://discourse.gohugo.io/u/flashpixx)\
**Post date:** [September 25, 2016, 8:45pm UTC](https://discourse.gohugo.io/t/javascript-on-page/4166/1 "2016-09-25T20:45:58Z")

</div>

Hello,

I’m creating a complex website and I’m using in general jQuery. On some pages (markdown files) I would like to add a document.ready function . How can I put some JavaScript code inside the markdown file?  
My first idea is to create a page property, which is put inside the header if it is set. But is there any buildin functionality to put _page specialized JavaScript code to a page_?

Thx

---

<div class="post-metadata">

**Author:** ![rdwatters](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/rdwatters/32/2848_2.png) [@rdwatters](https://discourse.gohugo.io/u/rdwatters)\
**Post date:** [September 25, 2016, 9:00pm UTC](https://discourse.gohugo.io/t/javascript-on-page/4166/2 "2016-09-25T21:00:35Z")

</div>

@flashpixx

[https://discuss.gohugo.io/t/javascript-in-blogpost-but-not-on-all-sites-at-the-same-time/3978/7](https://discuss.gohugo.io/t/javascript-in-blogpost-but-not-on-all-sites-at-the-same-time/3978/7)

---

<div class="post-metadata">

**Author:** ![flashpixx](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/flashpixx/32/1795_2.png) [@flashpixx](https://discourse.gohugo.io/u/flashpixx)\
**Post date:** [September 25, 2016, 9:08pm UTC](https://discourse.gohugo.io/t/javascript-on-page/4166/3 "2016-09-25T21:08:38Z")

</div>

Thanks for that, but I understand it in this case, that I can define a JavaScript file and include it by a block structure, but in my case I would like to add “inline JavaScript code”.

---

<div class="post-metadata">

**Author:** ![digitalcraftsman](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/digitalcraftsman/32/4142_2.png) [@digitalcraftsman](https://discourse.gohugo.io/u/digitalcraftsman)\
**Post date:** [September 25, 2016, 9:12pm UTC](https://discourse.gohugo.io/t/javascript-on-page/4166/4 "2016-09-25T21:12:51Z")

</div>

You can include regular HTML in you Markdown files. So a `<script>` tag should work. Maybe it can happen that Go templates escape them for security reasons (unless Hugo trusts the user and marks it as safe by default).

---

<div class="post-metadata">

**Author:** ![rdwatters](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/rdwatters/32/2848_2.png) [@rdwatters](https://discourse.gohugo.io/u/rdwatters)\
**Post date:** [September 26, 2016, 2:50am UTC](https://discourse.gohugo.io/t/javascript-on-page/4166/5 "2016-09-26T02:50:35Z")

</div>

@flashpixx

[https://gohugo.io/templates/functions#safejs](https://gohugo.io/templates/functions#safejs)

---

<div class="post-metadata">

**Author:** ![flashpixx](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/flashpixx/32/1795_2.png) [@flashpixx](https://discourse.gohugo.io/u/flashpixx)\
**Post date:** [September 26, 2016, 6:58am UTC](https://discourse.gohugo.io/t/javascript-on-page/4166/6 "2016-09-26T06:58:56Z")

</div>

Yes the problem are the quotes. I have got this code e.g.

```
<script>
$(document).ready(function() {
     $("#animatefsm").click( {
	console.log("foo");
 } );
}
</script>

```

And the double-quotes within the jQuery call are escaped. How can I avoid the escaping within the markdown file of this block?

Thanks

---

<div class="post-metadata">

**Author:** ![Luca\_G\_Soave](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/luca_g_soave/32/73_2.png) [@Luca\_G\_Soave](https://discourse.gohugo.io/u/Luca_G_Soave)\
**Post date:** [December 29, 2016, 11:36am UTC](https://discourse.gohugo.io/t/javascript-on-page/4166/7 "2016-12-29T11:36:26Z")

</div>

… just an idea, … not sure/didn’t try - about that :

> ` {{ `<script>`  
> $(document).ready(function() {  
> $(“#animatefsm”).click( {  
> console.log(“foo”);  
> } );  
> }  
> `</script>` | safeJS }}`

note: use backticks not apostrophes

---

<div class="post-metadata">

**Author:** ![TheIdOfAlan](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/theidofalan/32/9069_2.png) [@TheIdOfAlan](https://discourse.gohugo.io/u/TheIdOfAlan)\
**Post date:** [August 6, 2019, 3:52pm UTC](https://discourse.gohugo.io/t/javascript-on-page/4166/8 "2019-08-06T15:52:45Z")

</div>

The answer proposed on [this page](https://discourse.gohugo.io/t/javascript-in-blogpost-but-not-on-all-sites-at-the-same-time/3978/13) by [snapo](https://discourse.gohugo.io/u/snapo/summary) is to move all the javascript to one line in between the `<script>` and `</script>` tags.

That works for me in Hugo 56.3

---

<div class="post-metadata">

**Author:** ![Troy](https://avatars.discourse-cdn.com/v4/letter/t/85f322/32.png) [@Troy](https://discourse.gohugo.io/u/Troy)\
**Post date:** [August 14, 2020, 7:20am UTC](https://discourse.gohugo.io/t/javascript-on-page/4166/9 "2020-08-14T07:20:35Z")

</div>

Correct me if I’m wrong but if you put in your `config.toml`

```
[markup]
  [markup.goldmark]
    [markup.goldmark.renderer]
      unsafe = true

```

then something like

```
<script>

console.log('Hello World');

</script>

```

works in your markdown file without problems.

---

<div class="post-metadata">

**Author:** ![pointyfar](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/pointyfar/32/5797_2.png) [@pointyfar](https://discourse.gohugo.io/u/pointyfar)\
**Post date:** [August 14, 2020, 8:46am UTC](https://discourse.gohugo.io/t/javascript-on-page/4166/10 "2020-08-14T08:46:56Z")

</div>


