Smart Tiles はじめに
アイコンは、タイトルを読む前にタイルを識別できるようにするものです。Outlook のロゴ、PDF のシンボル、電話などがその例です。Smart Tiles には、イントラネットでよく使われる用途をカバーする 5 つのアイコン セット (汎用シンボル、ドキュメントの種類、Microsoft 365 アプリケーション、Azure サービス、Vitextra 製品) が付属しており、これらで足りない場合は独自の画像も使用できます。この記事では、各アイコン セット、アイコン パネル、およびアイコンの描画方法を制御する設定について説明します。
アイコン セット
| セット | 内容 | 主な用途 |
|---|---|---|
| 標準アイコン | Microsoft 365 全体で使用されている Fluent UI アイコン フォント。人、ドキュメント、予定表、設定、矢印など、1,000 以上の単色シンボルが含まれます。 | 汎用的なリンク先: ヘルプ デスク、休暇、ポリシー。 |
| ファイルの種類アイコン | SharePoint のカラーのファイルの種類のアイコン。Word、Excel、PowerPoint、PDF、画像、アーカイブなどの形式があります。 | 特定のドキュメントやテンプレートへのリンク。 |
| アプリのアイコン | Microsoft 365 アプリケーションの製品ロゴ。Outlook、Teams、OneDrive、Planner、Forms、Power BI などがあります。 | アプリケーションまたはその Web 版を開くリンク。 |
| Azure | Azure サービスのアイコン。 | IT チームや開発者向けのポータル。 |
| Vitextra | Vitextra 製品のアイコン。 | 他の Vitextra Web パーツで構築されたページへのリンク。 |
標準アイコンはタイルの フォントの色 を使用します。この設定を変更すると、アイコンの色が変わります。他の 4 つのセットはフルカラーの画像で、どの背景でも元の色が保たれます。
アイコンを選ぶ
- ページを編集モードで開き、タイルの … ボタンをクリックします。
- タイル アイコン をポイントし、セットを選択します: 標準アイコン、ファイルの種類アイコン、アプリのアイコン、Azure、または Vitextra。
- 右側に開く アイコンの選択 パネルで、アイコンをスクロールして探すか、検索ボックスに名前の一部 (mail、calendar、xlsx など) を入力します。
- アイコンをクリックし、続けて 適用 をクリックします。
パネルを開くと、タイルで現在使用されているアイコンが強調表示されるため、同じセットから関連するアイコンを簡単に選べます。
📝 注
YouTube 動画にリンクするタイルでは、アイコンの代わりに再生ボタンが表示されます。そのようなタイルに選択したアイコンは保持され、リンクを別のアドレスに変更すると再び表示されます。
独自の画像
タイル アイコン サブメニューの最後の項目である カスタム画像 を使用すると、アイコンを独自の画像 (会社のロゴ、製品の写真、デザイナーが作成したアイコンなど) に置き換えることができます。画像は URL として入力するか、サイトのドキュメント ライブラリから選択します。その後、5 つのセットのいずれかからアイコンを選択すると、カスタム画像は再び削除されます。手順については、KB10244. カスタム画像をタイル アイコンとして使用するで説明しています。
Web パーツのアイコン設定
プロパティ ペインの 表示 (外観) グループにある 4 つの設定は、すべてのタイルのアイコンに適用されます。
| 設定 | 効果 |
|---|---|
| アイコンのサイズ | 6 段階: 20、24、32、40、48、64 px。サイズはすべてのセットとカスタム画像に等しく適用されます。 |
| アイコンのインデント | アイコンとタイトルの間の間隔 (0～30 px)。 |
| 影 | アイコンの下に付く柔らかいドロップ シャドウ。フラットな標準アイコンに奥行きを与え、フルカラーのアイコンを背景画像から浮かび上がらせます。 |
| タイトルの表示 | タイトルの表示を切り替えます。説明には別の表示設定があります。アイコンだけを表示するには、両方を非表示にします。 |
💡 ヒント
1 つのパネル内では、できるだけ 1 つのセットに統一してください。同じフォントの色の単色の標準アイコンが並んでいると、ひとまとまりに見えます。標準アイコン、アプリ アイコン、ファイルの種類のアイコンを混在させると、ごちゃごちゃした印象になり、タイトルよりもロゴに視線が向いてしまいます。
❗ 重要
セットのアイコンは Web パーツに同梱されているため、追加のアクセス許可は不要です。カスタム画像は、指定したアドレスから読み込まれます。閲覧者はその場所への読み取りアクセス権を持っている必要があります。
