ロゴと店名を変える
店名の文字をロゴ画像にする
ヘッダーは既定で店舗設定の店名を文字で出します。ロゴは EC-CUBE の標準ブロックなので、すでに置かれています。次の手順で画像に差し替えます。
- 画像を [コンテンツ管理] → [ファイル管理] に上げる（
assets/img/など） - [ブロック管理] → ロゴ を開く（いまの中身が入っています）
imageの行を書き換えて [登録]
【抜粋】 開くとほかの行も入っています。下の 3 行だけを直してください。
{% set glass_logo = {
image: '',
image_dark: '',
height: 28,
alt: ''
} %}
height… 高さ（px）。横幅は画像の比率で決まります。28〜40 が収まります- ヘッダーの高さは変わりません。 狭い画面でははみ出さない大きさに縮みます
imageを空に戻すと、店名の文字に戻ります- ロゴを入れると、店名の下の小さな英字は表示されません
ダークでロゴが沈むとき
| ロゴ | 対処 |
|---|---|
| 白黒 | [CSS管理] に :root { --g-logo-filter: invert(1) brightness(1.6); } |
| 色付き | image_dark に明るい版を指定（反転では色が変わります） |
色の付いたロゴを反転させると、紫のマークが黄色になるなど別の色になります。ダークを使う店では、明るい版を用意して image_dark に指定してください。
image: asset('assets/img/logo.svg', 'user_data'),
image_dark: asset('assets/img/logo-light.svg', 'user_data'),
読み込まれる画像は、どの設定でも 1 枚です。 明暗が light / dark のときはサーバー側で決まり、auto（端末の設定に追従）のときは <picture> に任せるので、ブラウザは条件に合うほうだけを取りにいきます。
店名の下の小さな英字
既定で ONLINE STORE と入ります。[CSS管理] に 1 行書けば変えられます。
:root { --g-shop-sub: "SINCE 1998"; }
空（""）にすると表示しません。
店名が長くて見切れるとき
ヘッダーは「ロゴ・検索・アイコン」を 1 行に収めるため、店名の幅に上限があります（画面の 22%、1280px 以上では 30%）。超えた分は … になります。
長い店名はロゴ画像にするのがいちばん確実です（「店名の文字をロゴ画像にする」）。文字のまま小さくしたいときは [CSS管理] に次の行を書きます。
.ec-headerTitle__title h1,
.ec-headerTitle__title p { font-size: 1.125rem; }