WordPress でソーシャル ログインを有効にする方法 (3 つの簡単なステップ)

公開: 2024-08-12

今日の世界では、時間は入手できる最も貴重な資産の 1 つです。閲覧者がウェブサイトでの滞在時間を確実に節約できるようにすることが、ユーザーを引き付け、維持するための鍵となります。どうすればこんなことができるのでしょうか？

これを実現する効果的な方法の 1 つは、WordPress にソーシャル ログインを組み込むことです。

ソーシャル ログインを使用すると、ユーザーは Facebook、Google、X (以前は Twitter)、LinkedIn などのソーシャル メディア アカウントを使用してサインアップまたはログインできます。この方法は認証プロセスを合理化し、ユーザーと Web サイト管理者の両方にメリットをもたらします。

WordPress のソーシャル ログインには、時間効率が良いだけでなく、次のような利点もあります。

  • ユーザー エクスペリエンスの強化: 手間のかからないログイン プロセスにより、訪問者はコンテンツにアクセスしたり、記事を読んだり、注文したりすることが容易になります。
  • 直帰率の低減: ソーシャル アカウント経由でのログインが簡単になると、プロセスが迅速かつ簡単であればユーザーがサイトに留まり、対話する可能性が高くなるため、サイトの離脱率が大幅に低下します。
  • セキュリティの強化: WordPress のソーシャル ログインは、主要なソーシャル メディア プラットフォームの堅牢なセキュリティ対策を活用し、パスワードが十分に強力でない場合に発生する可能性のあるパスワード盗難のリスクを軽減します。

これらすべての利点を考慮すると、できるだけ早く WordPress Web サイトにソーシャル ログインの実装を開始することをお勧めします。どこから始めればよいかわかりませんか?もう探す必要はありません。必要なのは、WordPress に最適なソーシャル ログインを取得するための Social Connect アドオンを備えた Profile Builder だけです。

始め方

このチュートリアルでは、WordPress 用のオールインワンのユーザー登録および管理プラグインである Profile Builder を使用します。このプラグインを使用すると、フロントエンドの登録、ログイン、プロファイル編集フォームを作成し、完全にカスタマイズできます。それに加えて、Facebook、X、LinkedIn などの最も一般的なソーシャル ログイン オプションを使用してユーザーがログインできるようにすることもできます。

Profile Builder のインストールプロセスは簡単です。他の WordPress プラグインと同じようにインストールして有効化します。

プロファイルビルダーのインストール

WordPress サイトにソーシャル ログインを実装できるようにするには、まずプロファイル ビルダーをインストールする必要があります。

何よりもまず、公式 Web サイトから Profile Builder ライセンスを取得します。

その後、Cozmoslabs アカウント ページにログインすると、2 つのボタンが表示されます。

  1. 無料版に関連付けられたボタン – メインプラグイン
  2. 有料バージョンに関連付けられたボタン – この場合は、Pro Download

zip ファイルをダウンロードしたら、Web サイトにアップロードします。 WordPress 管理インターフェイスの [プラグイン] メニューに移動し、[新しいプラグインの追加] -> [プラグインのアップロード] をクリックするだけです。アップロード後、必ず両方を有効にしてください。

最終的には、次の 2 つのプラグインをインストールする必要があります。

  1. プロファイル ビルダー – これはメイン プラグインからダウンロードできます。 ボタン
  2. Profile Builder Pro – これは Pro Download からダウンロードできます。 ボタン

Profile Builder のコピーを入手したら、それを登録することも重要です。このようにして、自動アップデート、バグ修正、プレミアム サポートを受けることができます。

[プロファイル ビルダーの設定] に移動し、[Web サイトの登録] セクションでシリアル番号を追加するだけで、アカウントに記載されます。

ログインページの設定とカスタマイズ

プラグインを導入する準備ができたので、訪問者が Web サイトでアカウントを作成できるようにするためのユーザー ページを作成します。これは、WordPress Web サイトの他の新しいページと同様に手動で行うことも、セットアップ ウィザードを使用して行うこともできます。このツールを使用すると、セットアップ プロセスをすばやく実行でき、ログイン、登録、プロファイルの編集、パスワードのリセットなどの専用フォームを備えたさまざまなユーザー ページを自動的に作成できます。

プロファイル ビルダーのメニュー アイコンで、[ダッシュボード] に移動し、[セットアップ ウィザードを開く] をクリックします。ここで、必要なすべてのユーザー ページを自動的に作成するようにプロファイル ビルダーに指示できます。次に、ここから好みに合わせて編集できます。

