HintとUnivapayを連携させる方法（UPCプランのみ）
Univapay設定画面を開く
Hintの設定からUnivapayの設定画面を開きます。
ここにUnivapayのアカウント情報を入力していきます。
一旦このページは開いたまま放置でOKです。
Univapayにログインする
ログインURLはこちらです。
メールアドレスとパスワードでログインします。
ログインするとこちらのようなダッシュボードが表示されます。
加盟店の設定を入力する
加盟店のアプリケーショントークンとシークレットキーを入力する
左側のメニューから「アプリトークン」を開き「新規作成」をクリックします。
利用店舗を指定して作成するトークンが「ストアのアプリトークン」で、利用店舗を指定しない場合は「加盟店のアプリトークン」が作成されます。
今回は「加盟店のアプリトークン」を作ります。
アプリトークンの追加ページが表示された後は、何もせずにページ下部の「作成」をクリックします。
すると加盟店のアプリケーショントークンとシークレットが表示されます。
これをUnivapay設定に追加します。
Univapayの「シークレットを保存しました。」をクリックすると、以下のような確認ダイアログが出るので「はい」をクリックします。
ストアの設定を入力する
Univapayのサイトに戻ります。
ストアIDの入力は一旦後にして、先にストアトークンとシークレットの設定を行います。
テスト用ストアトークンとシークレットを入力する
改めて「アプリトークン」を開き「新規作成」をクリックします。
今度は「利用店舗を指定する」にチェックを入れて店舗を指定します。
店舗は1つしか表示されていないと思います。
モードについては、まず「テスト」を選択して、その後作成ボタンをクリックします。
先ほどと同様にトークンが表示されるので、Hintの「テスト用ストア設定」に入力していきます。
本番用ストアトークンとシークレットを入力する
続いて本番用のストアトークンとシークレットの入力をします。
アプリトークンの追加画面で「本番」を選択して「作成」をクリックします。
先ほどと同様にトークンとキーが表示されるので、本番用ストア設定に入力します。
ストアIDを入力する
続いてストアIDを入力します。
まず左側のメニューから「店舗」を選択し、店舗詳細画面を開きます。
「一般」タブの「全体設定」の箇所のうち、赤枠で囲ったIDがストアIDになります。
このストアIDをコピーしてHintの設定に貼り付けます。
リンクフォームの設定を入力する
リンクフォームの事前設定
左側メニューから「店舗」を選択し、店舗詳細画面を開きます。
店舗詳細画面の「決済フォーム」タブから「リンクフォーム設定」を開き「設定」を表示します。
この設定タブをまずは編集していきます。
このアプリトークンIDは、本番とテスト、どちらが選択されていても問題ありません。
下にスクロールして「お客様情報」の箇所を表示し「メールアドレスを必須にする」をオンにします。
それ以外の項目をオンにした場合、お客さんが見る決済画面に、入力必須のフォームが生成されます。
入力された情報はダッシュボードから確認できますが、Hintと紐づけることはできませんのでご注意ください。
さらにスクロールしてリダイレクトURLのうち「成功」の部分に、以下のURLを入力します。
https://あなたのサイトのURL/wp-json/wpm/v1/univapay/success
「あなたのサイトのURL」には、HintをインストールしたWordPressサイトのURLを入力してください。
例えばサイトのURLがhint.acの場合
https://hint.ac/wp-json/wpm/v1/univapay/success
と入力します。
ページ最下部にスクロールして「保存」をクリックします。
リンクフォームの設定をHintに反映
ページ最上部に移動して、今度は「設定」の右にある「URLコード」を開きます。
ここは何も変更せずに一番下までスクロールすると「URL」という項目があります。
ここのhttps://checkout.univapay.com/forms/より後で?appId=ey…の前の部分にある、赤枠で囲った文字列をコピーします。
HintのUnivapay設定画面に戻り、「リンクフォームのパスパラメータ」の箇所に貼り付けます。
文字の最初に/（スラッシュ）が入っていたり、文字列の末尾に？がくっついていないか確認します。
問題なければ保存をクリックします。
保存を押すと「設定を読み込めませんでした」という表示が出ますが、ページを再読み込みすると以下の画像の赤枠のような表示が出ているはずです。
もし表示されていない場合は、コピペミスなど設定に何らかの誤りがあるので、それぞれの設定項目が正しいかを再度確認してください。
ウェブフックの設定をする
最後にウェブフックの設定を行います。
ウェブフックの設定をすることで、Univapayの決済情報があなたのサイトを介してHintに通知されるようになります。
Univapayの管理画面の左側メニューから「ウェブフック」を選択し「新規作成」をクリックします。
ウェブフック追加画面が開くので、URLの箇所に、以下のURLを入力します。
https://あなたのサイトのURL/wp-json/wpm/v1/univapay/webhook
「あなたのサイトのURL」には、HintをインストールしたWordPressサイトのURLを入力してください。
例えばサイトのURLがhint.acの場合
https://hint.ac/wp-json/wpm/v1/univapay/webhook
と入力します。
トリガーについては全てにチェックを入れて、ページ下部の「作成」ボタンをクリックします。
これでUnivapayから決済などの通知があなたのサイトに飛んでくるようになりました。
これにてUnivapayの設定は完了です！