SharePointのモダンUIに絞ったページ編集方法を投稿します。
Webパーツについては、クラシックUIに比べるとずいぶん直感的になり使いやすくなりました。一方で、ブロック単位の操作は今までにないインターフェースで初見ではまず面喰います（まぁ、クラシックUIが使いやすいかというとそんなことはないんだけれど）。
多少、HTMLの素養があると各ブロックの狙いがわかりやすくなります。
「サイトのページ」基本操作
ページ編集以外の「サイトのページ」基本操作方法は次にまとめています。
モダンUIでのページ編集方法
モダンUIでのページ編集はモジュラー式となった
モダンUIからページ編集方法にモジュラー式のエディターが導入されました。編集領域をコンポーネント毎に分けてパーツを組み立てるように記事を作っていくスタイルになります。
セクションでレイアウトを構成し、Webパーツで見せたい内容を作っていくことになります。HTMLの素養があると理解は早まりますが、HTMLがわからなくても表現力豊かな記事を投稿できます。
慣れが少し必要ですが、私はクラシック表示時代よりも気に入っています。
なお、同様のモジュラー式エディターはワードプレスでも導入されています（ブロックエディター「Gutenberg」と呼ばれる）。
メリットとデメリット
モダンUIの良いところは、どのデバイスでも綺麗なWeb画面となるレスポンシブデザインになったところや、Webパーツが豊富になっているところかと思います。
一方で、スクリプトエディターが廃止となっているのでWebパーツにない機能をJavaScriptで実装したり、CSSで外観を変更するというのはやりづらくなっています。
- レスポンシブデザインとなり、端末環境に最適化された表示が可能
- （慣れは必要だが）直感的なページ編集が可能
- 豊富なWebパーツにより表現力豊かなページを作れる
- スクリプトエディターが廃止となり、CSSやJSを使いづらくなった
新規ページの発行
ページ編集を開始する方法は次の通りです。
- 「ホーム」→「+新規」→「ページ」
- 「ホーム」→「ニュース」→「ニュースの追加」
- サイドバーの「ページ」、あるいはサイトコンテンツ
- 「サイトのページ」→「+新規」→「ページ」
▲ 開始方法によってページテンプレートの選択画面が表示されます。
編集時の画面構成
メニュー
| メニュー操作 | 説明 |
|---|---|
| 下書きとして保存 | ページ編集の変更内容を公開せず、下書き状態にする場合に使います。 |
| 元に戻す | 直前に行った操作を一つ前の状態に戻します。 |
| 変更の破棄 | ページ編集の変更内容を破棄します。 ページ編集を開始したにも関わらず、「下書きとして保存」「変更の破棄」「発行」のいずれも行わずにほかの画面に遷移するとページがチェックアウト状態になります。変更を適用しない場合は「変更の破棄」をしておいたほうがベターです。 |
| ページの詳細 | SharePointのサイトコレクション全体で検索した際に表示される内容となります。 サムネイル、説明を追加できます。説明はGoogle検索したときに出てくるページの説明のようなもので一般的にメタディスクリプションと呼ばれます。 |
| 発行 | ページをサイトコレクション内に発行して、人の目にみえるようにします。 |
タイトル領域
▲ ページを開いたときのタイトル部分で、画像を入れたり、投稿者名を入れたり、タイトル以外の文字を追加できます。
▲ ✏えんぴつのボタンを押すとタイトルの細かい設定を行うことが出来ます。設定できる内容は次の通り。
- レイアウト
- 配置
- タイトル上のテキスト
- 公開日を表示
▲ タイトル領域のレイアウト（見た目）は4種類あります。
▲ タイトルの文字をセンタリングしたり、タイトル上にテキストをおくことができます。
▲ 写真のボタンを押すとタイトル背景を指定できます。また、写真ボタンの一つしたの戻すボタンを押すと既定の画像に戻ります。
セクション
セクションは、ページのレイアウトが行える概念です。クラシック表示にも似たようなものがありましたが、モダンUIはより直感的にできるようになっています。
▲ 少しわかりづらいですが、レイアウト変更はページの左側にある「+」ボタンから呼び出します。
使えるセクションレイアウトは次の通りです。
- 1段組み
- 2段組み
- 3段組み
- 3分の1が左の列
- 3分の1が右の列
また、セクションの背景を変更することができます。領域変更を色で伝えることが可能です。
コミュニケーション領域
ページには、組織内のメンバーと対話する機能が備わっています。
- いいね！
- コメント
- 表示回数
- 後で見る
コメント欄を表示して組織内のユーザーから意見をもらえるように出来ます。メンションも使えます。表示回数は自分のアクセス数も含まれるようです。
Webパーツ
Webパーツという概念はクラシック表示にもありましたが、とてもわかりづらいものでした。モダンUIだと直感的に選べるようになっています。
Webパーツは日々増えているようですね。使うたびに見慣れないサードパーティアプリを見かけます。数が多いので、基本的なもののみをご紹介します。
「テキスト」パーツ
テキストもWebパーツの一つです。これは必須ですね。
▲ ワード的なインターフェースからテキスト装飾ができます。「・・・」を押すと詳細設定画面が開きます。
フォントスタイルを使うと一貫性のある見た目でテキスト投稿できます。
- 標準テキスト
- 見出し1〜3
- 抜粋見出し
- 等幅
「段落」では文字の配置、インデント、リスト表記の設定が行えます。
▲ 表の挿入もテキストから行います。まぁ、ワードと似たようなものですね。
「画像」パーツ
画像があるとページが映えます。手元に素材がなくともストック画像やWeb検索などから探すと、ライセンスフリーの画像が使えます。もちろん、アップロードすることも可能です。
「ニュース」パーツ
クラシック表示であった「お知らせ」は標準機能からは消えました（リストを使えば再現可能）。ニュースパーツを使えば、より動的なページを作ることができます。
機能的に、普通のページと同じものですがブログのように時系列でアーカイブしてくれます。
「クイックリンク」パーツ
クラシックであった「注目リンク」と呼ばれるパーツはなく、リンクを形成するパーツは複数あります。一番、注目リンクに近くお手軽なのは「クイックリンク」です。
文字とアイコンのみでリンク集が作れます。
▲ アイコンの種類も豊富なのでリンク属性を表す図柄が使えます。
「ボタン」パーツ
リンク形態のひとつとして、誰でも一度は考えるボタン。スマートフォンやタブレットなどだとテキストリンクよりもボタンのほうが押しやすい。モダンUIであれば簡単に作れます。
「イベント」パーツ
予定を表すパーツは、「予定表」「イベント」などがあります。どちらも予定表リストと紐づけられます。イベントを使うとこれからのアイテムが一目でわかります。
「リスト」パーツ
リストライブラリも健在です。
「ドキュメントライブラリ」パーツ
ドキュメントライブラリも健在です。
ドキュメントライブラリ以外にも機能がちかいもので「強調されたコンテンツ」というのがあります。更新順で表示したり、よくアクセスのあるコンテンツがわかるようになります。
このパーツは見る人によって表示が異なるようです。
「ファイルビューアー」パーツ
Sharepointにはすでに存在する資料を埋め込むことができます。そんな時に使うのがファイルビューアーです。エクセルでのグラフや表、パワーポイント、PDFを埋め込めます。
「クイックグラフ」パーツ
棒グラフ、円グラフと基本的なもののみですけど、Web上でグラフを描画することができます。手動で値を入れたり、存在するリストからグラフをサクッと入れ込めます。
こんなときは？
後から気づいたポイントをここに入れていきます。
編集できない・編集を開始できない
ページ編集には権限が必要です。閲覧のみの権限だと編集できません。
Sharepoint既定でフルコントロール以外に「デザイン」「投稿」「編集」などの権限があれば、ページ編集を行えます。そのほか、サイト管理者側で権限設定をカスタマイズしている可能性もあるので管理者に聞いてみましょう。
まとめ
直感的に使いやすくなったモダンUIのページ編集方法やWebアプリについて投稿しました。
CSSやJS的に不便になった部分はあるものの、新しい編集画面にも多くのメリットがあります。触れるたびにパーツが増えているので新たな発見があります。
