# Tradeテーマの特定ページの背景を画像にしたい

**URL:** <https://community.shopify.com/t/trade/382584>\
**Category:** 技術的なQ＆A\
**Created:** [December 24, 2024, 2:32am UTC](https://community.shopify.com/t/trade/382584 "2024-12-24T02:32:15Z")\
**Posts on this page:** 3\
**Page:** 1

## AI-generated summary

ユーザーがShopifyのTradeテーマで特定ページの背景を固定画像にしたいと質問しています。背景画像は固定され、テキストのみがスクロールする状態を希望しています。

**提案された解決方法:**
- 対象ページのテンプレートファイル(例:page.contact.liquid)を確認
- CSSファイル(theme.cssまたはstyle.css)に以下を追加:
  ```css
  body.template-ページテンプレート名 {
    background: url('背景画像のURL') no-repeat center center fixed;
    background-size: cover;
  }
  ```
- Shopify管理画面の「設定」>「ファイル」から背景画像をアップロードし、URLを取得

**現在の状況:**
ユーザーは提案された方法を試したものの、うまく再現できず、コラボレーターとしての直接的な支援を依頼しています。問題は未解決のまま継続中です。

<div class="post-metadata">

**Author:** ![curry313](https://avatars.discourse-cdn.com/v4/letter/c/13edae/32.png) [@curry313](https://community.shopify.com/u/curry313)\
**Post date:** [December 24, 2024, 2:32am UTC](https://community.shopify.com/t/trade/382584/1 "2024-12-24T02:32:15Z")

</div>

特定のページの背景を、こちらで指定した画像にしたいです。

背景画像は固定され、ページ内のテキストのみがスクロール出来る状態が理想です。

テーマはTradeを使用しています。

コード編集等、詳しくはありませんので、サンプルや貼り付け位置を添えて教えていただけば幸いです。

---

<div class="post-metadata">

**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:** [December 24, 2024, 5:04am UTC](https://community.shopify.com/t/trade/382584/2 "2024-12-24T05:04:20Z")

</div>

質問拝見しました。

以下やり方をご参考にしていただけますと幸いです。

### 特定ページのみに背景を固定するための手順1. **対象ページのテンプレートを確認**

- Shopify管理画面で「オンラインストア」\>「テーマ」\>「アクション」\>「コードを編集する」を開きます。
- 左側のファイルリストで、「templates」フォルダを探し、対象ページのテンプレートファイル（例：page.contact.liquid や page.custom.liquid）を確認します。

1. **CSSに特定ページ用のスタイルを追加**

```css
/* 特定ページの背景固定設定 */
body.template-ページテンプレート名 {
  background: url('背景画像のURL') no-repeat center center fixed;
  background-size: cover;
}

```

- template-ページテンプレート名 を対象ページのテンプレート名に置き換えます（例：template-page.contact など）。

- 「背景画像のURL」には、アップロードした画像のリンクを貼り付けます。

- **画像のアップロード**

以上で特定のページにきかせられるかと思いますのでご参考にしてください。

なにかご質問があれば、お気軽にご相談ください。  
お悩み解決できましたら、ベストアンサー、いいねいただけると励みになります。  
何卒よろしくお願いします。

株式会社フルバランス

---

<div class="post-metadata">

**Author:** ![curry313](https://avatars.discourse-cdn.com/v4/letter/c/13edae/32.png) [@curry313](https://community.shopify.com/u/curry313)\
**Post date:** [December 24, 2024, 6:57am UTC](https://community.shopify.com/t/trade/382584/3 "2024-12-24T06:57:34Z")

</div>

上記実行したつもりでしたが、上手く再現されませんでした。

コラボレーターとしてお手伝いいただくことは可能でしょうか？