How to add a placeholder to the protected post password input

When a post is protected, its content looks like:

// This content is password protected. To view it please enter your password below:
// Password: [_______________] [Enter]

How do I add a placeholder to that input tag?

Topic input password forms Wordpress

Category Web


Assuming the password field has an 'id' value, a bit of Javascript might be better.

The wp-admin login page uses a password id of 'user-pass', so place this in your function used with the add_filter('the_password_form', 'my_theme_password_placeholder);

function my_theme_password_placeholder() {
?>
<script>
document.getElementById("password-field-id").placeholder = "Type password here.."; 
</script>
<?php 
return;}

add_filter('the_password_form') 'my_theme_password_placeholder');

This will place the Type password here.. text inside the password field.

This will ensure that any placeholder value is the one you set, overwriting any existing placeholder value. You could adjust the function to pass a parameter containing the string to display as a placeholder.

Of course, if the visitor has disabled JavaScript, this won't work. But that is (IMHO) a small minority of site visitors.


This can be achieved via a hook, called the_password_form:

function my_theme_password_placeholder($output) {
    $placeholder = 'Hello!';
    $search = 'type="password"';
    return str_replace($search, $search . " placeholder=\"$placeholder\"", $output);
}
add_filter('the_password_form', 'my_theme_password_placeholder');

A str_replace searches for the string type="password" inside the output. This gives an attribute to the <input> indicating it's of type password. The replacement string contains the searched one plus the placeholder attribute too.

About

Geeks Mental is a community that publishes articles and tutorials about Web, Android, Data Science, new techniques and Linux security.