Wix Studio Two エディタ:ヘッダーにスクロールエフェクトを追加する
この記事では、2026年11月にリリースされた新しい Wix Studio Two エディタについて説明します。Wix Studio エディタまたは Wix Studio Two エディタのどちらを使用しているか不明な場合は、こちらで詳細を確認してください。
サイト訪問者がページを下へ移動する際の動作を設定しましょう。ナビゲーションが手の届く範囲に留まるようヘッダーをフリーズ(固定)したり、コンテンツを全画面表示にするためにヘッダーを消したりフェードアウトさせたりし、方向、距離、タイミングを微調整します。
ヘッダースクロールエフェクトを追加・設定する
ヘッダーの動作をページに合わせて調整します。サイト訪問者が常にメニューを必要とする場合はヘッダーを表示させ、コンテンツだけでページを構成すべき場合は、画面から非表示にします。
スクロールエフェクトは、このヘッダーが表示されるすべてのページに適用されます。別のヘッダーを使用するページでは、独自のスクロールエフェクトが適用されます。
ヘッダーにスクロールエフェクトを追加する方法:
エディタに移動します。
ヘッダーをクリックします。
アクションバーで「動作を変更」をクリックします。
「スクロールエフェクト」を選択します。
「すべてのデザインオプション」をクリックし、要素設定パネルでエフェクトを設定します。
(要素設定パネルで)「ヘッダー設定」をクリックしてセクションを展開します。
選択したスクロールエフェクトを設定します:

スクロールエフェクトを削除する
ヘッダーをページとともに移動させたい場合は、エフェクトを無効にします。ヘッダーのデザインは維持されたまま、スクロール動作のみが変更されます。
スクロールエフェクトを削除する方法:
- エディタに移動します。
- ヘッダーをクリックします。
- アクションバーで「動作を変更」をクリックします。
- 「スクロールエフェクト」ドロップダウンから「サイトと共にスクロール」を選択します。

ヘッダーの詳細設定を操作する
ヘッダーの動作を自由に設定できます。詳細設定を有効にすると、ヘッダーの位置と動きを個別に制御できるようになります。たとえば、ヘッダーを画面の下部に固定したり、独自のタイミングやイージングを設定したりすることができます。
「Option + I」または「Alt + I」を押して、詳細設定を有効または無効にできます。
ヘッダーの詳細設定を操作する方法:
エディタに移動します。
ヘッダーをクリックします。
アクションバーで「動作を変更」をクリックします。
「すべてのデザインオプション」をクリックします。
要素設定パネルの上部にある「その他のアクション」アイコン をクリックし、「詳細設定」トグルを有効または無効にします。

「ヘッダー設定」をクリックしてセクションを展開します。
「配置タイプ」を選択します:
既定:ヘッダーの位置は固定されておらず、ページの残りの部分とともにスクロールします。
スティッキー:サイト訪問者がスクロールするとヘッダーが画面の端に固定されます。
ピン留め:ヘッダーが画面に固定さレ、ページコンテンツの上に表示されます。
選択した配置タイプを設定します:
詳細設定では、「サイズ」の項目も変更され、% や vh などの高度な測定単位に切り替わります。
よくある質問
ヘッダーのスクロールエフェクトに関する詳細については、以下の質問をクリックしてください。




をクリックし、「詳細設定」トグルを有効または無効にします。

