web-dev-qa-db-ja.com

コメントフォームフィールドにプレースホルダ属性を追加する

私はデフォルトのWordPressコメントフォームに追加しようとしています。各フィールドにplaceholder = ""を追加する必要があります。フィルターがわかりません。エラーは発生しませんが、プレースホルダーも表示されません。

1時間ここで投稿を検索した後、私はこれまでにこれを思い付きました

function my_fields($args){
        $commenter = wp_get_current_commenter();
        $user = wp_get_current_user();
        $user_identity = $user->exists() ? $user->display_name : '';

        $req = get_option( 'require_name_email' );
        $aria_req = ( $req ? " aria-required='true'" : '' );
    $fields['author'] = '<input id="author" placeholder="name" name="author" type="text" value="' 
    . esc_attr( $commenter['comment_author'] ) . '" size="30"' . $aria_req . ' /></p>';

    return $args;
}

add_filter('comment_form', 'my_fields');

私はさまざまなバリエーションを試し、さまざまなものを返すよう試みましたが、運が悪いです。

commentsfilters
3
Jamie

placeholder属性を追加するには、'comment_form_default_fields'をフィルター処理する必要があります。

サンプルコード

add_filter( 'comment_form_default_fields', 'wpse_62742_comment_placeholders' );

/**
 * Change default fields, add placeholder and change type attributes.
 *
 * @param  array $fields
 * @return array
 */
function wpse_62742_comment_placeholders( $fields )
{
    $fields['author'] = str_replace(
        '<input',
        '<input placeholder="'
        /* Replace 'theme_text_domain' with your theme’s text domain.
         * I use _x() here to make your translators life easier. :)
         * See http://codex.wordpress.org/Function_Reference/_x
         */
            . _x(
                'First and last name or a nick name',
                'comment form placeholder',
                'theme_text_domain'
                )
            . '"',
        $fields['author']
    );
    $fields['email'] = str_replace(
        '<input id="email" name="email" type="text"',
        /* We use a proper type attribute to make use of the browser’s
         * validation, and to get the matching keyboard on smartphones.
         */
        '<input type="email" placeholder="[email protected]"  id="email" name="email"',
        $fields['email']
    );
    $fields['url'] = str_replace(
        '<input id="url" name="url" type="text"',
        // Again: a better 'type' attribute value.
        '<input placeholder="http://example.com" id="url" name="url" type="url"',
        $fields['url']
    );

    return $fields;
}

結果

enter image description here

いくつかのメモ

  • プレースホルダをlabelの代わりに使用しないでください。スクリーンリーダーのユーザーは非常に腹を立てるでしょう。そしてそれは 許可されていません とにかくです。
  • type属性も変更しました。これはあなたの訪問者がplaceholder以上に役立つでしょう。
  • フィールドが に入力されていないことを確認してください 。しかし、読みやすいコントラストを得るようにしてください。はい、それは簡単ではありません。 いくつかのCSSを使用できます しかし、すべてのブラウザで機能するわけではありません。
6
fuxia

私はあなたがこのフィルタを使いたいと思うと思います：

comment_form_default_fields

特定の分野にも焦点を当てることができます。

comment_form_field_$name

参照用に編集します。

http://codex.wordpress.org/Function_Reference/comment_form

0
Jake