指定箇所(class)へスタイル(CSS)を追加

指定箇所(class)へスタイル(CSS)を追加の画像
指定箇所(class)へスタイル(CSS)を追加の画像
指定箇所(class)へスタイル(CSS)を追加の画像

機能詳細や設定方法
[スタイル追加に関するご注意]
標準で提供する機能及び設定ではないため、今後のバージョンアップなどでスタイル(CSS)が正常に適用されない可能性がございます。
ご了承のうえでスタイルの追加を行ってください。
イージーマイショップで生成されるページやパーツは、各所に細かくclassを充てております。
後述の手順で対象のclassに対してスタイル(CSS)を追加することで、文字サイズなどの変更が可能です。

classによるスタイル(CSS)の指定

※商品一覧ページや詳細ページなどの代表的なスタイル例はこちらをご確認ください。
スタイル(CSS)を指定する箇所で右クリックし、「検証」や「開発者ツールで確認する」より開発者ツールを開きます。
開発者ツールの開き方 開発者ツール開いた後
対象のclass(class=""の""で囲まれた箇所)を使用し、スタイル(CSS)を作成します。
classを抽出
指定方法 指定例
.【class名】{
【変更内容】: 【数値などの変更内容】;
}
.item_name{
font-size: 20px;
}
サイトにCSS(スタイルシート)を追加するを参照に、店長ナビ(店舗様管理画面)にスタイル(CSS)を登録します。
スタイル(CSS)の追加後は、実際のショップページでスタイル(CSS)の反映をご確認ください。
※Ctrl+F5キー(Macの場合:Shift+Command+R)でページを更新後にご確認ください。

スタイル(CSS)が反映されない場合

スタイル(CSS)が反映されない要因として以下可能性がございます。
  • ページのキャッシュの影響
    ⇒ページのキャッシュ(2回目以降の表示を早くするために端末内に一時的に保存されている情報)が影響し、スタイル(CSS)が反映されていない可能性がございます。
    以下手順でキャッシュの削除やページの更新をお試しください。
    ・ブラウザの更新またはCtrl+F5キー(Macの場合:Shift+Command+R)でページを更新する
    ・ブラウザを再起動する
    ・スマートフォンなど別の端末や別ブラウザで確認する
  • スタイル(CSS)の優先度
    ⇒基本的にスタイル(CSS)は後に読み込む(design.cssの末の方)ものほど優先されます。
    design.cssの最下部にスタイル(CSS)を追加し、再度お試しください。
    また、階層指定などでより細かな範囲で指定したスタイル(CSS)程優先されます。
    階層指定はclass間に半角スペースを入れて指定してください。
    例) 商品フレーム内の商品名
    .item_data_block .item_name{ …
※このヘルプは、2025年4月に作成された内容です。仕様変更等により設定方法が異なる場合がございます。
ご不明な場合は右下の「この機能について問い合わせる」よりご連絡ください。
サポート営業日
※このオープンガイドは、【イージーマイショップ】で作られています♪ 
Copyright ©イージーマイショップ - オープンガイド All Rights Reserved.