【Shopify】Order Printer (legacy)の請求書をインボイス制度用にカスタマイズする

Eyes, JAPAN Blog > 【Shopify】Order Printer (legacy)の請求書をインボイス制度用にカスタマイズする

開発

2024/12/6

【Shopify】Order Printer (legacy)の請求書をインボイス制度用にカスタマイズする

ishii

今回は、Shopifyの請求書を2023年10月からスタートしたインボイス制度に対応するため、公式から出ているアプリ「Order Printer (legacy)」を使って税額を別途表示するようカスタマイズした方法について紹介します。

環境
– テンプレート: Dawn バージョン2.4.0
– アプリ: Order Printer (legacy) ※2024年12月の最新バージョンに対応
カスタマイズが難しい場合はインボイス制度対応のテンプレートを提供している他社の有料アプリがおすすめです。

Order Printer (legacy) について

– 無料のShopify公式アプリ
– アプリ及び初期のコードは英語ですが日本語化するためのコードが有志により公開されています。参考：Shopifyアプリ「Order Printer」で納品書を日本語仕様にカスタマイズ
– LiquidというShopify独自のプログラミング言語が使われています。

ちなみに、2024年12月現在「Order Printer」をインストールしているとアプリの新バージョン「Shopify Order Printer」への移行に関するアラートが出ますが、ドキュメントが足りていないこともありアプリの評価が低いため旧OrderPrinterを使用しています。

– Shopify Order Printer に移行する
このアプリの新バージョン、Shopify Order Printerが登場しました。

追加実装したもの
– 自社の登録番号（当記事では割愛）
– 10%・8%それぞれの対象となる対価の総額及び適用税率
→ 税率の表示: 10%と8%の税率を商品ごとに表示する
– 10%・8%それぞれの消費税額等
→ 税額の計算: 税込価格から税抜価格と税額を計算する

※2021年4月からの消費税総額表示の義務化によりShopifyの設定で税込で登録するよう設定しているため内税表記にしています。

出力結果サンプル

コード全体
※2024年12月動作確認済み。変数が変わっていることもあるので利用には注意してください。

<h3 style="margin: 0 0 1em 0;">ご注文内容</h3>

<table class="table-tabular" style="margin: 0 0 1.5em 0;">
    <thead>
        <tr>
            <th>商 品</th>
            <th style="text-align: center; white-space: nowrap;">消費税率</th>
            <th style="text-align: center; white-space: nowrap;">単価</th>
            <th style="text-align: center; white-space: nowrap;">数 量</th>
            <th style="text-align: center; white-space: nowrap;">価 格</th>
        </tr>
    </thead>
    <tbody>
        {% for line_item in line_items %}
        <tr>
            <td><b>{{ line_item.title }}</b></td>

            <!--消費税率-->
            <td style="text-align: center; white-space: nowrap;">
                {% if line_item.tax_lines %}
                {% for tax_line in line_item.tax_lines %}
                {% if tax_line.price == 0 %}
                <!--税額に0が入っていた場合"-"を表示-->
                -
                {% assign line_item_tax = 0 %}

                <!--=====税率対象=====-->
                {% else %}
                <!--税率：{{ tax_line.rate }} = 0.1 or 0.08 を"%"表示にする-->
                {% assign tax_rate = tax_line.rate | times: 100 %}
                {{ tax_rate }}%<br />
                {% endif %}
                {% endfor %}
                {% else %}
                <!--税額が登録されていない場合の空欄の処理-->
                -
                {% assign line_item_tax = 0 %}
                {% endif %}
            </td>

            <!--単価-->
            <td style="text-align: center;">
                {{ line_item.price | money }}<br>
            </td>

            <!--数量-->
            <td style="text-align: center;">{{ line_item.quantity }} </td>

            <!--価格-->
            <td style="text-align: center;">
                {{ line_item.line_price | money }} <br>

                <!--=====集計：消費税対象額=====-->

                <!--8%対象商品のみ集計-->
                {% if tax_rate == 8 %}
                {% assign total_taxable_light  = total_taxable_light | plus: line_item.line_price %}
                <!--10%対象商品のみ集計 ※elseだと{{tax_line.price}}に0が入っていた場合に集計されてしまうので注意-->
                {% elsif tax_rate == 10 %}
                {% assign total_taxable  = total_taxable | plus: line_item.line_price %}
                {% endif %}
                <!--=====-->
            </td>

        </tr>
        {% endfor %}
    </tbody>
</table>


<h3 style="margin: 0 0 1em 0;">お支払い詳細</h3>

