How to hide content on the site?

Question

JavaScript

Hello! The question is this: There is a site with blocks (different) on the page. On the first screen, the picture is in the full height of the window, in the center is the Input field, in which you need to enter the password that the person will see in the leaflet / receive from me. Before entering this password, there is nothing else on the page (except for this field with a background), you do not need to register on the site either. We enter the password - the content appears. Ideally, if without reloading the page, but it is possible with it. I do it on CMS Wordpress
There is an idea to do it through AJAX, but I don't know it.
Of course, I want to understand it, but at the moment I don’t have time to fully learn it. Need to do.
If someone can send at least an approximate code with a few explanations, I will be extremely grateful.
Or plugins for WP who knows

Answer 1

Everything is the same as with regular authorization, just make an account common, for example "guest" and a password for it. Login to the hidden input and that's it. And we block access to unregistered users.