# サイド配置メニュー

> **学べること**
>
> * サイド配置メニューレイアウトを使ってホームページを作成する方法
> * 背景、メニューリンク、およびスタイルのカスタマイズ方法

***

### サイド配置メニューについて

この **サイド配置メニュー** レイアウトはロゴとナビゲーションを画面の左側に縦方向に配置します。このレイアウトはクリーンでミニマルであり、背景やブランドイメージに視覚的な優先度を与えます。

***

### 設定方法

#### 1. クリーンなキャンバスから始める

1. テーマエディタで、既存のセクションをすべて削除します。
2. 次だけを残します `ページキャンバス` セクション。

2\. サイド配置メニューを追加する

1. クリック： **セクションを追加 > サイド配置メニュー**
2. ナビゲーションが画面の左側に表示されます。
3. を選択します **Shopify メニュー** でナビゲーションリンクを接続します。

{% hint style="info" %}
💡 メニューがまだない場合は、 **Shopify 管理画面 > オンラインストア > ナビゲーション** で作成してください。
{% endhint %}

***

### メニューのカスタマイズ

追加後、次の項目を設定できます：

#### メニューの内容と動作

* **メニューを選択**：Shopify ナビゲーションからメニューを接続する
* **ソーシャルメディアアイコン**：X、TikTok、Threads などのアイコンを追加するには「ソーシャルメディアリンクを追加」をクリック
* **ログインリンクを表示**：を表示するか `上`, `下`、または完全に非表示にすることを選択

#### ロゴとリンクのスタイリング

* **ロゴの配置**：左または右
* **メニューの配置**：メニュー内のリンクを左または右に揃える
* **リンクの文字色 / ホバー色**
* **リンク背景色（ホバー時）**
* **リンクのフォントサイズと垂直間隔**

#### ビジュアル効果

* **ハイライト効果を無効にする**：ホバーハイライトスタイルをオフにします
* **ナビスケーリングを有効にする**：メニュー項目の拡大アニメーションを有効にします

***

### 背景のカスタマイズ

サイド配置メニューセクションには組み込みの背景オプションが含まれているため、もはや `ダイナミック背景` セクションを使用する必要はありません。テーマの新しいバージョンでは、 `ダイナミック背景` はこのレイアウトでは非推奨です。

#### 背景スタイルのオプション：

* **単色**：デスクトップとモバイル用の色を設定
* **画像**：デスクトップとモバイル用に異なる画像をアップロード
* **スライドショー**：最大3つの回転する画像スライドを追加
* **ビデオ**：ビデオ背景をアップロード（注：低電力モードのiPhoneでは自動再生しない場合があります）

#### 追加の背景設定：

* **セクションの高さ**：フルハイト（100%）またはカスタムに設定
* **オーバーレイの色と不透明度**:
  * 上部と下部のオーバーレイを個別に制御
  * デスクトップとモバイルで独立した設定

> 💡 ヒント：テキストと背景ビジュアルのコントラストを作るためにオーバーレイを使用してください。

***

### このレイアウトを使用するタイミング

サイド配置メニューを使うべき場合：

* 垂直ナビゲーションでクリーンでモダンなレイアウトを望むとき
* 背景画像やブランドアートが体験の中心となるとき
* ホームページで多くのスクロール可能なセクションを使う予定がないとき

***

### **ヘルプが必要ですか？**

* 💬 **Discordでコミュニティに参加：** <https://discord.gg/hcc2GvgZc6>
* 📧 **メールでお問い合わせ：** <support@openspaces.design>
* 💻 **ライブチャット：** 月〜金、現地時間午前10時〜午後6時（EST）に当社ウェブサイトで直接対応