ユーザー フォームを作成してカスタマイズするだけでなく、セットアップ ウィザードを使用すると、サイトに追加の機能を追加することもできます。たとえば、Web サイトの特定のページをログイン ユーザーのみに表示するように制限できます。セットアップの最後のステップに到達すると、セットアップ ウィザードはコンテンツ制限セクションにリダイレクトします。

専用フォームを使用してログイン ページを作成したので、次はそれをカスタマイズします。

これは、プロファイル ビルダーのメニュー アイコン -> 設定 -> 一般設定にアクセスするだけで行えます。Web サイトの登録セクションのすぐ下に、選択できるすべてのフォーム スタイルが表示されます。

特定のスタイルのデザインをプレビューするには、選択したスタイルの上にマウスを置き、 「プレビュー」ボタンをクリックします。

スタイルを選択したら、右側の [変更を保存] ボタンをクリックして変更を保存すると、選択したスタイルがアクティブになります。

WordPress サイトにソーシャル ログインを追加する方法

1.ソーシャルコネクトアドオンを有効にする

WordPress サイトにソーシャル ログインを追加するために必要な次のステップは、前述した Social Connect アドオンを有効にすることです。

管理インターフェイスのプロファイル ビルダー メニュー アイコンに移動し、[アドオン] タブを選択するだけです。

Web サイトでソーシャル コネクトを使用するには、[基本アドオン] セクションで [アクティブ化] をクリックします。

その後、「ソーシャル コネクト」という新しいサブメニューがプロファイル ビルダー メニュー アイコンの下に表示されます。

2. ソーシャル ログイン アプリを有効にする

WordPress Web サイトでソーシャル ログインを設定する次のステップは、必要なソーシャル ネットワーク用のアプリケーションを有効にして作成することです。

以前に有効にした [ソーシャル コネクト] サブメニューをクリックすると、[設定] が表示されます。 このアドオンの領域。

このセクションでは、優先ソーシャル ログインで有効化を選択し、必要なネットワークごとにソーシャル API キーを作成して構成します。

各ソーシャル ネットワークには独自の、場合によっては複雑な構成プロセスがあるため、この手順はセットアップの中で最も困難な部分になることがよくあります。ただし、プラグイン インターフェイスにはプロセス全体のドキュメントが含まれているため、各ステップのガイドを参照できるため、心配する必要はありません。

3. WordPress ソーシャル ログイン ボタンを表示する場所を選択します

ソーシャル ログイン オプションを設定した後、Web サイト上のどこにソーシャル ログイン オプションを表示するかを選択する必要があります。これは「設定」で行うことができます。

通常、作成者はログイン フォームにボタンを表示することを望んでいますが、登録フォームやプロフィールの編集セクションでもボタンを利用できるようにすることもお勧めします。

既存のユーザーが自分のソーシャル プロフィールを自分のアカウントに接続できるようにすることで、すべての情報を維持したまま Web サイトにすばやくログインできるようになります。

4. ソーシャルログインボタンをカスタマイズする

WordPress のソーシャル ログインに関するプロファイル ビルダーのオプションを使用すると、ボタンを自由にカスタマイズできます。

このセクションでは、最後に表示される内容がブランドのスタイルを確実に反映するように、ボタンの順序、位置、スタイル、その他の設定を変更できます。

それに加えて、デフォルトの CSS を完全に無効にするオプションもあり、希望どおりにボタンのスタイルを設定できます。

5. 最終調整を行います

上記の手順をすべて完了すると、ログイン フォームでソーシャル ログイン オプションが有効になるはずです。

この時点で、Web サイトに最適な結果が見つかるまで、その他の調整を自由に行ってください。

結論

Profile Builder プラグインを使用して WordPress のソーシャル ログインを有効にすると、ユーザーに迅速、安全、便利なログイン方法が提供され、Web サイトのユーザー エクスペリエンスが大幅に向上します。

簡単にまとめると、WordPress のソーシャル ログインを有効にする方法は次のとおりです。

  1. Profile Builder をダウンロードし、Social Connect アドオンを有効にします。
  2. ソーシャル ログイン アプリを有効にして構成します。
  3. ソーシャル ログイン ボタンの配置を選択します。
  4. ソーシャル ログイン ボタンをカスタマイズします。
  5. 最終結果を確認して調整します。

それでおしまい！適切なツールを使用すれば、WordPress サイトでソーシャル ログインを有効にするのが非常に簡単です。Profile Builder はこれに最適なソリューションです。