背景をランダムに変えるプラグイン

ヘッダーの背景画像をランダムに変更するプラグインの紹介です。
お気づきかと思いますが、このブログの背景もこのプラグインを使用して訪れるたびに背景が変わります。
以下の内容はLabrid WPさんの解説を若干改変してお伝えします。

この「Automatic image rotator」はアクセスする度にサイトのイメージが変わり、訪問者に常に新鮮な印象を感じていただけ、導入が簡単な割に効果の高いカスタマイズです。

  • 先ずはA List Apart: Articles: Random Image Rotationの中段下にある、 PHP source right here と書いてあるリンクからソースコードをテキストエディターにコピーし、ファイル名を「rotate.php」にして保存します。
  • 次にサーバ上のテーマファイルのあるディレクトリの “images” フォルダ内にランダム表示用のディレクトリ “random” を作成し、ここに rotate.php を FTP ソフトで以下のようにアップロードします。
    /wp-content/themes/テーマ/images/random/rotate.php
  • ランダムに表示させたい画像を複数作成し、上記で作成したディレクトリ “random” にアップロードします。
    画像名はどんな名前でも構いません。
  • テーマのスタイルシートを編集し、背景画像を指定しているスタイルの背景画像ファイルへのパスを rotate.php へのパスにします。
    background:url(images/random/rotate.php) 0 50% no-repeat;

以上でアップした背景画像がランダムに表示されるはずです。

オマケ:
背景画像をセンターにかつスクロールせずに固定化する場合には

background-position: center top;
background-attachment: fixed;

をスタイルシートに書き加えます。

コメントフォームの設置、Contact Form 7

ワードプレスを知らない方には余り関係ないかもしれませんが、コメントフォームに日本製の素晴らしいプラグイン、Contact Form 7があります。
Contact Form 7の設置には多少の知識が必要ですが、慣れてしまえばかなり自由にカスタマイズが出来ます。

設置やカスタマイズの仕方は色々ありますが、ググってもなかなか良いカスタマイズ例が見つからないので、基本的な設置にプラスアルファしたものを紹介します。
先ずはフォームの設置例です。⇒設置例を見る

  1. <table><tbody><tr><td>
  2. <table bgcolor="#fff"><tbody><tr><td bgcolor="#b7d958">[text* your-name 25/25]<font color="#444"> お名前 (必須)</font>
  3. </td></tr><tr><td bgcolor="#b7d958">
  4. [email* your-email 25/25] <font color="#444">メールアドレス (必須)</font>
  5. </td></tr><tr><td bgcolor="#b7d958">
  6. [text your-subject 25/25] <font color="#444">件名(任意)</font>
  7. </td></tr><tr><td bgcolor="#b7d958">
  8. <font color="#444"><b>メッセージ本文 (必須)</b></font>
  9. </td></tr><tr><td align="center" bgcolor="#b7d958">
  10. [textarea* your-message 60x15]
  11. </td></tr><tr><td bgcolor="#b7d958">
  12. [file file-01 limit:512Kb]<font size="-1" color="#444">
  13. (任意:サイズ上限:512kb)</font></td></tr></tbody></table>
  14. <table align="center"><tbody><tr><td>
  15. [captchac captcha-01 bg:#bbbbbb size:l]</td><td><font size="-1">左の文字を半角英数字で入力して下さい。⇒</font></td><td>[captchar captcha-01 8/4]</td></tr><tr><td colspan="3" align="center">
  16. [submit "投稿内容を送信"]<br />※送信すると入力したメールに確認メールが届きます。</td></tr></tbody></table>
  17. </td></tr></tbody></table>

次にメール部分です。上記のカスタマイズをそのまま反映させてみます。

「宛先:」には
あなた宛のメールアドレスを記入。
「差出人:」には
「あなたのサイト名」メールフォーム:”[your-name] < [your-email]>
「件名:」には
[your-subject]

と記入します。

続いて「メッセージ本文:」です。

「あなたのサイト名」にメッセージがありました。

氏名:[your-name]
メール:[your-email]
件名:[your-subject]

メッセージ内容:
[your-message]

以上、確認して連絡または対応して下さい。

メール (2)はコメントして頂いた方へ確認メッセージを送る際などに使用します。

「宛先:」は
[your-email]
「差出人:」は
「あなたのサイト名」メールフォーム”< [your-email]>”
「件名:」は
送信確認メール:[your-subject]

などと記入します。

最後にメール (2)の「メッセージ本文:」です。

「あなたのサイト名」のメールフォームから
以下の内容が送信されました。

お名前:[your-name]
メール:[your-email]
件名:[your-subject]

メッセージ内容:
[your-message]

—————————————————————————–
メッセージありがとうございます。
ご質問・ご要望の場合は、後ほど対応させていただきます。

今後とも 「あなたのサイト名」をよろしくお願い致します。

※このメールに心当たりがない場合は、お手数ですが
  周囲の方にご確認の上、削除をお願い致します。

以上で設置は終了です。⇒設置例を確認する。

※サーバーによってはファイルの送信に対応してないものもあるので注意が必要です。
また、スパムメールの防止に使用するプラグイン「Really Simple CAPTCHA」がインストールされていないと、CAPTCHA機能が働きません。

いつも感心することですが、ワードプレスのプラグインやテーマを開発される方には本当に頭が下がります。
この場をお借りしてお礼申しあげます。