How to collapse a Java code cell (made in Jupyter Notebook) on a website with Jekyll blog posts?

I have a blogging website using fastpages, which allows me to create Jekyll posts, along with posts created with Jupyter Notebook.

I'm creating a Jupyter Notebook post in VS Code that is using the Java kernel and want to hide a Java code cell.

The fastpages README says that you can hide a code cell with #collapse at the top of the code cell, while its blog website says that you can use #collapse-hide.

I tried both of these options on my code cell, but when I run them, it says illegal character: '#'

I think the issue might be that #collapse-hide might only work for Python cells, but I'm pretty lost when searching for the problem.

The Jupyter Notebook documentation says that you can hide code cells with

{
    "tags": [
        "hide-input",
    ]
}

but I do not know where to put this metadata in.

On that page, there is also a link to a cell tags guide. I tried Step 1 (by clicking View -> Cell Toolbar -> Tags), but after clicking the Tabs button, I do not know what to do. I also tried going to View -> Cell Toolbar -> Edit Metadata, but when I paste the metadata above, it says Could not save invalid JSON

(by the way, I am using Jupyter Notebook on my localhost now, not VS Code)

I tried removing the curly braces from the metadata (because I think the curly braces would be for if I only paste the metadata and there isn't the other stuff (like "vscode": {...?), but the same error occurs.

I don't know how to code in JSON, I would just like to be able to hide my code cell on my website, like this:

I do not even know if I am heading in the right direction. Basically, I would like to know: how can I hide my Java code cell?