atshiftWordPress Plugins 製品を選ぶ atshift FieldsUser Profile FieldsFreeform LoginFeed BuilderKOTOTSUGI

Freeform Login Proの機能

無料版の設定とWordPress標準認証を保ったまま、ログイン画面の背景、ブランド、フォーム配置、レイヤー、装飾をさらに細かく調整するアドオンです。

Freeform Login Proを導入する1サイト $9.99の買い切りライセンスです。
料金・購入へ

無料版の設定画面へ、必要な調整項目を追加

Freeform Login Proは、無料版を置き換える別製品ではありません。無料版と同時に有効化すると、既存の設定画面へPro専用項目が追加され、背景からボタンまで同じライブプレビューで確認できるようになります。

WordPress標準のパスワード認証、パスキー、ログインフォームのショートコードは無料版の仕組みを継続して使います。Proが担当するのは、サイトのブランドや背景素材に合わせて、ログイン画面の見た目と配置をさらに細かく整える部分です。

Freeform Login Proの設定画面とライブプレビュー
設定と確認を1画面で完結左側の項目を変更すると、右側のログイン画面へ反映されます。デスクトップ、タブレット、モバイルの代表的な比率へ切り替え、公開前に文字の読みやすさとフォーム位置を確認できます。
パスキーとショートコードは無料版で利用できます。 Proは認証方式を置き換えるものではなく、ログイン画面の表現と配置を拡張します。

画面ごとに分かるPro設定

各スクリーンショットを選ぶと、実際の設定画面を拡大表示できます。数値の調整範囲や表示上の役割も、項目ごとに確認してください。

01 / BACKGROUND

静止画だけでなく、ループ動画を背景にする

メディアライブラリからMP4またはWebMを選び、ミュートしたループ動画としてログイン画面全面に表示できます。無料版の背景位置・表示サイズ設定をそのまま使えるため、被写体を避けてフォームを置く構図も作れます。

背景画像を一緒に設定すると動画読み込み前の代替画像として使われます。通信量と表示速度を考え、短く軽量な動画での運用を推奨します。

背景色、画像、ループ動画を選ぶProの背景設定
背景設定色、画像、ループ動画を選び、背景の表示サイズと位置を調整します。

02 / BRAND

横長・縦長のロゴを、比率を保って表示する

サイトタイトルの代わりに独自ロゴを選び、画像本来の縦横比を保ったまま表示できます。ロゴ幅は10〜100%で調整できるため、シンボル中心の縦長ロゴも、ワードマークを含む横長ロゴもフォーム幅に合わせられます。

ロゴを表示しない構成も選べるため、背景画像の中にブランド表示を含めたデザインにも対応します。

ロゴと説明テキストを調整するProのブランド設定
ブランド設定独自ロゴ、説明テキスト、ロゴ幅と配置を画面構成に合わせます。

03 / PLACEMENT

25か所の基準位置から、さらに数値で追い込む

無料版の9方向配置を、横5段階×縦5段階の25位置へ拡張します。基準位置を選んだ後、水平・垂直オフセットをそれぞれ-500〜500pxで調整し、背景の余白や被写体に合わせてフォームを移動できます。

狭い画面や高さの低い画面では安全なモバイル配置へ戻るため、デスクトップ用の細かな位置調整でログイン操作が画面外へ追い出されにくい設計です。

5×5の配置ピッカーを備えたProのフォーム配置設定
配置とサイズ25位置のピッカー、フォーム幅、水平・垂直オフセットをプレビューで確認します。

04 / LAYER & FORM

背景とフォームの間に、読みやすさを作る

背景レイヤーは「グラス」「矩形」「縦帯」「横帯」から選択できます。色、透明度、背景ぼかし、上下左右の広がり、角丸を調整でき、選んだ色に応じて境界線のコントラストも自動調整されます。

ログインフォーム自体にも、背景透明度、角丸、枠線の太さと色を個別指定できます。写真や動画を活かしながら、入力欄と案内文を読み取れる状態に整えられます。

グラスや帯を選べるProのフォーム背景レイヤー設定
背景レイヤー形状、色、透明度、ぼかし、余白を設定します。
背景、透明度、角丸、枠線を調整するProのフォーム設定
フォームフォーム本体の透明度、角丸、枠線を整えます。

05 / INTERACTION

通常時だけでなく、操作中の見え方まで揃える

リンクとボタンは通常色に加え、ホバー時と押下時の色を個別に指定できます。ボタンの枠線も太さと色を設定でき、ログインボタン、言語切替、Jetpack SSO、単独表示したパスキーボタンの見た目を揃えられます。

フォームの影は水平・垂直位置、ぼかし、広がり、色、透明度まで調整できます。ログイン画面の言語切替を表示するかどうかも、Pro設定から選択できます。

文字、リンク、ボタンの色を調整するProの設定
文字とボタンホバー、押下、ボタン枠線、言語切替を設定します。
位置、ぼかし、広がり、色を調整するProのシャドウ設定
シャドウ位置、ぼかし、広がり、色、透明度を数値で調整します。

導入条件と確認

先にFreeform Login無料版をインストールし、その後に購入したPro ZIPを追加して有効化します。Proを停止しても、無料版の設定と通常のWordPressログインは継続して利用できます。

  • WordPress 6.5以上
  • PHP 7.4以上
  • Freeform Login無料版
  • パスキーを利用する場合はPHP 8.3以上、HTTPS、JSON・OpenSSL拡張

購入後の流れ

  1. 購入完了画面またはメールからPro ZIPとライセンスキーを受け取ります。
  2. 無料版を有効化したサイトへPro ZIPをアップロードし、プラグインを有効化します。
  3. 「設定 → ライセンス」でキーを入力し、現在のサイトを認証します。
  4. Freeform Loginの設定画面でPro項目を調整し、プレビュー後に有効化します。

Personalライセンスは同時に1サイトで利用できます。別サイトへ移す場合は、旧サイトでライセンスを解除してから新しいサイトで認証してください。Proの設定値はライセンスを一時的に無効にしても保存されます。

本番サイトへ導入する前に動作を確認してください。 背景動画の容量、文字とフォームの読みやすさ、パスワードマネージャー、Jetpack SSOを含む認証動作をステージング環境で確認することを推奨します。