{"product_id":"2024-10-27","title":"【Dawn】Shopifyで商品詳細画面の商品説明欄でタブ切り替え型の表示を行う設定例","description":"\u003cp\u003eShopifyの商品詳細ページで、タブ切り替えの商品説明を掲載したい場合の設定例です。テーマ編集で商品情報セクションの中にタブ切り替えを行うJavascriptとcssを設定した上で、商品情報の「商品説明」内に対応フォーマットに沿ってHTMLタグを設定します。特にテーマの制限はありません。\u003c\/p\u003e\n\u003cp\u003e\u003cbr\u003e\u003c\/p\u003e\n\u003ch3\u003e商品詳細画面の商品説明欄で、タブ切り替え型の表示を行う設定例\u003c\/h3\u003e\n\u003cp\u003e\u003cimg alt=\"\" src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0733\/0381\/8491\/files\/2024-10-27_1.png?v=1766196018\" class=\"zoomable-image\" width=\"800\" height=\"640\" style=\"aspect-ratio: 1.25;\"\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cbr\u003e\u003c\/p\u003e\n\u003ch3\u003e【設定方法①】テーマ編集で「sections\/main-product.liquid」にコードを追加\u003c\/h3\u003e\n\u003cp\u003e\u003cimg alt=\"\" src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0733\/0381\/8491\/files\/2024-10-27_2.png?v=1766196018\" class=\"zoomable-image\" width=\"800\" height=\"640\" style=\"aspect-ratio: 1.25;\"\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cbr\u003e\u003c\/p\u003e\n\u003ch3\u003e【設定方法②】商品情報の商品説欄に必要なタグを含む要素をHTML編集モードで挿入\u003c\/h3\u003e\n\u003cp\u003e\u003cimg alt=\"\" src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0733\/0381\/8491\/files\/2024-10-27_3.png?v=1766196016\" class=\"zoomable-image\" width=\"800\" height=\"640\" style=\"aspect-ratio: 1.25;\"\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cbr\u003e\u003c\/p\u003e","brand":"STORE DOJO","offers":[{"title":"Default Title","offer_id":47782170460411,"sku":null,"price":0.0,"currency_code":"JPY","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0733\/0381\/8491\/files\/2024-10-27.png?v=1766196033","url":"https:\/\/store-dojo.com\/products\/2024-10-27","provider":"STORE DOJO","version":"1.0","type":"link"}