1. HOME > 
  2. ブログ・お知らせ > 
  3. WordPress > 
  4. WordPressのTrustFormをさくらサーバの共有SSLで使用

ライラックミモザのブログ・お知らせ

2012年10月25日

WordPressのTrustFormをさくらサーバの共有SSLで使用

WordPressのお問い合わせフォームプラグイン「TrustForm」+「さくらサーバの共有SSL」を使用した際の備忘録です。
お問い合わせフォームプラグインは、「ContactForm7」が有名だと思いますが、どうしても「確認画面」のあるお問い合わせフォームを使いたい!って、クライアントさんにいわれることがあります。
そんなとき、心強い味方になってくれるのが、「TrustForm」です。

参考にさせていただいたのは、「wordpressのコンタクトフォームをSSL化した際のメモ」です。こちらはContactForm7を使用されていますが、TrustFormもほぼ同じ手順でできました。ありがとうございます。

TrustFormを使用したお問い合わせページSSL化の主な手順

まず、さくらサーバの共有SSLを使用できるようにし、TrusrFormの設定、お問い合わせ用の固定ページを作成します。

お問い合わせページ用のテンプレート作成・表示

page.phpを複製して、お問い合わせページ用のテンプレートを作成します(contact.php等)。
ここで一度、お問い合わせページをプレビューし、ソースを表示します。
ソース内で、

<?php get_header(); ?>

<?php get_footer(); ?>

等テンプレートタグで読み込んでいる部分をコピーし、テンプレート内のheader.phpやfooter.phpの記述内容と置き換えます。
※その他の使用プラグインで読み込んでいる外部CSSや外部JSで、お問い合わせページに必要のないと思われるソースは、削除します。
※sidebar.phpは、記述内容に画像のない場合や、外部のCSSやJS等を読み込んでいない場合は、

<?php get_sidebar(); ?>

のままでOKです。

テンプレート内のソースを変更・置き換え

テンプレート内のリンク以外のソースで、http://example.comではじまっている部分を、すべてhttps://secure****.sakura.ne.jp/example.comに変更します。
そして、最初の1行に、

<?php echo '<?xml version=〜>'; ?>

を記述します。

お問い合わせページを表示・確認

お問い合わせページを表示します。https://secure****.sakura.ne.jp/example.com/contact/にアクセスして、IEはアドレスバーの右側、FFとChromeは左側、Safariはウィンドウ右上に、鍵マークが表示されていればOKです。

SSL化のポイント

参考にさせていただいた上記の記事にもありますが、SSL化のポイントは、リンク部分以外で、http://〜ではじまるアドレスがないようにすることです。
いろいろなプラグインを使用していると、意図せず、プラグインオリジナルのCSSやJSを外部から読み込んでいる場合も多くあるので、そのプラグインが、お問い合わせページに必要なのかを判断し、不要なソースは省き、テンプレート内の記述はできるだけすっきり簡潔にしたほうがスムーズだと思います。

ブログ・お知らせトップへ