Style wordpress protected posts

1 Views

Is there a way to style password protected posts in WordPress? Plus I can only seem to protect the and not any custom fields outside of this.

Edit – Trying to avoid using a plugin if possible

Post Views: 1

Related posts

Leave a Reply

2 comments

  1. I assume you mean styling the password protected posts on the front-end.

    a) CSS:

    If your theme is using the post_class() function, like:

    <article <?php post_class(); ?>>...</article>

    then it will generate:

    <article class="... post-password-required ...">...</article>

    for the password protected posts.

    So you can simply target these posts with:

    .post-password-required {
    background-color: #eee;
}

    in your stylesheet.

    b) Form:

    i) If you want to add text to your password form, you can use the following:

    add_action( 'the_password_form', 'rob_the_password_form' );
function rob_the_password_form( $output )
{
    $before = ' Before ';  // Modify this to your needs!
    $after  = ' After ';   // Modify this to your needs!
    return $before . $output . $after;
}

    ii) If you want to modify the HTML form directly, you can override it with:

    add_filter( 'the_password_form', 'rob_override_the_password_form' );
function rob_override_the_password_form( $form = '' ) {
    global $post;
    $label = 'pwbox-'.( empty( $post->ID ) ? rand() : $post->ID );
    $form = '<form action="' . esc_url( site_url( 'wp-login.php?action=postpass', 'login_post' ) ) . '" method="post">
    ' . __( "To view this protected post, enter the password below:" ) . '
    <label for="' . $label . '">' . __( "Password:" ) . ' </label><input name="post_password" id="' . $label . '" type="password" size="20" maxlength="20" /><input type="submit" name="Submit" value="' . esc_attr__( "Submit" ) . '" />
    </form>
    ';
    return $form;
}

    where this is based on the example from the Codex. It uses the same form as the default one.

    c) Title:

    To change the default Protected: title prefix, you can use:

    add_filter( 'protected_title_format', 'rob_protected_title_format' );
function rob_protected_title_format( $format )
{
    $format = __( ' Members only! %s ' ); // Modify this to your needs!
    return $format;
}

    Hopefully this will help you to style your protected posts.