# 商品ページのボタンの色を変えたい **URL:** \ **Category:** 技術的なQ＆A\ **Tags:** css\ **Created:** [March 28, 2023, 12:09am UTC](https://community.shopify.com/t/topic/203363 "2023-03-28T00:09:33Z")\ **Posts on this page:** 2\ **Page:** 1 ## AI-generated summary 主題・要望: Dawnテーマの商品ページで、オプションボタンと購入ボタンを左→右に黒→グレーのグラデーションにし、ボタン横幅を長くしたい。デフォルト設定で可能か、不可なら追加するコードと設置場所の具体例を求めている。 最新の更新: 回答側は「コード編集 > main-product.liquid にコードを追加」で対応可能と案内。スクリーンショットが添付されている。 不明点: 投稿内のコードブロックは空で、実際の記述内容は提示されていない。画像の内容も本文だけでは確認できない。 技術的背景: DawnはShopify公式テーマ。main-product.liquidは商品ページのテンプレートで、CSS（グラデーションや幅指定）の編集が想定される。 現状・結論: 具体的なコードや手順が不足しており未解決。次のアクションは、実際のCSS/HTML記述の共有、もしくはスクリーンショットの内容に基づく詳細手順の提示が必要。
**Author:** ![mira0](https://avatars.discourse-cdn.com/v4/letter/m/e68b1a/32.png) [@mira0](https://community.shopify.com/u/mira0)\ **Post date:** [March 28, 2023, 12:09am UTC](https://community.shopify.com/t/topic/203363/1 "2023-03-28T00:09:33Z")
テーマDawnにて、商品ページのオプションボタンと、購入ボタンのカラーを、左から右にかけて黒→グレーというようにグラデーションにしたいのと、ボタンの横幅を長く設定したいです。デフォルトの設定でも可能でしょうか？もしコード編集など必要でしたら、どこのファイルに何のコードを足したら良いのかなどの例を教えていただきたいです。 ---
**Author:** ![Anonymous\_44fbe07fc59d9ccaacd70575fd5a5155](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/anonymous_44fbe07fc59d9ccaacd70575fd5a5155/32/194200_2.png) [@Anonymous\_44fbe07fc59d9ccaacd70575fd5a5155](https://community.shopify.com/u/Anonymous_44fbe07fc59d9ccaacd70575fd5a5155)\ **Post date:** [March 29, 2023, 8:48am UTC](https://community.shopify.com/t/topic/203363/2 "2023-03-29T08:48:44Z")
Ju6 様 お世話になっております。 フルバランスの道家と申します。 ご質問確認しました。 以下でお試しいただけますと幸いです。 **コード編集** \> **main-product.liquid** \> 以下のコードを加えてみてください。 ```markup ``` ![スクリーンショット 2023-03-29 17.46.53.png](https://canada1.discourse-cdn.com/shopifyforum/original/3X/4/1/4181b2d1e0a2c258b50dbe9e60a96aaea01184fd.png) なにかヒントになれば幸いです。 私たちの励みにもなりますので、 お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。 フルバランス 道家