Contact Form 7 1.7.5

Contact Form 7 / Download

Two fixes and one enhancement. 1) The SEO issue reported by Dexter has been fixed (I believe). 2) For wpautop() haters, hook function adding logic changed. 3) New include_blank option added to form tag of drop-down menus.

SEO issue

Dexter and some people told me that there seems be a SEO issue in Contact Form 7.

The “?wpcf7=json” code is used by Contact Form 7 only in AJAX submitting (POST) process. I wonder why Google indexed such URLs even now. Anyway, I worked around the issue.

Now Contact Form 7 doesn’t use “?wpcf7=json”, so I believe that kind of problem is fixed. But Google’s existing indexes are still there, I can’t do anything for that.

If you hate wpautop()

wpautop() is a WordPress’s built-in filter which automatically surrounds a paragraph with <p></p> tag. It’s useful and I like it, while I know some users hate it.

Some users remove the filter by commenting out a line in wp-includes/default-filters.php like below.

//add_filter('the_content', 'wpautop');

# Well, this is just an example. I don’t suggest that.

But when you are using Contact Form 7, this hack doesn’t work.

wpautop() is clever, but it doesn’t correctly treat form control elements. See this ticket. It’s a big issue for Contact Form 7. So Contact Form 7 removes original wpautop() filter, and adds patched one.

Due to this, if you want to remove wpautop() filtering, you need to hack codes in Contact Form 7 so far. It was sometimes confusing for the anti-autop hackers who didn’t know Contact Form 7 is doing such replacing.

In this release, I changed the replacing logic. Now it replaces wpautop() only if original wpautop() is registered on the filters array. So if you hate wpautop(), you can remove it by just editting wp-includes/default-filters.php.

New include_blank option for drop-down menu

If include_blank option is set, drop-down menu inserts a blank item “—” into the top of it. So this tag

[select your-menu "---" "a" "b" "c"]

and this tag

[select your-menu include_blank "a" "b" "c"]

have the same semantics.

I recommend you to use this option because it seems that some browsers don’t submit first option’s value in a menu, even if they shows the first one as selected by default. See also the HTML spec.

Learning WP_Query

# 書きかけ

WordPress のいわゆる「ループ」の実体である WP_Query クラスの扱いについてよく知ろう、という趣旨です。

クエリ変数のリストを書き込むと、WP_Query により生成される SQL リクエストとその結果、さらに各種 $is_* 変数の状態を見ることができる学習用プラグイン Learning WP_Query を作りました。

ダウンロード: こちら

使い方:

1. zip を展開してlearning-wp-query フォルダごと wp-content/plugins ディレクトリへコピー、Learning WP_Query プラグインを有効化
2. [Options] – [Learning WP_Query] に管理ページが追加されているのでそこに移動
3. いろいろいじってボタンを押したりしていると要領がつかめると思います

Contact Form 7 tag syntax

This page explains the syntax of Contact Form 7‘s tag. If you are not familiar with basic usage of Contact Form 7, please see the plugin’s homepage.

Contact Form 7 uses “tags” for two purposes; one is for form content and the other is for mail (to, from and subject fields and message body). Tags for form content has different syntax from ones for mail.

Example of a tag used in form content:
[email* your-email 60/200 "your-email@example.com"]

Example of a tag used in mail:
[your-email]

As seen in above examples, a tag for form content generally has more complicated syntax and many options. In the rest of this page, I write mainly about the syntax and options of form content tag.

Sandbox 1.2

昨年の12月25日に Sandbox テーマのバージョン 1.2 がリリースされています。2006年8月にこのブログで紹介したときには 0.6.1 でしたがあれから大きく変わってきています。

Sandbox 1.0 での大きな変更として、それまで“スキン”と呼ばれていたスタイルシート部分の扱われ方が変わりました。1.0 以前は Sandbox のディレクトリの中にスタイルシートが置かれ、Sandbox の専用管理画面でどのスタイルシートを使用するか選択するようになっていましたが、1.0 以降ではスタイルシートを Sandbox ディレクトリの外に置くようになっています。

例えば Sandbox とそれをベースにした Sandbox Kubrick をインストールする場合、構成は

wp-content/
  |
  +- themes/
    |
    +- sandbox/
    +- sandbox-kubrick/

のように、Sandbox と Sandbox Kubrick が並列になります。

配置した後、管理画面のテーマ選択ページで Sandbox Kubrick を選択します(Sandbox を選択するのではないことに注意)。このように Sandbox は「置いておくだけ」ですが、Sandbox ベースのテーマを使う場合には必ず Sandbox も配置しておく必要があります。

Sandbox ベースのテーマ (Sandbox Kubrick) の中身はどのようになっているかというと、意味のあるファイルは style.css だけです。PHP のテンプレートなどは含まれていません。これだけでどうして Sandbox とつながるのか不思議になりますが、カギは style.css のコメント部にある TEMPLATE の行にあります。

/*
THEME NAME: Sandbox Kubrick
THEME URI: http://wordpress.org/
DESCRIPTION: Modification of the default WordPress theme, Kubrick, originally designed by Michael Heilemann.
AUTHOR: Andy Skelton
AUTHOR URI: http://andy.wordpress.com/
TEMPLATE: sandbox
*/

TEMPLATE 行が指定されていると、WordPress はテンプレート (index.php や single.php など) を指定されたテーマから継承して使うようになります。

