空のアンケート結果を非表示にする方法

はじめに

WPForms Surveys and Pollsアドオンを通じて生成された空の投票結果を非表示にしますか？デフォルトでは、フォーム送信後にレポートを有効にすると、投票数がなくてもすべての選択肢が表示されます。幸いなことに、簡単なJavaScriptの調整で、この動作をカスタマイズできます。このチュートリアルでは、空の結果を非表示にする手順を説明し、視聴者の好みをより的確に把握できるようにします。

フォームの作成

まず、フォームを作成し、投票の質問を追加する必要があります。このタイプのフォームの作成にヘルプが必要な場合は、こちらのドキュメントをご覧ください。

AJAXを有効にする

次に、フォームビルダー内で**設定**に移動します。**一般**タブで、矢印をクリックして**詳細設定**を開きます。そこに表示されたら、**AJAXフォーム送信を有効にする**をトグルして有効にします。

投票結果の有効化

フォーム送信でAJAXを有効にしたら、**アンケートと投票**タブをクリックし、**投票結果を有効にする**がチェックされていることを確認して、**保存**をクリックしてフォームを保存します。

スニペットの追加

最後に、投票結果を非表示にするスニペットを追加する時間です。

スニペットをサイトに追加する方法にヘルプが必要な場合は、こちらのチュートリアルをご覧ください。

/**
 * Hide the poll results if empty
 *
 * @link https://wpforms.com/developers/how-to-hide-empty-poll-results/
 */

function wpf_dev_hide_empty_poll_results() {
    ?>
    <script>
        jQuery(function($){
            $( '.wpforms-container' ).on( 'wpformsAjaxSubmitSuccessConfirmation', function(e) {
                $( '.wpforms-poll-answer' ).each( function() {
                    if ( $(this).find('.wpforms-poll-answer-percent span').text() === "0%" ) {
                        $(this).hide();
                    }
                })
            })
        });
    </script>
    <?php
}
add_action( 'wpforms_wp_footer_end', 'wpf_dev_hide_empty_poll_results', 10 );

フォームのどの質問のどの選択肢も**0%**の場合、投票結果には表示されません。フォームが送信されると、ユーザーは投票があった結果のみが表示されます。

これで完了です！投票結果のページをスタイル設定することもできますか？投票結果確認画面のスタイル設定方法の記事をご覧ください。

関連

アクション参照: wpforms_wp_footer_end