<table class="table-tabular" style="margin: 0 0 1.5em 0;">
    <tr>
        <td>
            小計
        </td>
        <td style="width: 35%;">
            {{ subtotal_price | money }}<br>
        </td>
    </tr>
    {% for discount in discounts %}
    <tr>
        <td>割引き "{{ discount.code }}"</td>
        <td>{{ discount.savings | money }}</td>
    </tr>
    {% endfor %}
    {% if shipping_address %}
    <tr>
        <td>
            送 料
        </td>
        <td>
            {{ shipping_price | money }}<br>
            <!--10%対象のif文用-->
            {% assign tax_rate = 10 %}
        </td>
    </tr>
    {% endif %}

    {% if tax_rate == 10 %}
    <tr>
        <td>
            <div style="display: flex;justify-content: space-between;">
                <!-- 10%対象商品 + 10%税込送料 -->
                <div>内10%対象額&nbsp;&nbsp;&nbsp;{{ total_taxable | plus:shipping_price | money }}<br>
                </div>
                <div>消費税</div>
            </div>
        </td>
        <td>
            ({{ total_taxable | plus:shipping_price | times: 0.1 | divided_by: 1.1 | money }})
        </td>
    </tr>

    {% elsif tax_rate == 8 %}
    <tr>
        <td>
            <div style="display: flex;justify-content: space-between;">
                <div>内8%対象額&nbsp;&nbsp;&nbsp;{{ total_taxable_light | money }}</div>
                <div>消費税</div>
            </div>
        </td>
        <td>
            ({{ total_taxable_light | times: 0.08 | divided_by: 1.08 | money }})
        </td>
    </tr>
    {% endif %}

    <tr style="background-color: #efefef;">
        <td><strong>合 計（税 込）</strong></td>
        <td><strong>{{ total_price | money }}</strong></td>
    </tr>
    {% if total_paid != total_price %}
    <tr>
        <td><strong>お支払い合計:</strong></td>
        <td><strong>{{ total_paid | money }}</strong></td>
    </tr>
    <tr>
        <td><strong>お支払い残高:</strong></td>
        <td><strong>{{ total_price | minus: total_paid | money }}</strong></td>
    </tr>
    {% endif %}
</table>

<table class="table-tabular" style="margin: 0 0 1.5em 0;">
    <tr>
        <td>お支払い方法</td>
        <td style="width: 35%;">
            {% assign unique_gateways = '' %}

            {% for gateway in gateways %}
            {% unless unique_gateways contains gateway %}
            {% if unique_gateways != '' %}
            {% assign unique_gateways = unique_gateways | append: ', ' %}
            {% endif %}
            {% assign unique_gateways = unique_gateways | append: gateway %}
            {% endunless %}
            {% endfor %}

            {{ unique_gateways | replace: 'shopify_payments', 'クレジットカード' | replace: 'Cash on Delivery (COD)', '代金引換' | replace: 'あと払い_ペイディ_', 'あと払い (ペイディ)' | replace: '["' ,'' | replace: '"' ,'' | replace: ']' ,''}}
        </td>
    </tr>
</table>

適用税率の表示

税率の変数 {{ tax_line.rate }} はそのままだと小数点表示なので×100で”%”表示にします。
変数一覧：ShopifyのOrder Printerで利用可能な変数

{% for tax_line in tax_lines %}
{% assign tax_rate = tax_line.rate | times: 100 %}
{% assign tax_no = tax_line.rate | plus: 1 %}
{{ tax_rate }}%
{% endfor %}

軽減税率

軽減税率を適用する商品は「税の優先適用と免税」を参考に設定しています。

税の優先適用が必要な商品の手動コレクションを作成する
管理画面[商品管理] > [コレクション]
コレクションに税金を優先適用する
管理画面[設定] > [税金と関税]
対象商品に作成したコレクションを登録する
管理画面[商品管理]

<!--税率が8%の場合は別途集計する-->
{% if tax_rate == 8 %}
{% assign total_taxable_light  = total_taxable_light | plus: line_item.line_price %}
{% endif %}

価格表示

Shopifyの仕様上 {{ money }} を付けないと桁数が100倍で表示されます。

{{ line_item.price }}<!-- 189800 -->
{{ line_item.price | money }}<!-- ¥1,898 -->

番外編：外税表記にするため税込価格から税抜価格を計算する場合
変数に格納されているのは税込価格のため税抜は計算して出す必要があります。

