EC-CUBEで「特定商取引法に基づく表記」ページの行間を調節する（4系）

ビフォーアフター

調節方法

1. 管理画面のコンテンツ管理＞ページ管理にアクセスし、「特定商取引に関する法律に基づく表記」をクリックする。
2. 行間を調節したいddにスタイルを指定する。（今回は「お支払方法」と「返品・交換について」のddにstyle="line-height: 170%;"を指定しています。）

編集後、「登録」ボタンを押すのを忘れないように！

{% block main %}
    <div class="ec-role">
        <div class="ec-pageHeader">
            <h1> {{ '特定商取引法に基づく表記'|trans }}</h1>
        </div>
        <div class="ec-off1Grid">
            <div class="ec-off1Grid__cell">
                <div class="ec-borderedDefs">
                    <dl>
                        <dt>
                            <label class="ec-label">販売業者</label>
                        </dt>
                        <dd>EC-CUBE</dd>
                    </dl>
                    <dl>
                        <dt>
                            <label class="ec-label">代表責任者</label>
                        </dt>
                        <dd>イーシー太郎
                        </dd>
                    </dl>
                    <dl>
                        <dt>
                            <label class="ec-label">所在地</label>
                        </dt>
                        <dd>
                            大阪府大阪市〇〇××丁目×番×号<br>
                            建物名000号室
                        </dd>
                    </dl>
                    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                    <dl>
                        <dt>
                            <label class="ec-label">お支払方法</label>
                        </dt>
                        <dd style="line-height: 170%;">　★styleを指定★
                            クレジットカード<br>
                            銀行振り込み<br>
                            コンビニ払い<br>
                        </dd>
                    </dl>

                    <dl>
                        <dt>
                            <label class="ec-label">返品・交換について</label>
                        </dt>
                        <dd style="line-height: 170%;">　★styleを指定★
                            ご注文の商品が「イメージと違った」「サイズが合わない」「注文をまちがえた」などのお客様都合による理由の場合は、当社返品可能条件を満たしていれば「返品」にて承ります。<br>
                            その場合、返送などにかかる送料、手数料は、全てお客様負担となりますので、ご了承ください。<br>
                        </dd>
                    </dl>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

ほかのページの行間も変えたい場合

ほかのページの行間も同じ手順で変更できます。
例えば、「当サイトについて」ページの行間を調節したい場合は
　1. コンテンツ管理＞ページ管理の「当サイトについて」をクリック
　2. 行間を調節したいddのスタイルを指定する。

以下の例では、「当サイトについて」ページのメッセージ欄の行間を調節しています。

{% block main %}

<div class="ec-role">
    <div class="ec-pageHeader">
        <h1>{{ '当サイトについて'|trans }}</h1>
    </div>
    <div class="ec-off1Grid">
        <div class="ec-off1Grid__cell">
            <div class="ec-borderedDefs">
                {% if BaseInfo.shop_name|default is not empty %}
                    <dl id="help_about_box__shop_name">
                        <dt>
                            <label class="ec-label">{{ '店名'|trans }}</label>
                        </dt>
                        <dd>{{ BaseInfo.shop_name }}</dd>
                    </dl>
                {% endif %}
                {% if BaseInfo.company_name|default is not empty %}
                    <dl id="help_about_box__company_name">
                        <dt>
                            <label class="ec-label">{{ '会社名'|trans }}</label>
                        </dt>
                        <dd>{{ BaseInfo.company_name }}</dd>
                    </dl>
                {% endif %}

                ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

                {% if BaseInfo.good_traded|default is not empty %}
                    <dl id="help_about_box__good_traded">
                        <dt>
                            <label class="ec-label">{{ '取り扱い商品'|trans }}</label>
                        </dt>
                        <dd>{{ BaseInfo.good_traded|nl2br }}</dd>
                    </dl>
                {% endif %}

                {% if BaseInfo.message|default is not empty %}
                    <dl id="help_about_box__message">
                        <dt>
                            <label class="ec-label">{{ 'メッセージ'|trans }}</label>
                        </dt>
                        <dd style="line-height: 170%;">{{ BaseInfo.message|nl2br }}</dd>　★styleを指定★
                    </dl>
                {% endif %}
            </div>

        </div>
    </div>
</div>

{% endblock %}

調節後