Posted at

Wordpressで会員制サイトを構築してみよう 事前準備

More than 3 years have passed since last update.

Wordpressで会員制サイトを作ることが増えてきました。

今回は定番のプラグイン "Theme My Login" を利用して、下記の機能の実装方法をまとめてみます。


元記事

下記エントリの転載になります。

WordPressで会員制サイトを構築してみよう(事前準備)


機能(仕様)


  • メールアドレスとパスワードで会員登録/ログイン
    (ユーザー名は入力させない)

  • メールアドレスの認証

  • 登録ユーザーは、自分のプロフィール/メールアドレス/パスワードの変更が可能

  • パスワード紛失時に再設定が可能


利用プラグイン

下記プラグインをインストールします。



  • Theme My Login
    会員登録/ログイン/プロフィールページの機能


前準備


WordPressの設定

ユーザーが会員登録できるよう、WordPressの設定をします。


  • 管理画面「設定」→「一般」内の「だれでもユーザー登録ができるようにする」にチェック

  • 「新規ユーザーのデフォルト権限グループ」を「購読者」に設定

権限グループについては、用途によって変更してください。

(サイトの閲覧のみをさせたい場合は「購読者」です)


Theme My Loginのテンプレートファイルをコピー

wp-content/plugins/theme-my-login/templates 内にあるファイルで、必要なものを自分のテーマファイル内にコピーします。

コピーしたファイルを変更することで、登録/ログインフォームの見た目や項目を変更することが出来ます。



  • register-form.php
    (会員登録フォーム)


  • login-form.php
    (ログインフォーム)


  • profile-form.php
    (ユーザーのプロフィール編集フォーム)


  • lostpassword-form.php
    (パスワード紛失時、新しいパスワード発行用のメールアドレス入力フォーム)


  • resetpass-form.php
    (新しいパスワード再発行フォーム)


Theme My Loginの設定

管理画面「TML」で各種設定を行います。


「General」タブ


  • 「Enable e-mail address login」にチェック

  • 「Enable AJAX」にチェック

  • 「Enable Custom E-mail」にチェック

  • 「Enable Custom Passwords」にチェック

  • 「Enable Security」にチェック

  • 「Enable Themed Profiles」にチェック

  • 「Enable User Moderation」にチェック

上記にチェックを入れて保存すると、管理画面の左側に下記の項目が増えます。


「E-mail」タブ(Custom E-mail)

会員登録時の自動返信メール文言を任意に設定できます。

「New User」・・・登録完了時

「Retrieve Password」・・・パスワード再設定の申請時(パスワード再設定用のURLが書かれています)

「Reset Password」・・・パスワード再設定完了時

「User Activation」・・・新規登録時(メールアドレス認証用のURLが書かれています)


「Themed Profiles」タブ(Enable Themed Profiles)

「Themed Profiles」・・・ユーザーのプロフィール画面を、管理画面ではなくテーマファイルのテンプレートで表示する権限を設定します。

今回は「Subscriber(購読者)」にチェックします。

「Restrict Admin Access」・・・管理画面へのユーザーの制限を行います。同様に「Subscriber(購読者)」にチェックします。


「Moderation」タブ(Enable User Moderation)

E-mail Confirmation にチェックを入れます。

新規登録時に、メールアドレス認証用のメールが自動で送信されるようになります。


固定ページの作成

Theme My Loginを有効化すると、下記の固定ページが自動で作成されますので、確認しておきます。


  • /login(ログイン)

  • /register(登録)

  • /resetpass(パスワードをリセット)

  • /lostpassword(パスワード紛失)

  • /あなたのプロフィール(プロフィールページ)

  • /logout?*********(ログアウト)

プロフィールページのみ、URLが日本語に設定されているため、

/あなたのプロフィール → /profile のようにお好みでslugを変更しておきます。

また、各固定ページの本文に自動で書かれているショートコード [theme-my-login] は、先ほどコピーしたTheme My Loginのテンプレートを呼び出すためのものです。

/register ページの場合、register-form.php の内容を出力するようになっています。

とりあえずこれで準備は完了です。


会員登録が出来るか試す

/register にアクセスすると、自動的に↓のような画面になっています。

register1.jpg

ユーザー名、メールアドレス、パスワードを設定すると、設定したメールアドレスに認証用メールが送信されます。そのURLをクリックすると、認証が完了です。

register2.jpg

とりあえずこれだけで、会員登録が可能になります。簡単すぎますね。

register3.jpg

ログインするとプロフィール画面も作成されています。

とりあえずここまでで、簡単に登録機能が追加できました。

次回、ユーザーの登録項目をカスタマイズしてみます。