セキュリティの⾼い会員サイト を作るため …...1 セキュリティの...
TRANSCRIPT
1
セキュリティの⾼い会員サイトを作るためのWordPressプラグイン
◆必要な契約SPIRAL基本契約SPIRALAPIオプション(分間10件以上決済の発⽣が想定される場合)
◆必要なスキルWordpress知識
◆作業⼯数1営業⽇ ※サイト構築は除く
2
1.必要な環境の準備WordPressで構築したWebサイト
2.SPIRALの設定(1)「会員管理アプリ for WP」インポート※(2)SPIRAL APIの設定(3)「WP⽤ログイン認証⽤」フォームを設定
3.WordPressの設定(1)「WP Member Login by SPIRAL」インストール(2)SPIRALとの接続情報を設定(3)ウィジェットを追加
⼿順
※当マニュアルはSPIRALが提供するテンプレートアプリを使⽤する場合の 作業⼿順となっております。 テンプレートアプリに含まれる内容は主に以下となります。 ・会員DB ・会員新規登録、変更、退会フォーム ・ログイン処理⽤プログラム
詳細はアプリインポート後、「ドキュメント」リンクよりドキュメントをご確認ください。
3
1.必要な環境の準備WordPressで構築したWebサイト
2.SPIRALの設定(1)「会員管理アプリ for WP」インポート(2)SPIRAL APIの設定(3)「WP⽤ログイン認証⽤」フォームを設定
3.WordPressの設定(1)「WP Member Login by SPIRAL」インストール(2)SPIRALとの接続情報を設定(3)ウィジェットを追加
4
②「+(プラス)」ボタンをクリック
③「アプリセンターから選ぶ」をクリック
①「アプリ」をクリック
【SPIRAL】「会員管理アプリ for WP」インポート
5
④「会員管理アプリ for WP」の「選択」をクリック
⑤「次へ」をクリック
【SPIRAL】「会員管理アプリ for WP」インポート
6
【SPIRAL】「会員管理アプリ for WP」インポート
⑥「次へ」をクリック
⑦「次へ」をクリック
7
⑧「次へ」をクリック
⑨「次へ」をクリック
【SPIRAL】「会員管理アプリ for WP」インポート
8
⑩「次へ」をクリック
⑪「引き続き設定を⾏なう」をクリック
【SPIRAL】「会員管理アプリ for WP」インポート
9
【SPIRAL】「会員管理アプリ for WP」インポート
後続の「3.WordPressの設定(2)SPIRALとの接続情報を設定」(P.33〜)、「2.SPIRALの設定 【SPIRAL】「WP⽤ログイン認証⽤」フォームを設定」(P.23〜)で設定する値を取得します。
●設定項⽬:認証設定>マイエリアタイトル
①「wpmls_area」をクリック
②「エリアタイトル」をメモ 例)wpmls_area
※ヘッターメニューから参照する場合、 WEB>マイエリア>wpmls_area をクリックしてください。
10
【SPIRAL】「会員管理アプリ for WP」インポート
後続の「3.WordPressの設定(2)SPIRALとの接続情報を設定」(P.33〜)で設定する値を取得します。
●設定項⽬:認証設定>ログイン認証⽤フォームのURL
①「WP⽤ログイン認証⽤」をクリック
②「URL」をメモ
※ヘッターメニューから参照する場合、 WEB>フォーム>WP⽤ログイン認証⽤ をクリックしてください。
11
【SPIRAL】「会員管理アプリ for WP」インポート
後続の「3.WordPressの設定(2)SPIRALとの接続情報を設定」(P.33〜)で設定する値を取得します。
●設定項⽬:会員情報設定>会員⼀覧検索タイトル
①「WP⽤会員⼀覧」をクリック
②「WP⽤会員⼀覧検索フォーム」の「設定」をクリック
※ヘッターメニューから参照する場合、 WEB>⼀覧表・単票>WP⽤会員⼀覧>WP⽤会員⼀覧検索フォーム の「設定」をクリックしてください。
12
【SPIRAL】「会員管理アプリ for WP」インポート
②「キーワード」をメモ 例)wpmls_searchform
13
【SPIRAL】「会員管理アプリ for WP」インポート
後続の「3.WordPressの設定(2)SPIRALとの接続情報を設定」(P.33〜)で設定する値を取得します。
●設定項⽬:各種リンク設定>会員新規登録ページURL
①「WP会員新規登録」をクリック
②「URL」をメモ
※ヘッターメニューから参照する場合、 WEB>フォーム>WP会員新規登録 クリックしてください。
14
【SPIRAL】「会員管理アプリ for WP」インポート
後続の「3.WordPressの設定(2)SPIRALとの接続情報を設定」(P.33〜)で設定する値を取得します。
●設定項⽬:各種リンク設定>パスワード再設定ページURL
①「WP⽤会員PW忘れ⼿続き」をクリック
②「URL」をメモ
※ヘッターメニューから参照する場合、 WEB>フォーム>WP⽤会員PW忘れ⼿続き クリックしてください。
15
【SPIRAL】「会員管理アプリ for WP」インポート
後続の「3.WordPressの設定(2)SPIRALとの接続情報を設定」(P.33〜)で設定する値を取得します。
●設定項⽬:各種リンク設定>会員情報変更ページID
①「wpmls_area」をクリック
※ヘッターメニューから参照する場合、 WEB>マイエリア>wpmls_area をクリックしてください。
16
【SPIRAL】「会員管理アプリ for WP」インポート
●設定項⽬:各種リンク設定>会員情報変更ページID
②「カスタムマイページ」をクリック
17
【SPIRAL】「会員管理アプリ for WP」インポート
③「WP会員情報変更」の「編集」をクリック
④「差し替えキーワード(マイページID)」のマイページIDをメモ 例)121833
18
【SPIRAL】「会員管理アプリ for WP」インポート
●設定項⽬:各種リンク設定>パスワード変更ページID
①「WP⽤会員PW変更」をクリック
※当画⾯までの⾏き⽅はP.15〜16を参照ください。
②「差し替えキーワード(マイページID)」のマイページIDをメモ 例)121835
19
【SPIRAL】「会員管理アプリ for WP」インポート
●設定項⽬:各種リンク設定>退会ページID
①「WP⽤会員退会」の「編集」をクリック
※当画⾯までの⾏き⽅はP.15〜16を参照ください。
②「差し替えキーワード(マイページID)」のマイページIDをメモ 例)121834
20
1.必要な環境の準備WordPressで構築したWebサイト
2.SPIRALの設定(1)「会員管理アプリ for WP」インポート(2)SPIRAL APIの設定(3)「WP⽤ログイン認証⽤」フォームを設定
3.WordPressの設定(1)「WP Member Login by SPIRAL」インストール(2)SPIRALとの接続情報を設定(3)ウィジェットを追加
21
【SPIRAL】SPIRAL APIの設定
①「開発」をクリック
②「スパイラルAPI」をクリック
③「トークン発⾏」をクリック
⑤「引き続き設定を⾏なう」をクリック
④以下を設定し、「発⾏する」をクリックタイトル:任意 例)wpmls_highステータス:有効APIタイプ制限:制限する利⽤可能APIタイプ:ハイレベル└許可するマイエリア: P3.でインポートしたマイエリア 例)wpmls_area
22
【SPIRAL】「会員管理アプリ for WP」インポート
後続の「3.WordPressの設定(2)SPIRALとの接続情報を設定」(P.33〜)で設定する値を取得します。
●設定項⽬:スパイラルAPIトークン>APIトークン、APIトークンシークレット
「APIトークン」、「APIトークンシークレット」をメモ
23
1.必要な環境の準備WordPressで構築したWebサイト
2.SPIRALの設定(1)「会員管理アプリ for WP」インポート(2)SPIRAL APIの設定(3)「WP⽤ログイン認証⽤」フォームを設定
3.WordPressの設定(1)「WP Member Login by SPIRAL」インストール(2)SPIRALとの接続情報を設定(3)ウィジェットを追加
24
【SPIRAL】「WP用ログイン認証用」フォームを設定
①「WP⽤ログイン認証⽤」をクリック
②「⼊⼒ページ」をクリック
25
③以下の値を書き換える。 MLS_API_TOKEN_TITLE: P.20で発⾏したAPIトークタイトル MLS_MEMBER_AREA_TITLE: P.9でメモしたマイエリアタイトル
④「変更内容をフォームに反映」をクリック
【SPIRAL】「WP用ログイン認証用」フォームを設定
26
⑤「×」をクリック。
【SPIRAL】「WP用ログイン認証用」フォームを設定
27
1.必要な環境の準備WordPressで構築したWebサイト
2.SPIRALの設定(1)「会員管理アプリ for WP」インポート(2)SPIRAL APIの設定(3)「WP⽤ログイン認証⽤」フォームを設定
3.WordPressの設定(1)「WP Member Login by SPIRAL」インストール(2)SPIRALとの接続情報を設定(3)ウィジェットを追加
28
【WP】「WP Member Login by SPIRAL」インストール
①以下へアクセスhttp://wordpress.org/plugins/wp-member-login-by-spiral/
②「Download」をクリック。
29
【WP】「WP Member Login by SPIRAL」インストール
④「プラグイン」をクリック。
③お持ちのWordpressへログイン。
30
【WP】「WP Member Login by SPIRAL」インストール
⑤「新規追加」をクリック。
⑥「ファイルのアプロード」をクリック。
31
【WP】「WP Member Login by SPIRAL」インストール
⑦アップロード後、 「今すぐインストール」をクリック
⑧インストール完了後、 「プラグインを有効化」をクリック
32
【WP】「WP Member Login by SPIRAL」インストール
⑨インストール完了
33
1.必要な環境の準備WordPressで構築したWebサイト
2.SPIRALの設定(1)「会員管理アプリ for WP」インポート(2)SPIRAL APIの設定(3)「WP⽤ログイン認証⽤」フォームを設定
3.WordPressの設定(1)「WP Member Login by SPIRAL」インストール(2)SPIRALとの接続情報を設定(3)ウィジェットを追加
34
【WP】SPIRALとの接続情報を設定
①「設定」をクリック
②「WP Member Login by SPIRAL」をクリック
35
③各値を設定し、「変更を保存」をクリック ※詳細は次ページを参照ください
【WP】SPIRALとの接続情報を設定
36
「WP Member Login by SPIRAL」画⾯の設定内容
スパイラルAPIトークンAPIトークン: P.22でメモしたAPIトークンAPIトークンシークレット: P.22でメモしたAPIトークンシークレット
認証設定マイエリアタイトル: P.9でメモしたマイエリアタイトルログイン認証⽤フォームのURL: P.10でメモしたログイン認証⽤フォームのURL
会員情報設定会員⼀覧検索タイトル: P.11でメモした会員⼀覧検索タイトル会員情報⽤フィールドのキー: name※ログイン時に表⽰する会員の情報を設定します。※「name」という設定は⼀覧表に「lastName」と「firstName」の2つのフィールドが存在する場合に限り有効となる設定で、それらのフィールドを⽂字列連結した形で表⽰する特殊なキーとなっています。※ログインIDであるメールアドレスを表⽰させたい場合は、「email」と設定して下さい。
各種リンク設定会員新規登録ページURL: P.13でメモした会員新規登録ページURLパスワード再設定ページURL: P.14でメモしたパスワード再設定ページURL会員情報変更ページID: P.15でメモした会員情報変更ページIDパスワード変更ページID: P.18でメモしたパスワード変更ページID退会ページID: P.19でメモした退会ページID
【WP】SPIRALとの接続情報を設定
37
1.必要な環境の準備WordPressで構築したWebサイト
2.SPIRALの設定(1)「会員管理アプリ for WP」インポート(2)SPIRAL APIの設定(3)「WP⽤ログイン認証⽤」フォームを設定
3.WordPressの設定(1)「WP Member Login by SPIRAL」インストール(2)SPIRALとの接続情報を設定(3)ウィジェットを追加
38
【WP】ウィジェットを追加
①「外観」をクリック
②「ウィジェット」をクリック
39
【WP】ウィジェットを追加
③「WP Member Login by SPIRAL」を配置したい場所へドラッグ
④「保存」をクリック
40
【WP】ウィジェットを追加