Wix Harmony エディタ：セクションを追加・カスタマイズする
9分
この記事内
- ページに新しいセクションを追加する
- セクションのレイアウトを変更する
- セクション名とリンクを編集する
- セクションのデザインをカスタマイズする
セクションを追加すると、サイト全体のコンテンツを整理して表示することができます。追加したセクションはページの両端まで引き伸ばされるため、簡単に必要な場所にパーツを配置して、ページをあらゆる画面サイズに対応させることができます。セクションは必要な数だけ追加して、ページ内で簡単に編集したり移動させたりすることができます。
ページに新しいセクションを追加する
セクションを追加して、ページのコンテンツを整理します。セクションは、プリセットのデザインのものを選択することも、空のセクションを追加して一から作成することもできます。また、AI を使用して、ニーズに適した新しいセクションを作成することもできます。
サイトに新しいセクションを追加する方法：
- エディタに移動します。
- 左上の「＋追加」にマウスオーバーし、「セクション」を選択します。
- 新しいセクションを追加する方法を選択します：
- AI で生成：AI を使用して、ニーズに適した新しいセクションを作成します。
- デザイン済みセクション：プリセットのデザインから好みのセクションを選択します。左側のメニューを使用して、カテゴリー間を移動します（例：「ウェルカム」、「プロフィール」、「商品」など）。
- 白紙セクション：空のセクションを追加して、一からカスタマイズします。
ヒント：
- ページに直接新しいセクションを追加することもできます。セクションの上部または下部にマウスオーバーし、「＋セクションを追加」をクリックします。
- セクションを選択し、左側にある矢印をクリックして上
または下
に移動させて、ページのセクションを並べ替えます。
セクションのレイアウトを変更する
セクションは、全体で一つの大きなセルとして表示されますが、エディタではこれを複数の小さなセルに分割し、そこにコンテンツを整理して配置することができます。このグリッド状のレイアウトでは、プリセットのレイアウトを選択したり、セルを結合・分割または追加したり、グリッド線をドラッグしてサイズを変更したり、セルの間に適切な間隔を追加したりと、柔軟にレイアウトを変更することができます。
セクションのレイアウトを変更する方法：
- エディタに移動します。
- 該当するセクションをクリックします。
- アクションバーで「レイアウトを変更」をクリックします。
- 利用可能なオプションから、グリッドレイアウトを選択します。
- 好みに合わせてグリッドをカスタマイズします：
行 / 列のサイズを変更する
セル間のギャップを調整する
をドラッグし、ギャップを調整します。行や列をさらに追加する
をクリックします。セル、行、列を入れ替える
をクリックし、行または列を入れ替えます。 セルをデザインする
をクリックします。
：セルの枠線の色、太さ、スタイルを変更します。「すべての枠線を編集」アイコン 
をクリックすると、すべての枠線をまとめてデザインすることができます。
：「半径」下のスライダーをドラッグし、セルの角の丸みを調整します。「個々の角を編集」アイコン 
：内側または外側の影を適用し、位置、ぼかし、色などを調整して、パーツが立体的に見えるようにします。
をクリックすると、セルに「開始」、「ループ」、「スクロール」、「マウスエフェクト」などのセルを結合する
セルを削除する
セクション名とリンクを編集する
カスタムセクションのリンクは、メールや SNS でセクションを共有したり、サイト内の別の場所にリンクを設定したりする場合に便利です。セクション名とリンクは、共有またはリンクする際に分かりやすいよう、編集することができます。セクション名を変更すると、リンクも新しい名前に合わせて自動的に更新されます。セクション名は変更せず、リンクのみを編集することもできます。
参考：
サイトのメインアドレスの後に続く、URL の末尾の部分のみを変更することができます。
セクション名とリンクを編集する方法：
- エディタに移動します。
- 該当するセクションを選択します。
- セクションの青いラベルにマウスオーバーします。
- 「セクション名を編集」アイコン
をクリックします。 - 次に実行する内容を選択します：
- セクション名を編集する：入力欄に新しい名前を入力します。
- セクションのリンクを編集する：「セクションリンク」をクリックし、セクションの URL の末尾を編集します（最大 60文字）。「リンクをコピー」をクリックして共有するか、「リンクを開く」をクリックしてプレビューします。
セクションのデザインをカスタマイズする
各セクションのデザインはカスタマイズすることができます。区切り線を追加してセクションを整理したり、枠線を追加して強調したり、アニメーション効果を追加して目立たせたり、ブランドに適した背景を追加したりすることができます。
セクションのデザインをカスタマイズする方法：
- エディタに移動します。
- 該当するセクションを選択します。
- アクションバーからカスタマイズするものを選択します：
- 背景を変更：「背景を変更」をクリックし、色、画像、または動画を選択して、セクションの背景を変更します。
- 不透明度：「不透明度」アイコン
をクリックし、セクションに含まれる内容に応じて、セクションの背景、画像、色の不透明度を調整します。 - 枠線：「枠線」アイコン
をクリックし、セクションの周りの枠線を追加または調整します。枠線の色、太さ、スタイルを変更します。 - セクション区切り線：「セクション区切り線」アイコン
をクリックし、線を追加または編集して、ページの他の部分を視覚的に区別します。 - アニメーション：「アニメーション」アイコン
をクリックして背景のスクロール効果を選択し、セクションを目立たせます。
注意：利用可能なアニメーションは、セクションの背景（例：色、画像、動画など）によって異なります。
