--- title: "Smart Tiles でタイルを追加および編集する方法" description: "Vitextra Smart Tiles Web パーツで個々のタイルを操作する方法を説明します。タイルの追加、タイトル、説明、リンク、新しいタブで開く、対象ユーザーを設定する [プロパティ] ダイアログ、コンテキスト メニュー、使用できるリンク形式、ドラッグ アンド ドロップによるタイルの並べ替え、タイルの削除について紹介します。" url: https://vitextra.com/ja/support/kb/10242 language: ja published: 2026-10-13 modified: 2026-10-17 products: - "Smart Tiles" author: "Vitālijs Kalniņš" tags: ["Smart Tiles タイル追加", "タイルのプロパティ編集", "タイルのコンテキスト メニュー", "タイルのリンク URL", "新しいタブで開く", "タイルのドラッグ アンド ドロップ", "タイル削除", "タイルの説明", "mailto tel リンク タイル", "Vitextra Smart Tiles 編集"] --- # Smart Tiles でタイルを追加および編集する方法 Vitextra Smart Tiles Web パーツで個々のタイルを操作する方法を説明します。タイルの追加、タイトル、説明、リンク、新しいタブで開く、対象ユーザーを設定する [プロパティ] ダイアログ、コンテキスト メニュー、使用できるリンク形式、ドラッグ アンド ドロップによるタイルの並べ替え、タイルの削除について紹介します。 ## はじめに [Smart Tiles](https://vitextra.com/ja/products/smart-tiles) では、すべてのタイルを、表示されている場所、つまりページ上の編集モードで編集します。メンテナンスが必要な別個のリンク リストはありません。この記事では、個々のタイルの編集ツール (追加、**Properties** (プロパティ) ダイアログ、コンテキスト メニュー、並べ替え、削除) について説明します。タイルの見た目 (色、アイコン、画像、サイズ) については、末尾にリンクを掲載している個別の記事で説明しています。 手順を実行するには、ページを編集モードで開きます。すると、Web パーツのタイルの下に **Add Tile** (タイルの追加)、**Export** (エクスポート)、**Import** (インポート) の各ボタンが表示され、各タイルの右上隅に **…** ボタンが表示されます。 ## タイルの追加 パネルの下にある **Add Tile** をクリックします。末尾に新しいタイルが追加されます。タイトルはプレースホルダー (たとえば *Tile #4*)、色はテーマの最初のアクセント カラー、文字は白、アイコンは SharePoint アイコンで、リンクはどこにもつながらないプレースホルダーです。すぐにプロパティを開いて、タイトルとリンクを設定します。 ![新しく追加されたタイル](https://static.vitextra.com/articles/10242/new-tile-ja.png) *新しく追加されたタイル* ## コンテキスト メニュー タイルの隅にある **…** ボタンをクリックすると、コンテキスト メニューが開きます。タイルに関して変更できるすべての操作は、ここから始まります。 |::項目::|::機能::| |:---|:---| |**Edit Properties**|タイルのテキスト、リンク、ターゲット、対象ユーザーを設定する **Properties** ダイアログを開きます。| |**Size**|**Extra Small** から **Full Width** までの 6 種類の幅から 1 つを選択します。| |**Background Color**|背景色、背景画像、または YouTube リンクの場合は動画のサムネイルを選択します。| |**Font Color**|タイトル、説明、標準アイコンの色を選択します。| |**Tile Icon**|5 つのアイコン セットのいずれかを開くか、カスタム画像を選択します。| |**Remove**|タイルを削除します。| ![タイルのコンテキスト メニュー](https://static.vitextra.com/articles/10242/context-menu-ja.png) *タイルのコンテキスト メニュー* ## Properties ダイアログ **Edit Properties** を選択してダイアログを開きます。ダイアログはタイトル バーをドラッグして横に移動できるため、編集中もタイルを表示したままにできます。 ![タイルの Properties ダイアログ](https://static.vitextra.com/articles/10242/properties-dialog-ja.png) *タイルの Properties ダイアログ* |::フィールド::|::説明::| |:---|:---| |**Title**|タイルに表示されるテキストです。1 行で表示され、収まらないタイトルは省略記号で切り詰められるため、短くしてください。| |**Description**|小さな文字で表示される、省略可能な 2 行目です。タイルのヒント (ツールヒント) にも表示されます。最大 2 行まで入力できますが、タイルには説明が 1 行で表示されます。| |**URL**|タイルが開くリンクです。必須で、使用できる形式は以下に一覧にしています。リンクが有効でない間は、**Save** は無効のままです。| |**Open in new tab**|現在のウィンドウではなく、新しいブラウザー タブでリンクを開きます。アプリケーションを起動するリンク (電子メール、電話、テキスト メッセージ、Teams) はタブを開くことがないため、これらのリンクではこのオプションは使用できません。| |**Audience**|タイルを表示するメンバーが属する、サイトの SharePoint グループまたは Microsoft Entra ID グループです。フィールドを空のままにすると、タイルはすべてのユーザーに表示されます。| **Save** をクリックして変更を適用するか、**Cancel** をクリックして変更を破棄します。 ### 使用できるリンク形式 |::リンク::|::例::| |:---|:---| |Web アドレス|`https://contoso.sharepoint.com/sites/hr`| |現在のテナント上のパス|`/sites/hr/Shared Documents/Handbook.pdf`| |現在のページ内のアンカー|`#benefits`| |電子メール|`mailto:helpdesk@contoso.com`| |電話番号|`tel:+15551234567`| |テキスト メッセージ|`sms:+15551234567`| |Microsoft Teams|`msteams:/l/chat/0/0?users=helpdesk@contoso.com`| 同じテナント上のコンテンツには、相対パスを使用するのが最も安全です。パネルを別のサイトにエクスポートしたり、サイトを移動したりしても、リンクは引き続き機能します。 📝 **注** YouTube 動画へのリンク (`youtube.com`、`youtu.be`) は自動的に認識されます。タイルにはアイコンの代わりに再生ボタンが表示され、**Background Color** メニューでは動画の**サムネイル**を背景として選択できます。 ## タイルの並べ替え マウスでタイルを新しい位置にドラッグします。他のタイルは場所を空けるように移動します。新しい順序はページとともに保存されます。 ![ドラッグ アンド ドロップによるタイルの並べ替え](https://static.vitextra.com/articles/10242/drag-and-drop-ja.png) *ドラッグ アンド ドロップによるタイルの並べ替え* ## 編集モードでの対象ユーザー設定付きタイル 対象ユーザーが設定されているタイルには、編集モードで左上隅に小さな人物アイコンが表示され、対象ユーザー設定付きのタイルを他のタイルと区別できます。編集モードでは、作成者には対象ユーザーに関係なくすべてのタイルが表示されます。フィルター処理は、公開されたページに適用されます。 ## タイルの削除 コンテキスト メニューで **Remove** を選択します。確認なしで、タイルはすぐに消えます。誤ってタイルを削除した場合は、保存せずにページを閉じるか、ページのバージョン履歴を使用して以前のバージョンを復元してください。 ❗ **重要** タイルへの変更はページに保存されます。変更が訪問者に表示されるのは、ページを再公開した後のみです。それまでは、訪問者には以前のバージョンのパネルが表示されます。 💡 **ヒント** タイルの見た目を変更するには、[KB10043. Smart Tiles のタイルの色](https://vitextra.com/ja/support/kb/10043)、[KB10243. タイルのアイコンの選択](https://vitextra.com/ja/support/kb/10243)、[KB10245. タイルの背景画像の設定](https://vitextra.com/ja/support/kb/10245)、[KB10247. Smart Tiles のタイル サイズとレイアウト](https://vitextra.com/ja/support/kb/10247)を参照してください。