Adding a VantaJS Background

Hello,

I am attempting to add a custom background to my squarespace site. Specifically a valnajs background that can be found here:

https://www.vantajs.com/?effect=net#(backgroundAlpha:1,backgroundColor:13223885,color:7370174,maxDistance:24,points:6,showDots:!t,spacing:17)

I can successfully add this javascript and get the resulting image when I use a code block and the following code:

<script src="three.r92.min.js"></script>
<script src="vanta.net.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/100/three.min.js"></script>
<script src="https://www.vantajs.com/dist/vanta.birds.min.js"></script>

<div id=vantajs></div>

<script>
VANTA.BIRDS({
  el: "#vantajs",
});
</script>

However, this just inserts the image in that block and does not actually make the image the background of my page. I have tried many ways through the page code-injection feature to add this to my website, specifically the section-background html element, but nothing has worked. Here is an example of one of the methods I am trying when using the page code injection:

<script src="three.r92.min.js"></script>
<script src="vanta.net.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/100/three.min.js"></script>
<script src="https://www.vantajs.com/dist/vanta.birds.min.js"></script>

<script>
 (function(){var x = document.getElementByClassName("section-background"); 
x.setAttribute("id", "vantajs")})();
</script>

<script>
VANTA.BIRDS({
  el: "#vantajs",
});
</script>

Any help here would be greatly appreciated.

Can you share link to that page (page which you want insert background image)?

Sure. The page is the following:

https://crocodile-bamboo-zzzh.squarespace.com/vantatest

viewing password is quantgov-test

Did you use correct class? section-background?

document.getElementByClassName("section-background");

Yes, I believe that I have. It is the class of the element that controls the background of the page minus the header and footer.

9 minutes ago, Stephen-Mercatus said:

Yes, I believe that I have. It is the class of the element that controls the background of the page minus the header and footer.

Press F12 > Click "Console"