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

Freeform Login

Freeform Login 使い方ガイド

ログイン画面のデザイン、サイト内ログイン、パスキー、Proアドオンを、導入順に確認できます。

01 / DESIGN

デザイン設定

WordPress標準の認証を保ったまま、サイトの入口を整えます。

管理画面の「設定」からFreeform Loginを開き、背景、ブランド、フォーム、配置を設定します。変更はプレビューで確認してから有効化できます。

背景画像を使う場合は、文字とフォームのコントラストを確認してください。狭い画面ではフォームが利用可能な幅へ収まるため、デスクトップだけでなくモバイル表示も確認します。

Freeform Loginの無料版デザイン設定画面
背景、ブランド、フォーム、配置をプレビューしながら調整します。

確認項目

  • 背景色・背景画像と表示位置
  • サイトタイトルまたはロゴによるブランド表示
  • フォーム幅、基準位置、入力欄とボタンの色
  • デスクトップ・タブレット・モバイルのプレビュー

02 / SHORTCODE

ショートコード

固定ページや会員ページへ、必要な認証操作だけを配置できます。

完全なログインフォームには [atshift_login] を使います。別のプラグインがユーザー名とパスワードのフォームを出している場合は、[atshift_passkey_login] でパスキーボタンだけを追加できます。

フロント側のプロフィール画面には [atshift_passkey_profile] を配置できます。ログイン中の本人だけが自分のパスキーを登録・確認・削除でき、ユーザーIDを指定して他人の資格情報を操作することはできません。

固定ページに配置したパスキーログイン
必要な認証操作だけをショートコードでサイト内へ配置できます。
[atshift_login]
[atshift_passkey_login redirect="/my-account/" remember="true"]
[atshift_passkey_profile heading="false"]

03 / PASSKEY

パスキーの登録と利用

端末の生体認証、PIN、セキュリティキーなどを使ってログインします。

パスキー機能にはPHP 8.3以上、HTTPS、PHP JSON・OpenSSL拡張が必要です。条件を満たさない環境でも、デザイン機能と通常のパスワードログインは継続して利用できます。

ユーザーはプロフィール画面から最大5件まで登録できます。画面には0/5〜5/5件の登録数、名称、登録日、最終利用日が表示されます。パスワードは復旧手段として、引き続き長く固有のものを保管してください。

Freeform Loginのパスキー登録画面
登録数と登録済みパスキーをプロフィール画面で確認できます。

手順

  1. ユーザー > プロフィールで「パスキーを追加」を選ぶ
  2. ブラウザーまたはOSの確認を完了する
  3. 識別しやすい名称を付け、登録一覧を確認する

04 / PRO ADD-ON

Proで追加される表現

無料版の設定を引き継ぎ、入口の表現をさらに細かく調整します。

Proは無料版へ機能を追加するアドオンです。無料版を停止せず、同じ設定画面から動画背景、背景レイヤー、拡張ブランド、詳細な装飾を設定します。

本番へ反映する前に、動画容量、フォームの読みやすさ、パスワードマネージャーやJetpack SSOを含む認証動作をステージング環境で確認してください。

Freeform Login Proの設定画面
無料版の構成を引き継ぎ、背景レイヤーや装飾を追加します。

確認項目

  • ループ動画背景
  • グラス・矩形・縦帯などの背景レイヤー
  • 拡張ロゴと説明テキスト
  • 入力欄、ボタン、影、リンクの詳細設定

WORDPRESS PLUGINS BY @SHIFT

Freeform Loginを、
サイトの運用へ。

まずはステージング環境で、実際の運用に合うかを確認してください。

WordPress.orgで入手Proを購入・機能詳細をみる