ウィジェットのバックエンドフォームにチェックボックスを含める方法


17

ウィジェットのバックエンドにチェックボックスを含めようとしています。しかし、ユーザーが値を送信した後、値を取得できません(オンまたはオフ)。値は「esc_attr($ check)」に保存されると思っていました(テキスト入力を使用する場合と同様)が、取得できません。

これは私が今試していることです:

public function form( $instance ) {
    $check = isset( $instance[ 'check' ] ) ? $instance[ 'check' ] : 'off';
    echo esc_attr( $check ); // If the input is type text it outputs the value
    ?>
    <input class="widefat" id="<?php echo $this->get_field_id( 'check' ); ?>" name="<?php echo $this->get_field_name( 'check' ); ?>" type="checkbox" />
    <?php 
}

これを機能させるにはどうすればよいですか?また、フロントエンドのチェックボックスの値を取得するにはどうすればよいですか?

回答:


22

まず、関数ウィジェットで

function widget( $args, $instance ) {
    extract( $args );
    // Add this line
    $your_checkbox_var = $instance[ 'your_checkbox_var' ] ? 'true' : 'false';
    // Change 'your_checkbox_var' for your custom ID
    // ...
}

上の機能更新

function update( $new_instance, $old_instance ) {
    $instance = $old_instance;
    // Add this line
    $instance[ 'your_checkbox_var' ] = $new_instance[ 'your_checkbox_var' ];
    // Change 'your_checkbox_var' for your custom ID
    // ...
    return $instance;
}

最後に、関数formでこれを追加します:

<p>
    <input class="checkbox" type="checkbox" <?php checked( $instance[ 'your_checkbox_var' ], 'on' ); ?> id="<?php echo $this->get_field_id( 'your_checkbox_var' ); ?>" name="<?php echo $this->get_field_name( 'your_checkbox_var' ); ?>" /> 
    <label for="<?php echo $this->get_field_id( 'your_checkbox_var' ); ?>">Label of your checkbox variable</label>
</p>
<!-- Remember to change 'your_checkbox_var' for your custom ID, as well -->

編集: アバター画像を表示/非表示するチェックボックスを使用して「About Us」ウィジェットの完全なコードを見てみましょう:

class about_us extends WP_Widget {

function about_us() {
    $widget_ops = array( 'classname' => 'about_us', 'description' => __( 'About Us', 'wptheme' ) );
    $this->WP_Widget( 'about_us', __( 'About Us', 'wptheme' ), $widget_ops, $control_ops );
}

function widget( $args, $instance ) {
    extract( $args );
    $title = apply_filters( 'widget_title', $instance[ 'title' ] );
    $text = $instance[ 'text' ];
    // The following variable is for a checkbox option type
    $avatar = $instance[ 'avatar' ] ? 'true' : 'false';

    echo $before_widget;

        if ( $title ) {
            echo $before_title . $title . $after_title;
        }

        // Retrieve the checkbox
        if( 'on' == $instance[ 'avatar' ] ) : ?>
            <div class="about-us-avatar">
                <?php echo get_avatar( get_the_author_meta( 'user_email' ), '50', '' ); ?>
            </div>
        <?php endif; ?>

        <div class="textwidget">
            <p><?php echo esc_attr( $text ); ?></p>
        </div>

        <?php 
    echo $after_widget;
}

function update( $new_instance, $old_instance ) {
    $instance = $old_instance;
    $instance[ 'title' ] = strip_tags( $new_instance[ 'title' ] );
    $instance[ 'text' ] = strip_tags( $new_instance[ 'text' ] );
    // The update for the variable of the checkbox
    $instance[ 'avatar' ] = $new_instance[ 'avatar' ];
    return $instance;
}

function form( $instance ) {
    $defaults = array( 'title' => __( 'About Us', 'wptheme' ), 'avatar' => 'off' );
    $instance = wp_parse_args( ( array ) $instance, $defaults ); ?>
    <p>
        <label for="<?php echo $this->get_field_id( 'title' ); ?>">Title</label>
        <input class="widefat"  id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" type="text" value="<?php echo esc_attr( $instance[ 'title' ] ); ?>" />
    </p>
    <!-- The checkbox -->
    <p>
        <input class="checkbox" type="checkbox" <?php checked( $instance[ 'avatar' ], 'on' ); ?> id="<?php echo $this->get_field_id( 'avatar' ); ?>" name="<?php echo $this->get_field_name( 'avatar' ); ?>" /> 
        <label for="<?php echo $this->get_field_id( 'avatar' ); ?>">Show avatar</label>
    </p>
    <p>
        <label for="<?php echo $this->get_field_id( 'text' ); ?>">About Us</label>
        <textarea class="widefat" id="<?php echo $this->get_field_id( 'text' ); ?>" rows="10" cols="10" name="<?php echo $this->get_field_name( 'text' ); ?>"><?php echo esc_attr( $instance[ 'text' ] ); ?></textarea>
    </p>
<?php
}

}
register_widget( 'about_us' );

テスト済みで動作しています。

編集(2015-Sept-08):重要!このウィジェットの例ではPHP4スタイルのコンストラクターを使用していますが、WordPress 4.3はPHP5に切り替えるため、コンストラクターも切り替える必要があります。詳細については、こちらをご覧ください

プラグイン「テーマチェック」を使用する場合、の代わりに使用することを提案する通知が表示されます。最初の関数を削除して、次の関数を追加します。__construct()WP_Widget

function __construct() {
    parent::__construct(
        'about_us', // Base ID
        __( 'About US', 'wptheme' ), // Name
        array( 'description' => __( 'About Us', 'wptheme' ), ) // Args
    );
}

はい、ウィジェットで使用してアバター画像を有効/無効にします。それは私にとって非常に良い仕事です。
ジェラルド

OK。より明確にするために$instance['your_checkbox_var']、関数形式のデフォルトの割り当てを答えに追加する必要があると思います。
gmazzap

デフォルトの割り当ては、「your_checkbox_var」ではなく「avatar」です。実際に、より明確にするために「your_checkbox_var」を作成しました。とにかく、デフォルトの例を使用して回答を変更します。アドバイスをありがとう:)
ジェラルド

@Gerard、デフォルトでアバターをオンにしてみてください。アバターをオフにすることはできません
Benn

これは、機能でTRUeとFalsoの代わりに「on」と「off」を使用したときに機能しました。私はまた、(= $ MYINSTANCE「オン」)場合... if文のための簡単なチェックを使用{...私のコード...}
熟練ファミリー
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.