Adding a Cookie Session to Shortcode Content

Welcome to WordPress Development StackExchange site! In general you understand everything right, but there can be one important caveat: if some page content like page header, navigation menu, etc is already sent to the user, a try to set cookie from PHP script will give a following error: "Cannot modify header information – headers already sent by...". To avoid it you can add some javascript to your form and set a cookie from this javascript. Lets try the following code:

function protected_password_content( $atts, $content=null ) {

    // if password is sent via posting form, try to use it first
    // next try to get password from the cookie
    $userpass = isset( $_REQUEST['password'] ) ? $_REQUEST['password'] : ( isset( $_COOKIE['userpass'] ) ? $_COOKIE['userpass'] : NULL );

    if ( in_array( $userpass, array('password') ) ) {
        $return = do_shortcode($content);
    } else {
        $return = '
            <span>To view this section, enter your access code.</span><br>
            <form action="" method="post" onsubmit="putCookie(this)">
            <input style="display:block; width: 69%; height: 50px; margin-right: 1%; padding: 0px; float: left; border:1px solid blue;border-radius:3px;" type="text" placeholder="&#32;&#32;&#32;Access Code Here" name="password" id="userpass">
            <input style="display:block; margin: 0px;  width: 30%; height: 50px; padding: 0px;" type="submit" value="Show Content">
            </form>
            <script>
            function putCookie(form) {
                var today = new Date();
                var expiry = new Date(today.getTime() + 24 * 3600 * 1000); // plus 1 day
                document.cookie = "userpass=" + escape(form.userpass.value) + "; path=/; expires=" + expiry.toGMTString();
            }
            </script>';
    }
    return $return;
}

You do not required to specify the cookie expire time. If you omit that part, the cookie will be set as so-called session cookie, which would be valid only until user closes his browser:

function putCookie(form) {
    document.cookie = "userpass=" + escape(form.userpass.value) + "; path=/";
}

error code: 523