Wix エディタ:「トップへ戻る」ボタンを作成する
読了時間:3分
「トップへ戻る」ボタンを使用して、訪問者がサイトの上部に簡単にスクロールできるようにしましょう。「トップへ戻る」ボタンはサイト上の固定位置にあるため、訪問者が下にスクロールしても常に表示されます。
ステップ 1 | ボタンを追加する
「トップへ戻る」ボタンは通常、訪問者にボタンがページの最上部に移動することを示す矢印です。豊富な種類の矢印のデザインから選択できます。
ボタンを追加する方法:
- エディタ左側で「パーツを追加」
をクリックします。
- 「装飾」をクリックします。
- 「矢印」をクリックします。
- 矢印をサイトにドラッグします。
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/43afd84c-813c-43a2-baab-131b6878accd/2022/12/28/7a9fe3ca-0a2d-41ea-9008-91e75cd2125c/a177f8aa-a225-4322-9ad9-fe8c95120b1f.png)
別のボタンを使用したい場合:
「トップへ戻る」ボタンには、ベクターアートやアイコンボタンなどの他のパーツを使用することもできます。
ステップ 2 | ボタンをページの上部にリンクさせる
ボタンをページの上部にリンクして、訪問者がボタンをクリックしたときにサイトの一番上に誘導されるようにします。
ボタンをリンクする方法:
- エディタ内でボタンをクリックします。
- 「リンクを追加」アイコン
をクリックします。
- 「ページトップ / ボトム」をクリックします。
- 「トップ」をクリックします。
- 「完了」をクリックします。
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/43afd84c-813c-43a2-baab-131b6878accd/2022/12/28/2191ea90-cb90-40ab-bcb6-55aba9aa4088/8cd2ff34-80c5-4651-ae96-5e2d985b4762.png)
ステップ 3 | ボタンを画面に固定する
画面の横にボタンを固定して、サイト訪問者がサイトをスクロールダウンしても常に表示されるようにします。
「トップへ戻る」ボタンは通常、画面の右下に表示されます。
ボタンを画面に固定する方法:
- ボタンを右クリックします。
- 「画面に固定」をクリックします。
- 「表示位置」下のグリッドで位置をクリックします。
- 「横の位置」下でスライダーをドラッグさせるか、スライダー横の欄に値を入力し、パーツを横に移動させます。
- 「縦の位置」下でスライダーをドラッグさせるか、スライダー横の欄に値を入力し、パーツを縦に移動させます。
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/43afd84c-813c-43a2-baab-131b6878accd/2022/12/28/62fbcee8-b9af-49d1-afb3-ee8a978b6380/53051c22-9543-4154-aa18-a47d2df77dc1.png)
ステップ 4 | ボタンを全ページに表示する
サイトのすべてのページと場所からボタンにアクセスできるようにします。
すべてのページにボタンを表示する方法:
- ボタンを右クリックします。
- 「全ページに表示」トグルを有効にします。
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/43afd84c-813c-43a2-baab-131b6878accd/2022/12/28/2442515e-9d32-4280-a50d-f83c4ffbfea3/77f90587-10aa-44b1-8b78-0478e659de85.png)
モバイルサイトでの「トップへ戻る」ボタン:
「トップへ戻る」ボタンはモバイルサイトでは表示されません。ただし、モバイルサイトに「トップへ戻る」ボタンを追加することは可能です。詳細はこちら