WooCommerceのメールテンプレート編集 ~お客様名をフルネームで表示~

スタッフブログ

こんにちは、マークアップエンジニアの尾高です。

ショップサイトを構築する上でとても便利なWordPressプラグインであるWooCommerce。弊社のPreferのWebサイトもWooCommerceを使用しています。
しかし、デフォルトで送信されるメールに違和感があるので、テンプレートを編集しようということになりました。

そこで、WooCommerceやWordPressのカスタマイズ経験が無い私に、経験のために任せて頂きました。
その時調べて分かったことを書いていきます。

お客様名がファーストネームで表示されてしまう

送信されるメール本文には当然お客様名が表示されますが、デフォルトではファーストネームだけが表示されます。

たろう 様
ご利用いただきまして誠にありがとうございます。

このままでの使用は日本国内では違和感があるので、フルネームで表示されるようにカスタマイズしたいと思います。

こまり たろう 様
ご利用いただきまして誠にありがとうございます。

ファイルの編集作業の前に

WooCommerceのメールは、メール形式・注文の状況・注文管理画面での操作などに応じて、適用されるテンプレートが変わってきます。
この記事ではメール形式は「プレーンテキスト」、手動で操作する「インボイス」のメールテンプレートを例に挙げて説明します。

元々のテンプレートファイルは直接編集しない

プラグインなどのファイルは更新すると新しいものに置き換わるので、直接編集すると更新のたびに同じ編集を繰り返さなくてはいけません。
そこで、WooCommerceでは管理画面からテンプレートファイルをコピーして編集していきます。

テンプレートファイルのコピー

WooCommerceの「設定」→「メール」から編集したいテンプレートを選択します。

そしてページ下部の「テーマにファイルをコピー」をクリックしてコピーを作成します。

コンテンツタイプに応じて以下のディレクトリにテンプレートファイルがコピーされます。

コンテンツタイプ コピー先のディレクトリ
text/html wp-content/themes/テーマ名/woocommerce/emails/
text/plain wp-content/themes/テーマ名/woocommerce/emails/plain/

コピーを作成することは、ユーザー定義のテンプレートを作成するようなものです。
コピーがある場合はそのテンプレートを、ない場合はデフォルトのテンプレートを適用します。
つまり、テンプレートをリセットしたい場合は、コピーを削除してもう一度やり直せば良いだけです。

これで準備が出来ました。
上記の操作によってコピーされたファイルを編集しますが、まずは元々のソースコードがどうなっているのかを説明して、その後に編集方法を説明します。

テンプレートファイルの編集

この記事で例として編集するファイルはwp-content/themes/テーマ名/woocommerce/emails/plain/にコピーされたcustomer-invoice.phpです。

ソースコードの説明

echo sprintf( esc_html__( 'Hi %s,', 'woocommerce' ), esc_html( $order->get_billing_first_name() ) ) . "\n\n";

最初は関数の引数に関数が渡されたりしていて、とてもややこしく見えました。
しかし、それぞれの処理では難しいことはしていないので、一つずつ関数の説明をしていきます。

sprintf()は、第1引数のフォーマット文字列で指定されているフォーマットに、第2引数以降を当てはめて返す関数です。
最終的にこの関数の返り値をechoしてメールの本文にファーストネームを表示しています。

sprintf()の第1引数であるesc_html__( 'Hi %s,', 'woocommerce' )は、テキストを翻訳後にHTMLエスケープ処理をして返します。

詳しくは書きませんが、WordPressには多言語対応のためのファイルがあり、その中から対応する言語の文字列を取得してきます。Hi %sは以下のように日本語と対応しています。

翻訳ファイルのディレクトリ 翻訳ファイル名
wp-content/languages/plugins/ woocommerce-ja.po
msgid "Hi %s," // 元のフォーマット
msgstr "%s 様" // 翻訳後のフォーマット

そしてHTMLエスケープとは、HTMLとして認識されてしまう < などを HTMLエンティティに変換する処理です。

結果的にesc_html__( 'Hi %s,', 'woocommerce' )は、フォーマット文字列として%s 様を返します。
この次に説明する第2引数を%sの部分に当てはめるようになります。%は文字の位置、続くsは文字列型を意味しています。

sprintf()の第2引数であるesc_html( $order->get_billing_first_name() )は引数をHTMLエスケープした文字列を返します。

ここでは$order->get_billing_first_name()が引数として渡されています。
この$orderオブジェクトのget_billing_first_name()メソッドがファーストネームを取得しています。
つまりこの位置でフルネームを取得すれば、メールの本文にフルネームを表示させることができます。

esc_html( $order->get_billing_first_name() )は文字列として、例えばたろうを返します。

上記のことからecho sprintf()によって、%s 様%sの部分にたろうが入った文字列、「たろう 様」が表示されるのがデフォルトのソースコードです。

フルネームの取得

それでは目的であるフルネームの取得ですが、$orderというのは注文ごとの情報が入っているオブジェクト(WC_Order)で、お客様の情報や購入商品の情報などが入っています。
WC_Orderオブジェクトについてはこちら

このオブジェクトのget_billing_first_name()ではなく、同オブジェクトのget_formatted_billing_full_name()を使用します。
get_formatted_billing_full_name()はメソッド名から分かる通り、フルネームを取得します。

変更前

echo sprintf( esc_html__( 'Hi %s,', 'woocommerce' ), esc_html( $order->get_billing_first_name() ) ) . "\n\n";

変更後

echo sprintf( esc_html__( 'Hi %s,', 'woocommerce' ), esc_html( $order->get_formatted_billing_full_name() ) ) . "\n\n";

これでフルネームをメール本文の中に表示することが出来ました。

最後に

他にもWC_Orderのメソッドにはラストネームを取得するもの、決済方法を取得するものなど注文に関する様々な情報を取得するメソッドがあります。

今回の記事はフルネームを表示することにしか触れませんでしたが、実は同時に他の項目のカスタマイズも行っていたので、順番に記事にしていこうと思います。