# Any way to load code from a file and highlight it?

**URL:** <https://talk.jekyllrb.com/t/any-way-to-load-code-from-a-file-and-highlight-it/3192>\
**Category:** Help\
**Created:** [August 14, 2019, 11:25am UTC](https://talk.jekyllrb.com/t/any-way-to-load-code-from-a-file-and-highlight-it/3192 "2019-08-14T11:25:02Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![sammosummo](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/sammosummo/32/1682_2.png) [@sammosummo](https://talk.jekyllrb.com/u/sammosummo)\
**Post date:** [August 14, 2019, 11:25am UTC](https://talk.jekyllrb.com/t/any-way-to-load-code-from-a-file-and-highlight-it/3192/1 "2019-08-14T11:25:02Z")

</div>

I’m interested in adding code snippets with syntax highlighting to my Jekyll site. Obviously the following works fine,

````
```lang
some code here
```

````

where `lang` is the language I want. However, I would like to load code from an external file, so that I can change it easily. This is simple enough to do with a little bit of Javascript and HTML, like this

```
<script>
fetch('url_here')
.then(response => {
    return response.text();
})
.then(text => {
    document.getElementById("demo").innerHTML = text;
})
</script>
<pre><code id="demo"></code></pre>

```

but the code comes out without syntax highlighting, presumably because Jekyll/Liquid does not evaluate the contents of `<code>`. If I put this in a markdown codeblock or use `{% highlight %}`, like so

````
```lang
<pre><code id="demo"></code></pre>
```

````

I literally get `<pre><code id="demo"></code></pre>`, not what it evaluates to. Any ideas how I can achieve what I want?

Thanks!
