📘 公式リファレンス📦 リファレンス/オブジェクト中級

color_scheme オブジェクト

テーマ設定で定義したカラースキームにアクセスするオブジェクト。カラースキームの ID とそれに紐付く設定値（色・テキストなど）を取得できる。

用途

セクションやブロックで色のバリエーション（ライト / ダークなど）を切り替えるとき、管理画面から選んだカラースキームの詳細設定を Liquid テンプレートで参照する。

設置場所

セクション内で `{{ section.settings.color_scheme.id }}` または `{{ section.settings.color_scheme.settings }}` の形で参照する。また、グローバル設定に含まれる場合は `{{ settings.card_color_scheme.id }}` のように直接参照する。

注意点

color_scheme オブジェクトを直接参照した場合、デフォルトではカラースキームの ID 文字列のみが返される。詳細な色情報や設定値にアクセスするには、`color_scheme.settings` プロパティを通じて個別の値を取得する必要がある。テーマ設定で `color_scheme_group` タイプの設定が定義されていることが前提。

タグ:color-schemesettingstheme-configurationobject

仕様

64 行 / json

{
  "access": {
    "global": false,
    "parents": [],
    "template": []
  },
  "deprecated": false,
  "deprecation_reason": "",
  "description": "&gt; Tip:\n&gt; To learn about color scheme groups in themes, refer to [`color_scheme_group` setting](/themes/architecture/settings/input-settings#color_scheme_group).",
  "properties": [
    {
      "deprecated": false,
      "deprecation_reason": "",
      "description": "",
      "examples": [],
      "return_type": [
        {
          "type": "string",
          "name": "",
          "description": "",
          "array_value": ""
        }
      ],
      "summary": "The ID of the color_scheme",
      "name": "id"
    },
    {
      "deprecated": false,
      "deprecation_reason": "",
      "description": "",
      "examples": [],
      "return_type": [
        {
          "type": "untyped",
          "name": "",
          "description": "",
          "array_value": ""
        }
      ],
      "summary": "The [settings](https://shopify.dev/docs/themes/architecture/settings/input-settings#color_scheme_group) of the color_scheme.",
      "name": "settings"
    }
  ],
  "summary": "A color_scheme from a [`color_scheme` setting](/themes/architecture/settings/input-settings#color_scheme).",
  "name": "color_scheme",
  "examples": [
    {
      "name": "Referencing color_scheme settings directly",
      "description": "When a color_scheme setting is referenced directly, the color scheme ID is returned.\n",
      "syntax": "",
      "path": "/",
      "raw_liquid": "{{ settings.card_color_scheme }}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    }
  ],
  "json_data": {
    "path": "/",
    "handle": "settings.card_color_scheme",
    "data_from_file": ""
  },
  "return_type": []
}

出典・ライセンス

Source:: Shopify/theme-liquid-docs/data/objects.json
Repository:: https://github.com/Shopify/theme-liquid-docs
License:: MIT

このコードは Shopify 著作の MIT ライセンスソースです。原本の著作権は Shopify が保有します。日本語訳は ALSEL によるものです。

color_scheme オブジェクト

仕様

出典・ライセンス

関連項目

content_for_header オブジェクト

metaobjects オブジェクト

additional_checkout_buttons オブジェクト

canonical_url オブジェクト

content_for_index オブジェクト

content_for_additional_checkout_buttons オブジェクト