SharePoint モダン ページにセクションと列を追加する

SharePoint モダン ページに列を含むセクションを追加して、魅力的で整理されたレイアウトを作成します。 コンテンツを並べて表示するには、各セクションに最大 3 つの列を追加できます。 コミュニケーション サイトの一部であるページで作業している場合は、全角列を追加することで、ページ全体 (エッジを含む) にまたがる列を作成できます。 列の数が異なる複数のセクションを積み重ねることもできます。 右側に垂直セクションを追加することもできます。これは、クイック リンク、連絡先、天気、カウントダウン タイマーなどを表示するのに最適です。

次の例では、左側に 3 つの 1 列セクション、右側に垂直セクションがあります。

垂直セクションを含むセクションを含むページ

注: 一部の機能は、対象指定リリース プログラム に参加している組織に段階的に導入されます。 つまり、この機能はまだ表示されない場合があります。または、このヘルプ記事で説明されている機能とは異なって見える場合があります。

セクション レイアウトをページに追加する

  1. セクションを追加するページに移動します。

  2. 編集モードで既にメモしている場合は、ページの右上にある [編集 ] を選択します。

  3. セクションの境界線には、+で囲まれた線が表示されます。次のように、新しいセクションの追加を示すヒントが表示されます。ボタンの上にマウス ポインターを合わせます。 セクションを追加するボタン

  4. [ + セクション] を選択します。

  5. 必要な列の数を選択します。 セクションの種類の一覧

注: 全角セクションは、チーム サイトの一部であるページでは使用できません。 コミュニケーション サイトの一部であるページでのみ使用できます。

セクション テンプレートを追加する

注: セクション テンプレートは現在、Microsoft 365 の SharePoint でのみ使用できます。 この機能は、SharePoint Server 2019とSharePoint Server サブスクリプション エディションでは使用できません。

  1. セクション テンプレートを追加するページに移動します。

  2. まだ編集モードでない場合は、ページの右上にある [編集 ] を選択します。

  3. 右側の [ツールボックス]コンテンツ ウィンドウのツールボックス アイコンに移動します。 ツールボックスの下部に 2 つのセクション テンプレートが表示されます。 これらのテンプレートのいずれかを使用するには、テンプレートを選択します。 ツールボックスに一覧表示されているセクション テンプレート

  4. その他のセクション テンプレートを表示するには、[ すべてのセクション テンプレートを表示] を選択し、一覧からニーズに最も適したテンプレートを選択します。 セクション テンプレートの完全な一覧

  5. そのテンプレートがページに追加されたら、テンプレートの各フィールドに目的のコンテンツを挿入します。

垂直セクションを追加する

注: 垂直セクションは現在、Microsoft 365 の SharePoint でのみ使用できます。 この機能は、SharePoint Server 2019とSharePoint Server サブスクリプション エディションでは使用できません。

  1. 垂直セクションを追加するページに移動します。

  2. まだ編集モードでない場合は、ページの右上にある [編集 ] を選択します。

  3. セクションの境界線には、+で囲まれた線が表示されます。次のように、新しいセクションの追加を示すヒントが表示されます。ボタンの上にマウス ポインターを合わせます。 セクションを追加するボタン

  4. [ + セクション] を選択します。

  5. [ 垂直] セクションを選択します。 セクションの種類の一覧で強調表示されている垂直セクション

  6. 狭いブラウザー ウィンドウでは、垂直セクションをページの下部または上部に移動できます。 ブラウザー ウィンドウが小さいサイズに圧縮されたときに、垂直セクションをページの上部または下部に移動するかどうかを選択するには、セクション ツールバーの [プロパティの編集 ] を選択します。  垂直セクションのセクション ツール バー 垂直セクションの [プロパティ] ウィンドウ

注: 

  • 現在、垂直セクションはページの右側でのみ使用できます。

  • 垂直セクションの長さは、ページ上のコンテンツに基づいて調整され、垂直方向以外のセクションのコンテンツの長さに合わせて拡大または縮小されます。

  • 全角列と垂直セクションを同じページに配置することはできません。

  • 狭いブラウザー ウィンドウでは、垂直セクションがページの下部に移動されます。 ウィンドウを広くすると、垂直セクションがページの右側に戻ります。 これは、画面の幅が 1024 ピクセル未満の場合にも発生する可能性があります。 [スケールとレイアウト] で表示設定を調整してみてください。 たとえば、[テキスト、アプリ、その他の項目のサイズを変更する] のドロップダウンで、125% 以下の値を選択します。

