LP(ランディングページ)などでMW WP FORMを使用した時の位置調整

はい、みなさんこんにちは!

今日は表題の件についてブログを書こうと思います。
「いやいやそんなんチェックですぐやん!」って知ってる人は思うと思いますが
このチェックをいれたあとの調整を私はしたくて備忘録てきに書くことにしました。

今回私がしたかったことは以下です。
・LP(ランディングページ)の下にフォームを設定したい
・フォームはWPのMW WP FORMを使用する。
・お問い合わせフォームの確認画面へ飛んだ時に一番上に戻ってしまうのを調整
・MW WP Formが設定されている高さに戻るのはいいけど、望んでいる位置じゃない←ここ重要!
という感じです。

そもそも上記でもかいた通り、MW WP FORMを使用して、確認画面遷移時に
フォーム部分に飛ばすのは、MW WP FORMのプラグイン既存の機能で一発解決します。

そう、MW WP Formには、「 画面変遷時のスクロールを有効にする 」という設定項目が
存在するのです。
なので基本的には管理画面のMW WP FROMの

この項目にチェックを入れると、アラートが出たときや確認画面に遷移したときにMW WP Formが設定されている高さまで自動でスクロールしてくれます。

チェック入れてもうまくいかないときは、
下記でまとめてるのでチェックしてみてください。

MW WP FORMをページ内に埋め込んだときに確認ページへ遷移するとページのトップに戻ってしまう!

で、ここからが重要。
もうすこし戻るいちを調整したい!そう思った人はたくさんいるはず。
そういう人は下記をいじってみてください。

wp-content\plugins\mw-wp-form\js

上記のディレクトリに「scroll.js」というファイルがあります。

ファイルを開くと下記のようなソースが記述されてます。

jQuery( function( $ ) {
	var posy = $( '.mw_wp_form' ).offset().top;
	posy = posy + parseInt( mwform_scroll.offset );
	$( window ).scrollTop( posy );
} );

上記に


posy = posy – 設定したい数値;

を追加することで調整できます。

たとえば…

jQuery( function( $ ) {
	var posy = $( '.mw_wp_form' ).offset().top;
	posy = posy + parseInt( mwform_scroll.offset );
    posy = posy - 160;
	$( window ).scrollTop( posy );
} );

こんな感じ!

これで調整完了✨
みなさんも試してみてね!