カスタムCSSを使用してストアをカスタマイズ
プログラミングのバックグラウンドを持つユーザー向けに、SHOPLINEはカスタムCSSを使用してストアの外観をカスタマイズする便利な方法を提供しています。この機能を使用すると、グローバルテーマとコンポーネントレベルの両方でスタイルを調整でき、ストアのデザインやサードパーティーアプリのスタイルに細かい制御が可能です。
| Note: カスタムCSSはチェックアウトページではサポートされていません。 |
カスタムCSSの制限事項
次の制限事項に注意してくださいカスタムCSS:
- コンポーネントレベルのCSS: At-rulesはサポートされていません。
- グローバルテーマCSS: 次のat-rulesのみ許可されています:@color-profile、@font-face、@counter-style、@font-feature-values、@font-palette-values、@keyframes、@page、@property。
- URLの使用: ドメインhttps://*.myshopline.comからのみURLが許可されています。
-
文字数制限:
- グローバルテーマのカスタムCSS:1,500文字
- コンポーネントレベルのカスタムCSS:500文字
カスタムCSSの追加方法
次の手順に従って、カスタムCSSを実装してください:
- 管理画面で、オンラインストア>デザインに移動します。 現在のテーマモジュール内のデザインボタンをクリックします。
- テーマエディターで、カスタムCSSモジュールを見つけます:
-
グローバルテーマ: パレットアイコンをクリックしてテーマ設定にアクセスし、カスタムCSSを選択します。
-
コンポーネントレベル: カスタマイズしたい特定のコンポーネントを選択し、カスタムCSSモジュールを見つけます。
-
グローバルテーマ: パレットアイコンをクリックしてテーマ設定にアクセスし、カスタムCSSを選択します。
- カスタムCSSコードを入力し、保存をクリックして変更を適用します。
この記事はAIを使用して翻訳されており、不正確な情報が含まれている可能性があります。最も正確な情報については、元の英語版を参照してください。