Proアドオンでできること
無料版のログインデザインを土台に、背景素材やブランドに合わせて表現と配置を追い込めます。
動画を背景に使いたい
- MP4・WebMの軽量なループ動画を表示
- 静止画を代替画像にし、表示サイズと位置を調整
ロゴとフォームの配置を追い込みたい
- 横長・縦長ロゴを縦横比のまま表示
- 25か所の基準位置と水平・垂直オフセットで調整
背景上でもフォームを読みやすくしたい
- グラス・矩形・縦帯・横帯の背景レイヤーを追加
- 透明度・ぼかし・角丸・枠線を調整
操作中の見え方まで揃えたい
- リンクとボタンのホバー・押下色を個別に設定
- 影の位置・ぼかし・広がりと言語切替表示を調整
無料版の設定画面へ、必要な調整項目を追加
Freeform Login Proは、無料版を置き換える別製品ではありません。無料版と同時に有効化すると、既存の設定画面へPro専用項目が追加され、背景からボタンまで同じライブプレビューで確認できるようになります。
WordPress標準のパスワード認証、パスキー、ログインフォームのショートコードは無料版の仕組みを継続して使います。Proが担当するのは、サイトのブランドや背景素材に合わせて、ログイン画面の見た目と配置をさらに細かく整える部分です。
設定と確認を1画面で完結左側の項目を変更すると、右側のログイン画面へ反映されます。デスクトップ、タブレット、モバイルの代表的な比率へ切り替え、公開前に文字の読みやすさとフォーム位置を確認できます。
パスキーとショートコードは無料版で利用できます。 Proは認証方式を置き換えるものではなく、ログイン画面の表現と配置を拡張します。
画面ごとに分かるPro設定
各スクリーンショットを選ぶと、実際の設定画面を拡大表示できます。数値の調整範囲や表示上の役割も、項目ごとに確認してください。
01 / BACKGROUND
静止画だけでなく、ループ動画を背景にする
メディアライブラリからMP4またはWebMを選び、ミュートしたループ動画としてログイン画面全面に表示できます。無料版の背景位置・表示サイズ設定をそのまま使えるため、被写体を避けてフォームを置く構図も作れます。
背景画像を一緒に設定すると動画読み込み前の代替画像として使われます。通信量と表示速度を考え、短く軽量な動画での運用を推奨します。
02 / BRAND
横長・縦長のロゴを、比率を保って表示する
サイトタイトルの代わりに独自ロゴを選び、画像本来の縦横比を保ったまま表示できます。ロゴ幅は10〜100%で調整できるため、シンボル中心の縦長ロゴも、ワードマークを含む横長ロゴもフォーム幅に合わせられます。
ロゴを表示しない構成も選べるため、背景画像の中にブランド表示を含めたデザインにも対応します。
03 / PLACEMENT
25か所の基準位置から、さらに数値で追い込む
無料版の9方向配置を、横5段階×縦5段階の25位置へ拡張します。基準位置を選んだ後、水平・垂直オフセットをそれぞれ-500〜500pxで調整し、背景の余白や被写体に合わせてフォームを移動できます。
狭い画面や高さの低い画面では安全なモバイル配置へ戻るため、デスクトップ用の細かな位置調整でログイン操作が画面外へ追い出されにくい設計です。
04 / LAYER & FORM
背景とフォームの間に、読みやすさを作る
背景レイヤーは「グラス」「矩形」「縦帯」「横帯」から選択できます。色、透明度、背景ぼかし、上下左右の広がり、角丸を調整でき、選んだ色に応じて境界線のコントラストも自動調整されます。
ログインフォーム自体にも、背景透明度、角丸、枠線の太さと色を個別指定できます。写真や動画を活かしながら、入力欄と案内文を読み取れる状態に整えられます。
05 / INTERACTION
通常時だけでなく、操作中の見え方まで揃える
リンクとボタンは通常色に加え、ホバー時と押下時の色を個別に指定できます。ボタンの枠線も太さと色を設定でき、ログインボタン、言語切替、Jetpack SSO、単独表示したパスキーボタンの見た目を揃えられます。
フォームの影は水平・垂直位置、ぼかし、広がり、色、透明度まで調整できます。ログイン画面の言語切替を表示するかどうかも、Pro設定から選択できます。
導入条件と確認
先にFreeform Login無料版をインストールし、その後に購入したPro ZIPを追加して有効化します。Proを停止しても、無料版の設定と通常のWordPressログインは継続して利用できます。
- WordPress 6.5以上
- PHP 7.4以上
- Freeform Login無料版
- パスキーを利用する場合はPHP 8.3以上、HTTPS、JSON・OpenSSL拡張
購入後の流れ
- 購入完了画面またはメールからPro ZIPとライセンスキーを受け取ります。
- 無料版を有効化したサイトへPro ZIPをアップロードし、プラグインを有効化します。
- 「設定 → ライセンス」でキーを入力し、現在のサイトを認証します。
- Freeform Loginの設定画面でPro項目を調整し、プレビュー後に有効化します。
Personalライセンスは同時に1サイトで利用できます。別サイトへ移す場合は、旧サイトでライセンスを解除してから新しいサイトで認証してください。Proの設定値はライセンスを一時的に無効にしても保存されます。
本番サイトへ導入する前に動作を確認してください。 背景動画の容量、文字とフォームの読みやすさ、パスワードマネージャー、Jetpack SSOを含む認証動作をステージング環境で確認することを推奨します。