レシートをカスタマイズする
レシートの見た目を変更するには、3つの方法があります。必要に応じて最も簡単な方法を選んでください — ほとんどの店舗では最初の方法だけで十分です。
3つのカスタマイズ方法
1. 別のテンプレートを選ぶ
ギャラリーにある既成のテンプレートを使用します。コードは一切不要です。 最適な用途:レイアウトの変更、価格の非表示、A4インボイス、キッチンチケット。
2. AIに調整を依頼する
テンプレートをChatGPTまたはClaudeに貼り付けて、変更したい内容を説明します。コーディングスキルは不要です — 自然な言葉で説明するだけです。最適な用途:文言、色、配置などの小さな調整。
3. 直接編集する
アプリ内エディターでテンプレートを直接変更できます。最適な用途:細かい調整が必要な場合、またはHTMLの知識がある場合。
3つの方法はすべて同じ場所から始めます:WP Admin → POS → テンプレート。ページは2つの部分に分かれています — 上部の使用中のテンプレート(現在使用しているもの)と、下部のテンプレートギャラリー(スターターライブラリ)。
オプション 1 — 別のテンプレートを選ぶ
最も簡単な方法で、ほとんどのニーズに対応できます。
テンプレートギャラリーを開く
WP Admin で POS → テンプレート に移動します。マイテンプレート を過ぎてテンプレートギャラリーセクションまでスクロールしてください。ここがスターターライブラリです。
閲覧とプレビュー
カテゴリ(レシート、請求書、ギフトレシート、キッチンチケット、見積書 / 発注書)、フォーマット(ブラウザ印刷用 HTML、サーマルプリンター用 ESC/POS)、または方向(左から右、右から左)でフィルタリングできます。カードのサムネイル、またはフッターのプレビューリンクをクリックすると、店舗の実データを使ったライブプレビューが表示されます。
使用する
カード上のテンプレートを使用をクリックします。WCPOS が編集可能なコピーを作成し、ページ上部のマイテンプレートに追加します。行の有効トグルをオンにするとレシートで使用が開始されます。行のグリップハンドルをドラッグして並べ替えることもできます。複数のテンプレートを同時に有効にでき、レジでキャッシャーが選択できます。
テンプレートを使用をクリックすると、常に新しいコピーが作成されます。元のギャラリーテンプレートはそのまま残るため、いつでも別の出発点を選び直すことができます。複数のレシートテンプレートが有効になっている場合、レシート画面にドロップダウンが表示され、キャッシャーがその場で切り替えることができます。
同梱テンプレート
| テンプレート | 形式 | 用途 |
|---|---|---|
| 標準レシート | HTML | デフォルト — ロゴ、商品、合計、支払い。ほとんどの店舗に対応 |
| 標準レシート(RTL) | HTML | 標準と同内容で、アラビア語/ヘブライ語/ペルシア語/ウルドゥー語向けにミラー表示 |
| ミニマル/モダン | HTML | 標準と同じ情報を、より少ない縦幅にまとめたレイアウト |
| 詳細レシート | HTML | 完全な税務インボイス — SKU列、単価、税率別内訳、住所を含む |
| ギフトレシート | HTML | 商品のみ — 価格非表示。ギフトメッセージと返品ポリシーを含む |
| インボイス | HTML | A4/レター用フルページインボイス。未払い注文には「支払い方法」パネルを追加 |
| 納品書 | HTML | 倉庫用の付属書類 — 商品+数量、配送先、価格なし |
| 見積書 | HTML | 価格と条件を記載した販売前書類 — 支払いセクションなし |
| ナローレシート | HTML | 狭い用紙またはHTML対応サーマルプリンター向けの等幅レシート |
| シンプルサーマルレシート(58mm) | 感熱 | すっきりとした58mmサーマルレイアウト |
| シンプル感熱レシート(80mm) | 感熱 | 最も一般的な80mm感熱レイアウト |
| シンプル感熱レシート 80mm(RTL) | 感熱 | 80mm用のRTL対応版。アラビア語コードページ対応のプリンターが必要 |
| 詳細感熱レシート(58mm / 80mm) | 感熱 | 税内訳、住所、返金、支払い、利用規約、バーコードを追加 |
| キッチンチケット | 感熱 | 商品のみ、大きなフォント、価格なし — 調理場向け |
同梱テンプレートの多くは店舗の税設定に自動的に対応します — 税込店舗では税込価格と「税込」の行が表示され、税抜店舗では税抜価格に税額が別行として追加されます。詳細テンプレートファミリーは設定に関わらず、常に完全な税内訳を表示します。
WP Overnightの請求書・納品書テンプレート
サイトでWP OvernightのPDF Invoices & Packing Slips for WooCommerceも使用している場合、WCPOSはマイテンプレートに2つの追加テンプレートを自動的に追加します:
| テンプレート | 形式 | 用途 |
|---|---|---|
| 請求書(WP Overnight) | サーバーレンダリングHTML | WP Overnightで設定された請求書ドキュメントをPOS注文に使用 |
| 納品書(WP Overnight) | サーバーレンダリングHTML | WP Overnightで設定された納品書ドキュメントをPOS注文に使用 |
これらのテンプレートはWCPOS内蔵の請求書・納品書レイアウトをコピーするものではありません。WP OvernightにPOS注文のドキュメントレンダリングを依頼するため、既存の請求書番号、ブランディング、法的・税務フィールド、WP Overnightのテンプレートカスタマイズがオンライン注文と店舗注文で一貫して維持されます。
WP Overnight プラグインが有効な場合にのみ表示されます。出力は個別の PDF ダウンロードではなく、WCPOS の印刷画面に HTML として表示されます。ドキュメントはサーバー側でレンダリングされるため、これらのテンプレートを印刷するには POS がサイトに接続されている必要があります。オフライン印刷には、同梱の HTML テンプレートまたはサーマルテンプレートをご利用ください。
店舗ごとの割り当て
複数の店舗がある場合(Pro)、各店舗はサイト全体のデフォルトとは別に、独自のテンプレート選択と並び順を設定できます。近くのカフェには別のロゴと住所を入れた小型サーマルレシートを、倉庫には納品書を、本店には標準レシートを設定するなど、すべて同じテンプレートギャラリーから選択できます。
WP Admin → POS → 店舗 から設定します。設定したい店舗を開くと、店舗の編集ページにレシートテンプレートセクションがあり、*「店舗固有のレシートテンプレート」*トグルが表示されます:
- トグルオフ (デフォルト) — 店舗はメインの POS → テンプレートページからサイト全体のテンプレートリストを継承します。
- トグルオン — 店舗はサイト全体のデフォルトとは別に、独自のテンプレート選択と並び順を持ちます。ドラッグハンドルによる並べ替えも同様に機能します。
同じ店舗の編集ページには、各店舗のレターヘッドも設定できます(ロゴ、住所、連絡先、およびレシートメッセージブロック — 結辞、返品ポリシー、フッター)。同梱テンプレートはこれらの店舗ごとのフィールドを参照するため、1つの「標準レシート」テンプレートで店舗ごとに異なるブランディングを表示できます。
レジ担当者が店舗にサインインすると、その店舗の有効なテンプレートのみがレシートのドロップダウンに表示されます。
WP Admin のテンプレートページがサイト全体のデフォルトを設定します。店舗ごとの上書き機能は、1つのテンプレート(例:標準レシート)で店舗ごとに異なるブランディングを表示したり、特定の店舗だけ別のレイアウトを使用したりするためにあります。すべての店舗で同じテンプレートを使用する場合は、店舗ごとの割り当てを空のままにすれば、サイト全体のデフォルトが適用されます。
オプション 2 — AI に調整を依頼する
ギャラリーがほぼ理想通りでも少し違う場合、AIアシスタントが数分で修正してくれます。HTMLの知識は不要です。
テンプレートをコピーする
WP Admin → POS → テンプレートでベースにしたいテンプレートを開き、エディタをクリックして左側のテキストをすべて選択します(Ctrl/Cmd + A)。コピーしてください。
変更内容を説明する
AIに変更内容を具体的に伝えます。効果的な例:
- 「店舗名を大きくして中央揃えにしてください。」
- 「下部にイタリック体でお礼のメッセージを追加してください。」
- 「顧客名を非表示にして、代わりに注文番号の下に電話番号を追加してください。」
- 「バーコードを返品ページへのリンク付きQRコードに変更してください。」
- 「店舗名の下に『1987年創業の家族経営店』というタグラインを追加してください。」
AIが修正されたテンプレートを返します。
貼り付ける
AIの応答をコピーします。WCPOSテンプレートエディターに戻り、すべてを選択(Ctrl/Cmd + A)して新しいバージョンを貼り付け、更新をクリックします。右側のプレビューが更新されるので、結果を確認できます。意図した表示と異なる場合は、問題点を説明してAIに修正を依頼してください。
ギャラリーでテンプレートを使用をクリックするたびに、新しい編集可能なコピーが作成されるため、オリジナルは安全に保たれます。試行錯誤する場合は、同じギャラリーテンプレートを複数回使用できます。コピーの名前を変更し*(Receipt v1、Receipt v2)*、決定するまで切り替えてご利用ください。
{{store.name}} や {{order.number}} のような部分は、実際のデータのプレースホルダーです。AIはこれらを理解するため、ユーザーが把握する必要はありません。利用可能なすべてのプレースホルダーについては、レシートデータリファレンスを参照してください。
オプション3 — 手動で編集する
HTMLの知識がある場合(または開発者と作業している場合)は、アプリ内エディターでテンプレートを直接編集できます。エディターには、ライブプレビュー、シンタックスハイライト、検索可能なフィールドピッカー、元に戻す/やり直し、検索と置換の機能があります。
エンジンを選択してください:
- HTMLテンプレート — Mustache形式の
{{variable}}プレースホルダーを使用します。クライアントサイドでレンダリングされ、オフラインでも動作します。ほとんどの店舗に推奨。 - サーマルテンプレート — ESC/POSサーマルプリンター用のXML。同じテンプレートで画面プレビューとプリンター出力の両方を生成します。
- レシートデータリファレンス — 使用可能なすべてのプレースホルダーをセクション別にまとめています。
以前テーマ内のPHPファイル(yourtheme/woocommerce-pos/receipt.php)でレシートをオーバーライドしていた場合、その方法は引き続き使用できます。ギャラリーではレガシーPHPテンプレートとして表示され、新しいロジックレスエンジンおよびサーマルエンジンと並んで利用可能です。WP Overnight連携もサーバーレンダリングパスを使用します。これはサードパーティのドキュメントAPIがサーバー上でHTMLをレンダリングするためです。新しいカスタマイズにはギャラリーまたはアプリ内エディターの使用を推奨します。オフラインで動作し、ライブプレビューが可能で、サーバーへの往復が不要です。
よくあるカスタマイズ
よく寄せられる質問への簡単な回答です。
店舗ロゴを追加するには?
ロゴはテンプレートではなく、店舗設定から取得されます。WP Admin → POS → 設定 → 店舗に移動し、店舗を編集してロゴをアップロードしてください。ロゴを表示するすべてのバンドルテンプレートで自動的に使用されます。
テンプレート内のロゴの表示位置を変更したい場合は、テンプレートを編集して {{#store.logo}}<img src="{{store.logo}}" ...>{{/store.logo}} ブロックを目的の位置に移動してください。
フッターのテキスト(例:「お買い上げありがとうございます!」)を変更するには?
2つの方法があります:
- 最も簡単 — WP Admin → POS → 設定 → 店舗 → 店舗詳細 → レシートフッター / 個人メモですべてのレシートに一度設定するだけです。バンドルテンプレートは自動的に反映されます。フッターが未設定の場合は、*「お買い上げありがとうございます!」*のようなデフォルトメッセージが表示されます。
- 単一のテンプレートで — テンプレートを編集してフッターテキストを直接置き換えます。
{{store.personal_notes}}またはお礼メッセージの行を探してください。
店舗名の下にキャッチフレーズやスローガンを追加するには?
テンプレートを編集して {{store.name}} の下に行を追加します:
<div style="font-style: italic; color: #6b7280;">Family-owned since 1987</div>
サーマルテンプレートの場合:
<align mode="center"><text>Family-owned since 1987</text></align>
(ギフトレシート用に)価格を非表示にするには?
ギャラリーのギフトレシートカードでテンプレートを使用をクリックします。価格や合計がすべて非表示になり、商品、SKU、属性、ギフトメッセージのみが表示されます。編集は不要です。
価格なしのレシートを独自に作成する場合は、任意のテンプレートをコピーして {{...total...}}、{{...price...}}、{{#totals}}...{{/totals}} ブロックを削除します。
バーコードをQRコードに変更するには?
テンプレート内の <barcode> 要素を見つけて、 type 属性を変更します:
<!-- Default: Code 128 barcode of the order number -->
<barcode type="code128">{{order.number}}</barcode>
<!-- Switch to a QR code -->
<barcode type="qrcode">{{order.number}}</barcode>
<!-- Or encode something else, like a returns URL -->
<barcode type="qrcode">https://example.com/returns?order={{order.number}}</barcode>
同じ <barcode> 構文はHTMLテンプレートとサーマルテンプレートの両方で使用できます。その他のサポートされている種類には ean13、 ean8、 upca、 pdf417、および bwip-js がサポートするすべての形式。
特定のプリンターに別のテンプレートを送信するには?
POS アプリで設定 → 印刷ルーティングを開きます。有効なテンプレートごとにプリンターのドロップダウンが表示されます。使用するプリンターを選択するか、自動のままにしてください。
- 自動はテンプレートとプリンターを自動的にマッチングします。サーマルテンプレートはサーマルプリンターに、HTML テンプレートはシステムの印刷ダイアログに送信されます。
- 特定のプリンターを指定すると、自動設定を上書きして、そのテンプレートを常に指定したプリンターに送信します。
- 印刷時に、レシート画面のプリンタードロップダウンから上記の設定を上書きすることもできます。
ルーティングはデバイスごとに保存されるため、iPad やコンピューターごとに個別の設定が可能です。
編集してもレシートに古いバージョンが表示される
テンプレート編集画面で WordPress の更新ボタンをクリックしてください。エディターは自動保存されないため、変更は更新を実行した時点でのみ保存されます。
レガシー PHP テンプレートの場合、エディター内のプレビューには入力中の内容ではなく最後に保存されたバージョンが表示されます。まず保存してから、プレビューを更新してください。
プレビューが空白、または「POS注文が見つかりません」と表示される
これはレガシー PHP テンプレートでのみ発生します。プレビューには実際の注文データが必要です。POS で注文を1件処理してください($0 のテスト売上でも可)。それだけでプレビューが正常に表示されるようになります。
ロジックレス(HTML)テンプレートとサーマルテンプレートには常にサンプルデータが用意されているため、新規店舗でも問題なくプレビューできます。
ぐちゃぐちゃにしてしまった — 最初からやり直すには?
3つのセーフティネット:
- エディターには元に戻す(Ctrl/Cmd + Z)機能があり、セッション中の変更を取り消せます。
- 保存するたびに WordPress のリビジョンが作成されます。編集画面でリビジョンを開くと、過去のバージョンを比較・復元できます。
- ギャラリーテンプレートから作成した場合は、テンプレート一覧でコピーの削除をクリックし、同じギャラリーカードのテンプレートを使用を再度クリックしてください。未編集の新しいコピーが作成されます。
サポートが必要な場合
- テンプレートエディターが読み込まれない、または保存内容が反映されない。
- レシートが一方のデバイスでは正常に印刷されるが、別のデバイスでは印刷されない。
- 特定の国(イタリア、ブラジル、スペインなど)向けの法定レイアウトが必要な場合 — これらは通常 WCPOS Pro または各国向けの統合機能で対応しています。
- カスタマイズを試みているが、AI では思いどおりの結果が得られない。
サポートチケットを作成し、作業中のテンプレートを貼り付けてください。対応に必要な情報がすべて揃います。