SharePoint モダン ページに列を含むセクションを追加して、魅力的で整理されたレイアウトを作成します。 コンテンツを並べて表示するには、各セクションに最大 3 つの列を追加できます。 コミュニケーション サイトの一部であるページで作業している場合は、全角列を追加することで、ページ全体 (エッジを含む) にまたがる列を作成できます。 列の数が異なる複数のセクションを積み重ねることもできます。 右側に垂直セクションを追加することもできます。これは、クイック リンク、連絡先、天気、カウントダウン タイマーなどを表示するのに最適です。
次の例では、左側に 3 つの 1 列セクション、右側に垂直セクションがあります。
注:
-
セクション コントロールの更新されたデザインをロールアウト中です。 新しいエクスペリエンスについては、「 SharePoint モダン ページにセクションと列を追加する (更新)」 を参照してください。
-
一部の機能は、対象指定リリース プログラム に参加している組織に段階的に導入されます。 つまり、この機能はまだ表示されない場合があります。または、このヘルプ記事で説明されている機能とは異なって見える場合があります。
セクション レイアウトをページに追加する
-
列を追加するページに移動します。
-
まだ編集モードでない場合は、ページの右上にある [編集 ] を選択します。
-
ページのタイトル領域の下のマウスをページの左端、またはページの左端にある既存の Web パーツの上または下にマウス ポインターを合わせると、[新しいセクションの追加] と表示されるツール ヒントを使用して、円で囲まれた +の線が表示されます。
-
[] を選択します。
-
[ セクション レイアウト] で、必要な列の数を選択するか、コミュニケーション サイトの一部であるページ上にある場合は、ページ全体 (エッジを含む) にまたがる全幅の列を選択できます。
注: 全角列は、チーム サイトの一部であるページでは使用できません。 コミュニケーション サイトの一部であるページでのみ使用できます。
セクション テンプレートを追加する
注: セクション テンプレートの追加は、現在、Microsoft 365 の SharePoint でのみ使用できます。 この機能は、SharePoint Server 2019 および SharePoint Server サブスクリプション エディションでは使用できません。
-
セクション テンプレートを追加するページに移動します。
-
まだ編集モードでない場合は、ページの右上にある [編集 ] を選択します。
-
ページのタイトル領域の下にあるマウスをページの左端、またはページの左端にある既存の Web パーツの上または下に置くと、次のような円で囲まれた +の線が表示され、ツール ヒントに 「 新しいセクションを追加する」と表示されます。
-
[] を選択します。
-
開いたウィンドウで、[テンプレート] タブを選択します。
-
テンプレートの一覧から、ニーズに最も適したテンプレートを選択します。
-
そのテンプレートがページに追加されたら、テンプレートの各フィールドに目的のコンテンツを挿入します。
SharePoint ページにセクション テンプレートを使用する方法について詳しくは、こちらをご覧ください。
垂直セクションを追加する
注: 垂直セクションの追加は、現在、Microsoft 365 の SharePoint でのみ使用できます。 この機能は、SharePoint Server 2019 および SharePoint Server サブスクリプション エディションでは使用できません。
-
垂直セクションを追加するページに移動します。
-
まだ編集モードでない場合は、ページの右上にある [編集 ] を選択します。
-
ページのタイトル領域の下にあるマウスをページの左端、またはページの左端にある既存の Web パーツの上または下に置くと、次のような円で囲まれた +の線が表示され、ツール ヒントに 「 新しいセクションを追加する」と表示されます。
-
[] を選択します。
-
[ セクション レイアウト] で、[ 垂直セクション] を選択します。
-
狭いブラウザー ウィンドウでは、垂直セクションをページの下部または上部に移動できます。 [ セクションの編集] を選択して、ブラウザー ウィンドウが小さいサイズに圧縮されたときに、垂直セクションをページの上部または下部に移動するかどうかを選択します。
注:
-
現在、垂直セクションはページの右側でのみ使用できます。
-
垂直セクションの長さは、ページ上のコンテンツに基づいて調整され、垂直方向以外のセクションのコンテンツの長さに合わせて拡大または縮小されます。
-
全角列と垂直セクションを同じページに配置することはできません。
-
狭いブラウザー ウィンドウでは、垂直セクションがページの下部に移動されます。 ウィンドウを広くすると、垂直セクションがページの右側に戻ります。 これは、画面の幅が 1024 ピクセル未満の場合にも発生する可能性があります。 [スケールとレイアウト] で表示設定を調整してみてください。 たとえば、[テキスト、アプリ、その他の項目のサイズを変更する ] のドロップダウンで、125% 以下の値を選択します。
既存のセクションを変更する
注: 2 つ以上の列にコンテンツがあり、列の数を減らすと、右端の列のコンテンツが左側の次の列に移動します。 1 列に減らすと、2 番目または 3 番目の列のコンテンツが最初の列の下部に移動します。
-
セクションを変更するページに移動します。
-
まだ編集モードでない場合は、ページの右上にある [編集 ] を選択します。
-
ページの各セクションには点線が付いています。 列を追加するセクションを選択し、ページの左側にある [編集] セクション を選択します。
-
右側の [セクション ] ツールボックスで、目的の列の数と種類を選択し、セクションを目立たせたい場合、またはページをより魅力的にする場合は、16 個のオプションからセクションの背景を選択します。 最初の 4 つの使用可能な色は、サイトのテーマに基づいています。 グラデーションの色または画像を背景として設定するときにテキストを読みやすくするために、シースルー オーバーレイが自動的に追加されました。
注:
-
セクションの背景オプションは、次に示すテキスト Web パーツ (左側) のように、ほとんどの Web パーツを通して表示されます。 下のクイック グラフ Web パーツ (右側) のように、他の Web パーツはセクションではなくページの背景を維持します。 アクセシビリティを確保するために、リスト、ドキュメント ライブラリ、クイック グラフの Web パーツは常にページの背景を維持します (たとえば、下のクイック グラフ Web パーツ)。
-
最終的にセクションの背景を表示できますが、現在は表示されない Web パーツは、サイト アクティビティ、Viva Engage Conversations、Viva Engage Highlights、List プロパティ、ページ プロパティ、グループ 予定表、Bingニュース、Microsoft Power Apps です。 最適な結果を得るには、これらの Web パーツを含むセクションにセクションの背景色を使用しないことをお勧めします。
列にコンテンツを追加する
-
まだ編集モードでない場合は、ページの右上にある [編集 ] を選択します。
-
コンテンツを追加する列に移動します。
-
列の上にマウス ポインターを合わせ、[] を選択します。
-
列に追加する Web パーツを選択し、コンテンツを Web パーツに追加します。 Web パーツの使用について説明します。
セクションを折りたたみ可能にする
注: セクションを折りたたみ可能にするは、現在、Microsoft 365 の SharePoint でのみ使用できます。 この機能は、SharePoint Server 2019 および SharePoint Server サブスクリプション エディションでは使用できません。
[セクションの書式設定] ウィンドウでセクションを折りたたみ可能にします。
-
まだ編集モードでない場合は、ページの右上にある [編集 ] を選択します。
-
折りたたみ可能にするセクションを選択し、ページの左側にある [セクションの編集 ] を選択します。
-
[セクションの書式設定] ウィンドウの [ このセクションを折りたたみ可能にする] で、トグルをオンにします。
-
セクション表示名を追加してセクションを識別し、[セクション間の分割線を表示] トグルをオンまたはオフに切り替えて 、セクション間の分割線 を有効にするかどうかを選択します。
-
[ 左 ] または [ 右] を選択して、[展開] または [折りたたみ] アイコンの配置を選択します。
-
セクションごとに、トグルを目的のオプションに切り替えて、既定の表示を展開または折りたたむかどうかを決定します。