商品カードのバッジのフォントや色をカスタマイズする方法

注目のリンク

1. Custom CSSに関するCompany XYZドキュメント
2. Theme Settingsのカスタマイズに関するShopifyドキュメント
3. テーマにカスタムCSSを追加する方法に関するShopifyドキュメント

役立つ動画

Shopify Academy動画：ストアをカスタマイズする

Shopify Academy動画：ストアをカスタマイズする

AlignのBody font設定を使用して、商品カードのバッジに使用するフォントを変更します。バッジの色だけを変更する場合は、Custom CSSに短いルールを追加します。

バッジのフォントを変更する

1. テーマエディターでTheme settingsを開きます。
2. Fontsを開き、Body fontを選択します。
3. 変更を保存し、セールまたは売り切れバッジが付いた商品カードをプレビューします。

Body fontは、バッジだけでなく、テーマ全体のその他の補助テキストにも適用されます。詳しくは、テーマ設定のカスタマイズに関するShopifyドキュメントをご覧ください。

バッジの色を変更する

1. Theme settings → Custom CSSに移動します。

2. 次のルールを追加し、例の色を希望する値に置き換えます。

   .card__badge {
     color: #1a1a1a;
   }

3. 保存し、ストアで使用している各バッジタイプを確認します。

Align固有の設定の詳細については、Custom CSSに関するCompany XYZドキュメントをご覧ください。詳しくは、テーマにCustom CSSを追加する方法に関するShopifyドキュメントをご覧ください。