既存のセクションを変更する

注: 2 つ以上の列にコンテンツがあり、列の数を減らすと、右端の列のコンテンツが左側の次の列に移動します。 1 列に減らすと、2 番目または 3 番目の列のコンテンツが最初の列の下部に移動します。

  1. セクションを変更するページに移動します。

  2. まだ編集モードでない場合は、ページの右上にある [編集 ] を選択します。

  3. 編集するセクションを選択し、セクションの左上にあるツール バーの [プロパティの編集 ] を選択するか、ページの右側にある [プロパティ ] アイコンを選択します。 セクション ツールバーで強調表示されている [プロパティの編集] ボタン。

  4. セクションのプロパティで、必要な列の数と種類を選択して、セクションを編集します。 セクション内のコンテンツを配置し、セクションの背景を選択またはアップロードすることもできます。 最初の 4 つの背景色は、サイトのテーマに基づいています。 グラデーションの色または画像が背景として設定されている場合にテキストを読みやすくするために、オーバーレイが自動的に追加されます。 使用可能なより多くの設定を示すセクションのプロパティ ウィンドウ。

注: 

  • セクションの背景色は、次に示すテキスト Web パーツ (左側) のように、ほとんどの Web パーツを通して表示されます。 他の Web パーツでは、セクションではなくページの背景が維持されます。 アクセシビリティを確保するために、リスト、ドキュメント ライブラリ、クイック グラフの Web パーツは常にページの背景を維持します。

  • 最終的にセクションの背景を表示できる Web パーツは、サイト アクティビティ、Yammer 会話、Yammer の強調表示、リスト プロパティ、ページ プロパティ、グループ 予定表、Bingニュース、Microsoft Power Apps です。 最適な結果を得るには、これらの Web パーツを含むセクションにセクションの背景色を使用しないことをお勧めします。

列にコンテンツを追加する

  1. まだ編集モードでない場合は、ページの右上にある [編集] を選択します。

  2. 右側の [ツールボックス コンテンツ ウィンドウのツールボックス アイコン] を選択してコンテンツを見つけます。 目的の Web パーツを選択またはドラッグ アンド ドロップし、Web パーツにコンテンツを追加します。Web パーツを検索して使用する方法の詳細については、「Web パーツの使用」をチェック

セクションを折りたたみ可能にする

注: セクションを折りたたみ可能にするは、現在、Microsoft 365 の SharePoint でのみ使用できます。 この機能は、SharePoint Server 2019とSharePoint Server サブスクリプション エディションでは使用できません。

  1. まだ編集モードでない場合は、ページの右上にある [編集] を選択します。

  2. 折りたたみ可能にするセクションを選択し、セクション ツールバーの [プロパティの編集] またはページの右側にある [プロパティ ] を選択します。

  3. [セクションのプロパティ] の [このセクションを折りたたみ可能にする] で、トグルをオンにします。

  4. 切り替えを目的のオプションに切り替えて、セクション タイトル を作成するかどうかを決定します。 その場合は、セクションの上部に名前を入力し、タイトルの見出しレベルを調整します。

  5. [区分線をセクション間で表示] トグルをオンまたはオフに切り替えて、セクション間の分割線を有効にするかどうかを選択します。

  6. [] または [右] を選択して、展開/折りたたみアイコンの配置を選択します

  7. セクションごとに、トグルを目的のオプションに切り替えて、 既定の表示 を展開または折りたたむかどうかを決定します。 折りたたみ可能な設定が有効になっているセクションのプロパティ ウィンドウ

ヘルプを表示

その他のオプションが必要ですか?

サブスクリプションの特典の参照、トレーニング コースの閲覧、デバイスのセキュリティ保護方法などについて説明します。

コミュニティは、質問をしたり質問の答えを得たり、フィードバックを提供したり、豊富な知識を持つ専門家の意見を聞いたりするのに役立ちます。