このテンプレート継承の機能はこれまでほとんど使われることがありませんでしたが、実は現在のテーマシステムが導入された WordPress 1.5 の時点ですでに用意されていました。

Contact Form 7 のメッセージを日本語にする (Contact Form 7 tips)

このページは Contact Form 7 プラグインの使い方について紹介しています。

デフォルト (英語) 設定の WordPress で使った場合、Contact Form 7 はそのメッセージを英語で表示します。

このメッセージを日本語に変えたい場合、Contact Form 7 のソースコードに変更を加える必要はありません。Contact Form 7 には日本語の言語ファイルが同梱されているので、日本語設定の WordPress で使う場合には自動的に日本語でメッセージを表示するように作られています。

WordPress の言語を日本語に設定するには、WordPress のディレクトリにある wp-config.php を以下のように変更します。

define ('WPLANG', '');
↓
define ('WPLANG', 'ja');

WordPress の日本語公式サイトで配布している日本語版 WordPress をインストールされている場合ははじめから上の設定が行われていますので、特に何も手を加えることなく日本語で使用できます。

もし、日本語の表現を自分の好みに合わせて変更したいと思ったなら、Contact Form 7 の日本語言語ファイルは contact-form-7/languages/wpcf7-ja.po にあるので、このファイルを poEdit などのツールを使用して編集して使ってください。

Contact Form 7 1.7.4 (select+ and checkbox+ removed)

I released Contact Form 7 1.7.4. You can download it from WordPress.org’s repository.

In this version, I removed two tag types, select+ and checkbox+, because they were confusing. If you have been using those tags and checkbox, you’ll be needed to edit them manually after upgrading. I’m sorry for the inconvenience.

If you are using select+ tag, replace it with select and add multiple option. Here is an example:

Before: [select+ your-menu “ウインダム” “ミクラス” “アギラ”]

After: [select your-menu multiple “ウインダム” “ミクラス” “アギラ”]

If you are using checkbox+ tag, replace it with checkbox. Here is an example:

Before: [checkbox+ your-checkbox “ウインダム” “ミクラス” “アギラ”]

After: [checkbox your-checkbox “ウインダム” “ミクラス” “アギラ”]

If you are using checkbox tag (exclusive checkbox), add exclusive option. Here is an example:

Before: [checkbox your-checkbox “ウインダム” “ミクラス” “アギラ”]

After: [checkbox your-checkbox exclusive “ウインダム” “ミクラス” “アギラ”]

Custom layout for checkboxes and radio buttons (Contact Form 7 tips)

This is a tip for Contact Form 7 plugin.

In default, a tag of checkbox type (checkbox and checkbox+) and radio button type (radio) are rendered as inline, like

You can reverse checkbox-label order by using label-first option with those tags.

A replaced HTML source of checkbox in default case looks like below (I added line breaks for better viewing):

<span style="position: relative;">
 <span class="wpcf7-checkbox">
  <span class="wpcf7-list-item">
   <input name="your-checkbox" value="ウインダム" 
     class="exclusive" type="checkbox">&nbsp;
   <span class="wpcf7-list-item-label">ウインダム</span>
  </span>
  <span class="wpcf7-list-item">
   <input name="your-checkbox" value="ミクラス" 
     class="exclusive" type="checkbox">&nbsp;
   <span class="wpcf7-list-item-label">ミクラス</span>
  </span>
  <span class="wpcf7-list-item">
   <input name="your-checkbox" value="アギラ" 
     class="exclusive" type="checkbox">&nbsp;
   <span class="wpcf7-list-item-label">アギラ</span>
  </span>
 </span>
</span>

You can customize the layout with CSS trick.

If you want block layout instead of original inline one,

span.wpcf7-list-item { display: block; }

If you want table layout,

span.wpcf7-list-item { display: table-row; }
span.wpcf7-list-item * { display: table-cell; }

(combined with label-first option)

Notice: { display: table* } properties are not supported in Internet Explorer (even in IE7). I hate IE.

Contact Form 7 1.7.3

I released Contact Form 7 1.7.3 last week. I added two options for dropdown menu, checkboxes and radio buttons. default: option allows you to set initially selected or checked items. label-first option is for checkboxes and radio buttons; this makes checkbox-label order reverse.

See also: Contact Form 7 1.7 (The introduction of select+, checkbox, checkbox+ and radio typed tags)

Setting default with default: option

For example, this tag:

[checkbox your-checkbox default:2 "ウインダム" "ミクラス" "アギラ"]

makes the second item “ミクラス” checked initially. The integer following default: is the position in the order of items. 1 is the first one.

If you want to make two or more items checked, joint integers with _ (underbar) as:

[checkbox your-checkbox default:1_3 "ウインダム" "ミクラス" "アギラ"]

Changing checkbox-label order with label-first option

By default, checkbox and radio button are put first, and a label last.

By adding label-first option to checkbox and radio button type tags, you can reverse them.

[checkbox your-checkbox label-first "ウインダム" "ミクラス" "アギラ"]

Contact Form 7 1.7

日本語はこちら。(in Japanese)

Contact Form 7 1.7 is now available. New types of form tag (select+, checkbox, checkbox+ and radio) are newly added.

Update (2007/12/30): select+ and checkbox+ were removed since 1.7.4 release. See the release note.

Contact Form 7 1.6.1

I released Contact Form 7 1.6.1. Now you can place your contact form in sidebar widgets. Norwegian and Turkish translations are included.