モダンページのページレイアウトの種類と変更方法

はじめに

モダンページには複数の種類 (ページレイアウト) があり、それぞれページの特徴が異なります。 ページレイアウトは、いくつかの方法で切り替えることができるのですが、この記事ではページレイアウトの種類と PnP PowerShell を使用した切り替え方法をまとめています。 今後も新しいページレイアウトが追加された際には記事をアップデートしていきたいと思います。

ページレイアウトの種類

2019年12月時点では、以下の3つのページレイアウトが用意されています。 なお、今回のサンプルはコミュニティサイトとして作成したサイトをベースにしているので、サイドリンクバーが表示されていません。

Home

モダンサイトを作成した際に Home.aspx に適用されているページレイアウトです。 ページヘッダーとページタイトルが表示されない状態になります。

読了時間: 1分

モダンサイトのテンプレート展開などを実現する「PnP PowerShell」

PnP PowerShell とは

モダンサイトやリストの自動展開や各種設定を SharePoint 管理コンソールよりも簡単に実施できるようにするためのコマンドレットを多数備えた、PowerShell コマンドライブラリです。 SharePoint Online だけでなく SharePoint オンプレミスに対しても使用することができます。 詳細は docs を参照してください。

どんなことができるの?

PnP PowerShell を使うことで、例えば次のようなことができるようになります。

モダンサイトのテンプレート展開

モダンサイトはテンプレート化することができませんが、PnP PowerShell のプロビジョニングテンプレートを使用することで、予め定めたリストやライブラリを追加したり、ドキュメントを事前にアップロードしてサイトを展開するというようなことができるようになります。 旧来のサイトテンプレートと全く同じではありませんが、サイトテンプレートよりも細かいことまで含めてできるようになります。

読了時間: 1分

SPO のモダン対応を促進する「SharePoint Modernization Scanner」

SharePoint Modernization Scanner とは

SharePoint Modernization Scanner は、SharePoint Online サイトのモダン化を進めるために、SharePoint Online サイトをスキャンしてモダンに切り替えられていないサイトを抽出するツールです。 PnP コミュニティにより維持管理されており、GitHub からダウンロードして無償で使用することができます。 また、詳細な説明資料はマイクロソフトの Docs に掲載されており、Docs に最新モジュールへのリンクも掲載されています。 SharePoint Modernization Scanner は随時アップデートがされており、ドキュメントもそれに合わせて更新されているので、使用する際には常に Docs を確認して最新の情報を参照するようにしてください。 このブログでも、ツールの紹介だけを行い詳細な使い方については割愛しています。

読了時間: 1分

Docker を使った SharePoint Framework 開発環境の構築 その3

はじめに

※2020年2月2日更新 Docker 上に SharePoint Framework の開発環境を構築する手順をまとめました。 この資料の内容は、こちらのスライドからの抜粋となります。 構築手順をまとめて確認したい方は、スライドをダウンロードしてください。 なお、環境構築手順は、 ・開発環境を構築するためにホストとなる PC で行う手順Docker イメージを準備する手順Docker 上でプロジェクトごとに行う手順 の3部構成になっています。 この記事では、Docker 上でプロジェクトごとに行う手順について記載します。

読了時間: 2分

Teams タブ開発基礎講座

先日の Microsoft 365 Developer Bootcamp 2019 Tokyo では、Teams タブの開発を一から学ぶためのハンズオンを行いました。 その際に使用したスライドとソースコードは、それぞれ以下の場所で公開しています。 スライド:SharePoint Framework Teams タブ開発基礎講座

サンプルコード:GitHub   SlideShare では、Teams タブの他にアプリケーションカスタマイザー、フィールドカスタマイザー、コマンドバー開発のための資料も公開していたりするので、SharePoint Framework 開発をはじめる方は参考にしてみてください。 https://www.slideshare.net/HiroakiOikawa/sharepoint-framework-extension[AdSense-B]

読了時間: 1分

SharePoint Framework v1.9.1 の変更点

2019年8月14日に SharePoint Framework  v1.9.1 がリリースされました。 この記事では v1.9.1 の変更点について気になるところだけ抜粋して記載します。 詳細は以下のリリースノートを確認してください。 SharePoint Framework v1.9 release notes

Library Components

  • SharePoint Framework におけるコードの再利用を実現するための機能で、自作のファンクションなどを共通コードライブラリとして SharePoint 環境に展開するための機能です。

SharePoint Framework でライブラリコンポーネントタイプを使用する

読了時間: 1分

SharePoint Framework v1.8 の変更点

2019年3月8日に SharePoint Framework  v1.8 がリリースされました。 この記事では v1.8 の変更点について気になるところだけ抜粋して記載します。 詳細は以下のリリースノートを確認してください。 SharePoint Framework v1.8 release notes

Teams タブ

  • v1.7 ではプレビュー版としてリリースされていましたが、v1.8 で正式サポートとなりました。
  • 「Teams タブ」は SharePoint Framework の Web パーツの開発と同じ開発手法で開発したカスタムアプリケーションを Microsoft Teams に「タブ」として追加できるようにするためのソリューションです。

SharePoint Framework を使用した Microsoft Teams タグの作成

読了時間: 1分

Docker を使った SharePoint Framework 開発環境の構築 その2

はじめに

※2019年12月8日更新 Docker 上に SharePoint Framework の開発環境を構築する手順をまとめました。 この資料の内容は、こちらのスライドからの抜粋となります。 構築手順をまとめて確認したい方は、スライドをダウンロードしてください。 なお、環境構築手順は、 ・開発環境を構築するためにホストとなる PC で行う手順Docker イメージを準備する手順Docker 上でプロジェクトごとに行う手順 の3部構成になっています。 この記事では、Docker イメージを準備する手順について記載します。

読了時間: 2分

Docker を使った SharePoint Framework 開発環境の構築 その1

はじめに

※2019年12月8日更新 Docker 上に SharePoint Framework の開発環境を構築する手順をまとめました。 この資料の内容は、こちらのスライドからの抜粋となります。 構築手順をまとめて確認したい方は、スライドをダウンロードしてください。 なお、環境構築手順は、 ・開発環境を構築するためにホストとなる PC で行う手順Docker イメージを準備する手順Docker 上でプロジェクトごとに行う手順 の3部構成になっています。 この記事では、開発環境を構築するためにホストとなる PC で行う手順について記載します。

読了時間: 1分

SharePoint Online ページ診断ツール

はじめに

マイクロソフト純正の SharePoint Online 用ページ診断ツール「Page Diagnostics for SharePoint」が、google chrome 拡張機能としてリリースされています。 このツールを使ってどんな診断ができるのか試してみました。

Page Diagnostics for SharePoint の入手とインストール

chrome ウェブストアで「SharePoint」で検索すると出てきます。 https://chrome.google.com/webstore/search/sharepoint?hl=ja [Chromeに追加]ボタンをクリックすると、確認メッセージが表示されるので[拡張機能を追加]をクリックします。 インストールするとブラウザの右上に拡張機能のボタンが追加されます(下図赤枠部分)

読了時間: 1分