WordPress Plugin 豊作フォーム
本プログラムは、Wordpress のプラグインとして機能します。
ワードプレスを使っていて、なかなかいい感じのフォームプラグインに出会えなかったので、作ってしまいました。
だいぶ荒削りではありますが、ある程度の知識を持っている方であれば、非常に使いやすいのではないか？と思っています。
比較的新しめのガラケー＋Ktai Style、スマホでも使えますし、さくらインターネットのレンタルサーバ、共有SSLでも使えます。
こちらの問い合わせに使ってます。
ほかにも複数使っていますが、サイトをお伝えできないのが残念です。
Version:2012022901 〜 Version:2012033001 の変更点
・確認画面に出力される登録ボタンに IDを振りました。 id="kaku-submit"
・確認画面のURLに #kaku を付与しました。
・登録完了画面のURL に #thanks を付与しました。
・PHP 5.0 以降（PHP 4 での検証はしていません。）
ワードプレスを使っていて、なかなかいい感じのフォームプラグインに出会えなかったので、作ってしまいました。
だいぶ荒削りではありますが、ある程度の知識を持っている方であれば、非常に使いやすいのではないか？と思っています。
比較的新しめのガラケー＋Ktai Style、スマホでも使えますし、さくらインターネットのレンタルサーバ、共有SSLでも使えます。
【実際の利用サイト】
テレホンカードこちらの問い合わせに使ってます。
ほかにも複数使っていますが、サイトをお伝えできないのが残念です。
【ダウンロード】
・hsk-form2012051101.zip ← こちらよりダウンロードを行ってください。【バージョンアップ】
2012/3/30Version:2012022901 〜 Version:2012033001 の変更点
・確認画面に出力される登録ボタンに IDを振りました。 id="kaku-submit"
・確認画面のURLに #kaku を付与しました。
・登録完了画面のURL に #thanks を付与しました。
【動作環境】
・Wordpress 3.0 以降）・PHP 5.0 以降（PHP 4 での検証はしていません。）
豊作フォーム概要
|
豊作フォーム（簡易ショップ）は、一つのワードプレス上に複数のフォーム（簡易ショップ）を構築出来るプラグインです。 簡易ショップは PayPal社の決済である「エクスプレスチェックアウト」に対応しています。ので、クレジットカード等の決済も行う事が可能です。 ※詳しくは PayPal社にてご確認下さい。 また、クッキーを受け入れる事の出来るガラケー（携帯端末）やスマートフォンにも対応しています。 ガラケーの場合は「Ktai Style」。スマートフォンの場合は「WPtouch」が必要です。 フォームの構築は、エクセルにてフォームのデータや商品データを作成し、そのデータをテキストファイルにコピーペーストする事により、フォームを形成します。 フォームのみでも機能しますが、簡易ショップ機能は、単品の商品販売をサポートします。 加えて、「キャンペーン値引き」「ペイパル(PayPal)決済」がサポートされます。 サンキューメールにも対応しており、メールを配信するタイミングは、 ・フォーム登録完了時（登録者向け、管理者向け） ・ペイパル決済完了時（登録者向け、管理者向け） となります。 データの格納は、WorePress プラグイン「Contact Form 7」を利用した際に利用する WorePress プラグイン「Contact Form to DB Extension」で管理されるデーターベースを使用します。この為、「Contact Form to DB Extension」がインストールされている必要があります。 ※豊作フォームの簡易ショップ機能は、買い物かご機能の無いショップシステムとお考え下さい。買い物かご機能が必要な方は、豊作カートをご検討下さいますようお願い申し上げます。 |
使用例
|
フォームのみ ・通常の問合せフォーム ・ちょっと凝ったアンケートフォーム 物販簡易ショップ ・様々な物販 ・セミナーの販売 ・チケットの販売 物販ダウンロード販売 ・音楽ダウンロード ・動画ダウンロード ・情報商材 ダウンロードの場合は、パスワードを設定した投稿ページや固定ページ（投稿）を設け、ペイパル決済完了時にパスワードの入ったメールを自動配信したり、手動配信したりする事で、ダウンロード販売が可能となります。 ※パスワードを設定した画面のパスワードは、定期的に変更される事をお勧めします。 ※在庫管理及び集中販売（希少チケット先着順販売等）は未対応です。 |
動作確認
|
組み合わせ１********************** WordPress 3.2.1 Contact Form to DB Extension 2.1 組み合わせ２********************** WordPress 3.3.1 Contact Form to DB Extension 2.2.5 組み合わせ３********************** WordPress 3.3.1 Contact Form to DB Extension 2.2.6 Ktai Style 2.0.5 WPtouch 1.9.38 さくらのレンタルサーバ共有SSLで動作 にて行いました。 |
インストール
|
１．フォルダ「hsk-form」を「/wp-content/plugins/」の中にFTP等で転送します。 ２．「Contact Form to DB Extension」のプラグインがインストールされていて有効になっているか？確認して下さい。無ければ、インストールし、有効化して下さい。 ３．プラグイン「豊作フォーム」を有効化して下さい。 ４．Apache が起動しているユーザーから、このディレクトリが読み書き出来るか確認し、読み書き出来るようにして下さい。 ５．豊作フォームは $_SESSION を使います。wp-config.php に session_start(); を書き加えて下さい。 ６．セキュリティ設定※超重要！！ サーバ上に転送されている hsk-form/hsk-form-ptn/htaccess.txt を .htaccess という名前に変更して下さい。 各種設定ファイルや、メール配信バックアップを読まれないようにする設定です。 こちらの設定が出来ない、解らない場合は、使用を控えていただいた方が安全です。 ※インストール作業等を有償で請け負う事も可能です。info@housaku.net までお問い合わせ下さい。 
[書き込み確認方法]WordPress ダッシュボード左画面「プラグイン」クリック 
「豊作フォーム」を選択し、「選択」をクリック
「ファイルを更新」ボタンが表示されていれば大丈夫です。 |
データ構造(Tsv)
|
フォームデータを形成する為の TSVデータです。 以下、hsk-form/hsk-form-ptn/tmp.xls の Tsv説明 タブに記載されています。
|
データ構造(Data)
|
フォームデータを形成を補足したり、商品や決済の情報を格納しておく為のデータです。 A列：項目、B列：値、C列：説明となっています。 以下、hsk-form/hsk-form-ptn/tmp.xls の Data説明 タブに記載されています。
|
フォームを設置する
豊作フォームはテキストで作成されたデータを元に、フォームを形成したりエラーチェック等を行ったりします。準備するファイルは以下になります。
| |||||||||||||||||||||||||
|
１．フォームの名前を決めます。今回は「sample」とします。（名前はアルファベットでお願いします。） ２．hsk-form/hsk-form-ptn/tmp.xls をダウンロードして開きます。（tmp.xls はこの場所に無くても大丈夫です。ダウンロード後は個の場所から削除して頂いても結構です。） ３．タブ「TSV説明」「Data説明」に従いフォームに必要なデータを作ります。タブ「sampleTsv」と「sampleData」があるので、そちらを参考にして下さい。 ※名称（フォームのネーム）には予約語があるので、form_**** などと、頭を form_ として下さい。 ４．データファイルを作成、配置します。 「sampleTsv.txt」「sampleData.txt」 を作成します。文字コードは「UTF-8」です。 「sampleTsv.txt」には、エクセルのタブ sampleTsv のデータをエクセルからコーピーして貼付けます。 「sampleData.txt」には エクセルのタブ sampleData のデータをエクセルからコーピーして貼付けます。 ※サンプルで準備されているそれぞれの一行目は説明行なので、コピーしないようにして貼付けて下さい。 出来上がったファイルを hsk-form/hsk-form-ptn/ に ftp 等で配置します。 ５．サンキューメールの雛形を作成します。 「sampleSent.txt」「sampleSentMb.txt」「sampleSentSp.txt」「sampleGet.txt」 PayPal 決済を利用する場合は以下も作成 「sampleSentPayPal.txt」「sampleSentPayPalMb.txt」「sampleSentPayPalSp.txt」「sampleGetPayPal.txt」 を作成します。文字コードは「UTF-8」です。 文章は自由に書いて下さい。 文章には差し入れが出来ます。文中に {} の中に Tsv の名称（フォームのネーム）を入れた差し替えようの記号をいれる事により、文字が置き換わります。 sampleTsv の場合は {form_syu}で「お問い合わせ種別」 {form_name}で「お名前」 {form_mail}で「メールアドレス」 等にそれぞれ置き換わります。 {date} は予約語となっており、メールを送信した時間が自動で入ります。 {data_mymailadd}は Data で記述した data_mymailadd のメールアドレスに自動で置き換わります。 ファイルの作成が完了したら hsk-form/hsk-form-ptn/ に配置します。 ※デザインを後から調整する場合、空の フォーム名Css.txt も同時に配置をしておいて下さい。 ６．サイトで公開 固定ページ（投稿）を作成し、フォームを配置したい箇所に [hsk_form ptn="フォーム名"] を記述します。今回は sample なので [hsk_form ptn="sample"] を記述します。 ７．フォームから登録があると、メールの配信とデータベースへの記録が開始されます。 | |||||||||||||||||||||||||
デザイン
|
hsk-form/hsk-form-ptn/ に フォーム名Css.txt を配置します。 それぞれ HTML に従いスタイルシートを作成して下さい。HTMLは以下のルールで出力されます。 フォーム表示時：商品系の HTML <div class='hsk-form-items'> <div class='hsk-form-item-name'>商品名タイトル</div> <div class='hsk-form-item-name-data'>商品名</div> <div class='hsk-form-item-price'>販売価格タイトル</div> <div class='hsk-form-item-price-data'>販売価格</div> <div class='hsk-form-item-disc'>商品説明タイトル</div> <div class='hsk-form-item-disc-data'>商品説明</div> </div> フォーム表示時：フォームの HTML <div class='hsk-form'> <form> 各種要素が入ります </form> </div> 各種要素は <div class="hsk-form-tsv-[<フォームの形状>]-[<TSVのクラス>]"> 各項目 </div> となります。[<TSVのクラス>]はTSVを編集した時の class になります。 各項目は TSVデータの <div class="hsk-form-tsv-nam">名前</div> <div class="hsk-form-tsv-null">必須</div> <div class="hsk-form-tsv-rei">入力例</div> <div class="hsk-form-tsv-cont">フォーム要素</div> <div class="hsk-form-tsv-tuzuku">続く文字</div> が入ります。 それぞれの表示順番を入れ替える場合は、 0=名前 1=必須 2=入力例 3=フォーム要素 4=続く文字 とし、 フォーム名Data.txt の data_parts_order にて番号指定をして下さい。 ※フォーム要素には TSVのID が付与されます。 ※hiddenn はフォーム要素のみ出力します。 ※submit,reset は、フォーム要素以外は div のみ出力されます。名前等が入っていても出力されません。 行をそのまま出力する場合は、div タグを付与せずに出力しますので、ご自身で div タグを フォーム名Tsv.txt に記述して下さい。 フォーム表示時：入力エラーの HTML <div class="hsk-form-err"> <ul> <li>エラー内容</li> 上記をループ </ul> </div> 確認表示時：商品系の HTML フォーム表示時と同じHTMLが出力されます。 ※キャンペーンコードが確認された場合「販売価格」の部分が以下になります。 <s>販売価格</s><br/> キャンペーンコード[<入力されたキャンペーンコード>]を確認しました。<br/> <販売価格タイトル><br/> <値引き後販売価格>になります。 確認画面時：確認表示部分の上 HTML フォーム名Data.txt data_kaku_ue_msg に値が入っていた場合、 <div class="hsk-form-data_kaku_ue_msg">確認画面上のメッセージ</div> 確認画面時：入力内容の確認 HTML <div class="hsk-form-kaku"> <div class="title">名称</div> <div class="value">入力内容</div> 上記をループ </div> 確認画面時：確認表示部分の下 HTML フォーム名Data.txt data_kaku_sita_msg に値が入っていた場合、 <div class="hsk-form-data_kaku_sita_msg">確認画面上のメッセージ</div> 確認画面時：送信ボタン HTML <div class="hsk-form-kakunin"> <form>・・・</form> </div> サンキュー画面時：サンキューメッセージ HTML <div class="hsk-form-thank-msg"> サンキューメッセージ(フォーム名Data の data_thank_msg) </div> サンキュー画面時：データベースエラー HTML <div class="hsk-form-errmsg"> エラーメッセージ(フォーム名Data の data_dberrorstr) </div> サンキュー画面時：ペイパルボタン HTML <div class="hsk-form-paypalbtn"> ペイパルボタン要素 </div> |
運用
|
データの閲覧について 登録されたデータを見るには、管理画面左メニュー「豊作フォーム」の下にある「フォームデータ」にアクセスして下さい。 「* select a form *」に利用していて、データが入っているフォーム名が一覧表示されます。見たいフォームを選択して下さい。 「Submitted」は無視をして下さい。 「commiteYMD」がフォームを送信された日時です 「formKey」がフォームを一意に特定する値です paypal等との照合にお使い下さい。 その他は フォーム名Tsv.txt で指定した「form nameネーム」部分がカラム（項目）名となります。 「豊作フォーム」の下にある「ショートコード作成」を利用すると、便利な抽出等が出来るようです。 このデータ閲覧部分は「Contact Form to DB Extension」の機能となります。詳細な使い方は Contact Form to DB Extension 等を参考にして下さいますようお願い申し上げます。 メールについて フォーム名Data.txt の data_sendmailbak に 1 を指定した場合、送信メールのデータがバックアップされます。何らかの障害でメールが配信されなかった場合は、hsk-form/hsk-form-ptn/bak/ の中を確認して下さい。 ※メールデータは溜まる一方です。定期的に削除して下さい。 |
共有SSL での利用
|
フォーム なので、SSL 配下での利用されたいと思います。 レンタルサーバの共有SSLでテストしてみました。 | |
|
さくらインターネットレンタルサーバ編 実際にやってみたサイトは http://www.telephonecard.info/ になります。テスト時はpayPal もテストしましたが、今はPayPalは外してあります。 １．共有SSLの設定 さくらインターネットで共有SSLを使える様にホストのセッティングをして下さい。 ２．共有SSLアクセス確認 設定後、共有SSL でアクセスが出来るか？確認を行う。 https://secure1151.sakura.ne.jp/www.telephonecard.info/ にアクセス。 ３．プラグイン有効化 プラグインを有効化します（既にしていれば不要） Contact Form 7 to Database Extension 2.2.6 インストール 有効化 豊作フォームインストール 有効化 ４．フォームを作成 上記説明にて作成して下さい。 ５．固定ページを３種類作成 フォーム用ページ https://secure1151.sakura.ne.jp/www.telephonecard.info/toi/ PayPal決済完了ページ https://secure1151.sakura.ne.jp/www.telephonecard.info/thanks/ PayPal決済キャンセルページ https://secure1151.sakura.ne.jp/www.telephonecard.info/cancel/ フォーム用ページにショートコードを記述 [hsk_form ptn="test"] ６．パーマリンク設定 カスタム構造:/%category%/%postname%/ ７．カスタムメニュー設定 自動で出てくるリンク先は http なので、問合せのリンク先をカスタムメニューで作成し直します。 https://secure1151.sakura.ne.jp/www.telephonecard.info/toi/ ※カスタムメニューに対応していないテーマもあるので、その場合はファイルに直書いてください。 ７．IEのセキュリティ警告問題 IEだとSSLじゃないファイルが含まれている等の警告が出ますので、どや！？共有SSLでWordPressプラグインContact Form 7を使う方法 等を参考に、問合せページ用の「page-ポスト番号.php」を作成いただき、インクルードしているファイル等を共有SSLから呼び出すようにして下さい。 ８．バックアップのメールに関して スグバックアップメールがFTPクライアントで見えない場合があります。この場合、FTPクライアントにてリフレッシュ等をしていただくと見える様になります。 ９．メール配信に関して さくらインターネットのレンタルサーバサービスで作成出来るメールアドレスで、送信アドレスを指定するのであれば問題ありませんが、別のメールアドレスを送信アドレスにあてる場合、DNSに spf 認証を書き入れないと、メールが配信されない事があります。ご確認下さい。 | |
その他
|
ライセンス 「豊作フォーム」のライセンスは GPL v2 とします。 著作権は「豊作プロジェクト株式会社」が保有します。ただし、ソースコードのいくつかの部分はWordPress の本体コードを流用したものがあり、その部分は WordPress 開発者が著作者です。 注意事項 「豊作フォーム」を利用した事によるあらゆるトラブルや障害に関して、豊作プロジェクトでは一切の責任を負いかねます。ご自身の判断にてご利用下さい。 |
