SharePoint :テキストWebパーツに画像をインラインで追加できるようになった(テキストの回り込み)

※ この記事で本ブログの投稿数が993件。1000件まであと少し!

SharePoint においては、ライブラリやリスト( Microsoft Lists )も大事だけど、ページやニュースも大事な要素です。もちろんサイトを開いた時のホームページもページです。そしてニュースやページにとって大事なコンテンツは文章。そして視覚的にも画像を配置。一般的にも新聞やニュースサイトの記事も、テキストと画像で構成されていると思います(Web上のニュースサイトなら動画もありますが)。なので SharePoint のページやニュースにおいてもテキストWebパーツは重要なWebパーツとなりますが、今回はその機能強化された話です。新聞やニュース記事のように画像にテキストが回り込んで表示できるようになるという事です。

2021/09/07付けで Microsoft 365 管理センターのメッセージセンターに以下のメッセージが公開されました。

▼新機能: SharePoint ページとニュース用のテキスト Web パーツの機能強化

メッセージセンター開ける人は確認していいただきたいけど、このメッセージ、何故か今消えてるんですよね。前々からメッセージセンターのメッセージは行方不明になるんですけど、今回も…。上のスクショは公開された時に僕が Twitter で貼り付けてツイートしたのでそこから取ってきました。なんで消しちゃうんですかねぇ。ちなみに Microsoft 365 ロードマップ 上にはあります。

SharePoint: Improvements to the Text web part for SharePoint pages and news
https://www.microsoft.com/ja-jp/microsoft-365/roadmap?filters=&searchterms=85584

という事で、僕の環境でも展開されていたので試してみます。

▼まずはテキストWebパーツを追加し、文章を入力します

さて、ここですでに1つ以前にはなかったアイコンがありました。

▼画像の挿入アイコン

▼以前の編集バーには画像の挿入アイコンがなかった

テキストWebパーツ自体には、以前からドラッグ&ドロップやクリップボードから画像を貼り付ける事はできたけど、この画像の挿入アイコンからだと、画像Webパーツなどと同じように色々な方法で画像を選べます。

▼例えばストック画像からも

▼画像を挿入したところ

画像の左上を良く見ると、

▼「左揃え」「中央揃え」「右揃え」のアイコンが

では、左揃えをしてみます。

▼左揃え

回り込みがイメージしやすいようにさっきよりも文章を足しています(「テキストテキスト…」)。このように画像が左に寄せられて、テキストが回り込んで表示されて、新聞やニュース記事っぽくなります。

▼中央揃えでは回り込まない(そりゃそうか)

▼右揃え

良く見ると、画像とテキストの横の余白が結構ありますよね。これに関しての説明は Office サポートのページに記載がありました。

テキスト Web パーツを使用してページにテキスト、表、画像を追加する
https://support.microsoft.com/ja-jp/office/729c0aa1-bc0d-41e3-9cde-c60533f2c801

▼イメージを追加する(上のページから引用)

この下部の「注」の通り、画像の幅がWebパーツの幅の50%未満では画像の左右に空白が表示されるとの事。なので、画像サイズをWebパーツのサイズに対して50%くらいに広げると、

▼画像の左右の余白が自然な感じになります。

ただし、気を付けたい点は、余白を自然な感じにする事が重要なのか?という点です。たしかに画像を大きくすれば余白はなくなりますが、その画像がユーザーにじっくり見てもらいたい場合は良いけど、挿絵的な感じであればむしろ画像の主張が強すぎですね。そして画像が大きいという事はテキストのスペースが狭くなるという事にもなるので、そこは表示させる画像の意図を考慮しながら調整すると良さそうです。

最後に、

▼この状態でブラウザーのサイズを狭めると、

▼回り込みは解除されて中央揃えになります

レスポンシブになっているので、テキストが読みづらくなるような事はなさそうですね。

という事で、是非使ってみましょう。