マルチページフォームのスクロール速度を変更する

概要

複数ページのフォームのスクロール速度を変更したいですか?次のページをクリックすると、次のページが読み込まれ、最初の質問までスクロールします。しかし、小さなコードスニペットでこの速度を簡単に調整することができます。

このチュートリアルでは、この速度を調整するために必要なJavaScriptを説明します。

セットアップ

このスニペットをコピーしてあなたのサイトに貼り付けるだけです。

あなたのサイトにスニペットを追加する方法と場所についてサポートが必要な場合は、こちらのチュートリアルをご覧ください

/**
 * Adjust the scrolling speed on multi-page forms.
 *
 * @link https://wpforms.com/developers/how-to-change-the-scrolling-speed-on-multi-page-forms/
 */
 
function wpf_page_break_scroll() {
?>
    <script type="text/javascript">
        window.wpform_pageScroll = 160;
    </script>
<?php
}
add_action( 'wpforms_wp_footer', 'wpf_page_break_scroll' );

上のコードの160を、使用したい速度に変更するだけです。数字が大きいほどスクロールが速くなることに注意してください。例えば、160から 3000に変更すると、2ページ目のスクロールが速くなります。

注意:これを変更すると、すべてのフォームが変更されるだけでなく、フォームがスクロールするオフセットも変更されます。

よくある質問

これらは、マルチページフォームのスクロール速度の変更に関するよくある質問に対する回答です。

スクロールを完全に無効にできますか?

もちろんだ!スクロール効果を完全に取り除きたい場合は、代わりにこのスニペットを使ってください。

/**
 * Disabling the scrolling speed on multi-page forms.
 *
 * @link https://wpforms.com/developers/how-to-change-the-scrolling-speed-on-multi-page-forms/
 */

function wpf_disable_multipage_scroll() {
    ?>
    <script type="text/javascript">window.wpforms_pageScroll = false;</script>
    <?php
}
add_action( 'wpforms_wp_footer', 'wpf_disable_multipage_scroll' );

以上です!複数ページのフォームのスクロール速度を調整するために必要なことは、これですべて覚えました。

次に、これらの改ページをメール通知にも含めたいですか?ページ区切り、セクション区切り、HTMLフィールドを通知に含める方法については、ガイドをご覧ください。

アクション・リファレンス:wpforms_wp_footer