Hugo

Link to local js file in .md document

I am using the Academic theme and I try to include a js library in my index.md file to display some 3d images. When I use the below code in the index.md file it works fine:

<head><script src="http://3Dmol.csb.pitt.edu/build/3Dmol-min.js"></script> </head>    
         <div style="height: 400px; width: 400px; position: relative;" class='viewer_3Dmoljs' data-pdb='2POR' data-backgroundcolor='0xffffff' data-style='stick'></div>

I copied the js library in the static/js folder and named it 3Dmol-min.js. When I change the code to

<head><script src="3Dmol-min.js"></script></head>

Nothing happens. What is the correct way to reference to the local js library in the static folder?

I checked: https://sourcethemes.com/academic/docs/writing-markdown-latex/#images but it does not describe the way to do it for js files.

Try <script src="/js/3Dmol-min.js">

When hugo builds your site, everything in the /static folder gets copied directly to the build folder (e.g. public). So a file names /static/js/3Dmol-min.js becomes /public/js/3Dmol-min.js…and your webserver will serve it out (normally) as www.example.com/js/3Dmol-min.js.

1 Like

It worked! Thank you!