<!-- 税抜価格 = 税込価格 * 税率(0.1) / 税率+1(1.1) | 四捨五入 -->
{{ line_item.line_price | divided_by: 100 | divided_by: 1.1 | round | times: 100 | money }}
<!--{{ money }}を付けないと100倍で出力され、小数点以下四捨五入の位置が異なってしまうため×100、÷100で調整している-->

– 1列商品の価格(税込)：{{ line_item.price | money }}
– 合計(税込)：{{ total_price | money }}
– 送料(税込)：{{ shipping_price }}
※商品合計の税額が表示される変数 {{ tax_line.price | money }} {{ total_tax | money }} がありますが、単価や送料の税額が表示される変数はありませんでした。

Liquidの出力を切り捨て/切り上げるフィルター：Liquid filters: math filters
– round：四捨五入 {{ 2.7 | round }} → 3
– floor：切り捨て {{ 1.2 | floor }} → 1
– ceil：切り上げ {{ 1.2 | ceil }} → 2

この方法を実装する場合は「単価」の項目は非表示にする必要があります。
Sopifyでは基本的に四捨五入が採用されているため、税抜の小数点以下の数字によっては算出した税抜単価と合計価格に差が生じることがあります。

例）元値
税込単価：¥1,259 × 数量：2 = 税込価格：¥2,518
税抜を計算
– 税込単価：¥1,259 ÷ 1.1 = ¥1,144.54 → 四捨五入：¥1,145
– 税抜単価：¥1,145 × 2 = 税抜価格：¥2,290
– 税抜価格¥2,290 に ×1.1 した税込価格：¥2,519
差額
実際の税込価格：¥2,518 と 1円差が生じます。

消費税対象額

それぞれ10%・8%対象の価格を集計し、そこから消費税額を計算しています。

Liquidの四則演算
– plus…足し算、minus…引き算、times…掛け算、divided_by…割り算

掛け算、割り算が先ではなく、先頭から順番に計算されます。
例）200 = 1800 – 1700 × 2

<!--=====集計：消費税対象額=====-->
<!--8%対象商品のみ集計-->
{% if tax_rate == 8 %}
{% assign total_taxable_light  = total_taxable_light | plus: line_item.line_price %}
<!--10%対象商品のみ集計-->
{% elsif tax_rate == 10 %}
{% assign total_taxable  = total_taxable | plus: line_item.line_price %}
{% endif %}
<!--=====-->

〜〜〜〜〜〜〜〜〜〜〜〜〜

{% if tax_rate == 10 %}
<tr>
    <td>
        <div style="display: flex;justify-content: space-between;">
            <!-- 10%対象商品 + 10%税込送料 -->
            <div>内10%対象額&nbsp;&nbsp;&nbsp;{{ total_taxable | plus:shipping_price | money }}<br>
            </div>
            <div>消費税</div>
        </div>
    </td>
    <td>
        ({{ total_taxable | plus:shipping_price | times: 0.1 | divided_by: 1.1 | money }})
    </td>
</tr>

{% elsif tax_rate == 8 %}
<tr>
    <td>
        <div style="display: flex;justify-content: space-between;">
            <div>内8%対象額&nbsp;&nbsp;&nbsp;{{ total_taxable_light | money }}</div>
            <div>消費税</div>
        </div>
    </td>
    <td>
        ({{ total_taxable_light | times: 0.08 | divided_by: 1.08 | money }})
    </td>
</tr>
{% endif %}

その他：お支払い方法

Dawnテーマでお支払い方法を表示する変数 {{ gateways }} を使うと不要な記号[””]や重複表示が発生する場合があります。公式からの解決策が発表されていないためコードを直接修正しています。

{{ gateways | replace: 'shopify_payments', 'クレジットカード' | replace: 'Cash on Delivery (COD)', '代金引換' | replace: 'あと払い_ペイディ_', 'あと払い (ペイディ)'}}

修正後

{% assign unique_gateways = '' %}

{% for gateway in gateways %}
{% unless unique_gateways contains gateway %}
{% if unique_gateways != '' %}
{% assign unique_gateways = unique_gateways | append: ', ' %}
{% endif %}
{% assign unique_gateways = unique_gateways | append: gateway %}
{% endunless %}
{% endfor %}

{{ unique_gateways | replace: 'shopify_payments', 'クレジットカード' | replace: 'Cash on Delivery (COD)', '代金引換' | replace: 'あと払い_ペイディ_', 'あと払い (ペイディ)' | replace: '["' ,'' | replace: '"' ,'' | replace: ']' ,''}}