> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# フォントサイズの変更

> カスタムCSSを使用してUpcartのテキストサイズを調整します。

<div id="overview">
  # 概要
</div>

カート内の特定のテキスト要素（アップセルのタイトルやバリエーションのオプションなど）のフォントサイズを変更したい場合は、Upcartに組み込まれている **Custom CSS** エディターを使用して行えます。

***

<div id="step-1-inspect-the-element">
  ## ステップ1: 要素を検証する
</div>

1. ストアフロントを開き、Upcartドロワーを起動します。
2. フォントサイズを変更したい要素を右クリックします。
3. ブラウザのコンテキストメニューから**検証**を選択し、Developer Toolsを開きます。
4. HTMLパネルで要素の**クラス名**を見つけます。\
   例: `upcart-item-option`

<div id="step-2-access-the-custom-css-editor">
  ## ステップ2: カスタムCSSエディターにアクセスする
</div>

1. **Shopify管理画面 > アプリ > Upcart** に移動します
2. **Cart Editor** を開きます
3. **Settings** をクリックします
4. **Custom CSS** セクションを見つけます

<div id="step-3-write-your-custom-css">
  ## ステップ3: カスタムCSSを書く
</div>

CSS入力フィールドで:

1. ピリオド（`.`）に続けてクラス名を入力します
2. `{ font-size: 14px !important; }`（または希望のサイズ）を追加します

例:

```
.upcart-item-option {  
 font-size: 14px !important;  
}
```

💡 **注:** `.upcart-item-option` はV1のクラスです。V2では、対応するラインアイテムのバリエーションテキストは `.upcart-public-component-product-tile__variant` です。完全なセットについては、[V2 CSSセレクターライブラリ](/ja/upcart/upcart_css_selector_library_v2)を参照してください。

`!important` は、変更後もスタイルが上書きされてしまう場合にのみ使用してください。

<div id="step-4-save-and-test">
  ## ステップ4: 保存してテストする
</div>

1. Cart Editorで **Save** をクリックします
2. ストアフロントのページを更新します
3. カートドロワーを開き、フォントサイズが更新されたことを確認します

テキストが変わっていない場合は、クラス名を再確認するか、ブラウザの検証ツールを再度使用して、正しい要素をターゲットにしていることを確認してください。
