Add JS file as background to HUGO Academic theme

support
1

I want to add this (https://vincentgarreau.com/particles.js/) file as background to the home page of Academic theme.
Academic theme: https://github.com/gcushen/hugo-academic

Alternatively, I look forward to combining Academic theme and Hugo Air theme

Can you please suggest how to do either one of that?

Thanks!!

2

Add the javascript to your templates for the first one, and study theme components to combine two themes, for the second. In any case, read all the docs.

3

Can you please suggest exact file paths? I’m not able to figure it out.

4

The particles.js github shows how to integrate it. You need to search about:

  • overriding theme components - find the appropriate template, copy it to your project from the themes folder to the same folder in your project, and edit it
  • hugo’s static folder - that is where you can put js files like this one

As for combining themes, that’s not a trivial task, so I cannot imagine anyone simply volunteering to figure that out for you. I would suggest getting more experience in how Hugo works, then start doing it yourself. And, read all the docs as @maiki mentions.

2 Likes