SharePointでは、Webパーツを利用することでHTMLの埋め込みが可能です。しかし、どのように対応すれば、HTMLの埋め込みができるのか操作に不安を感じる人もいるでしょう。
本記事では、SharePointでHTMLの埋め込みをする方法や注意点について解説します。SharePointをより効果的に活用したいと考えている人は、本記事を参考に、HTMLの埋め込みに挑戦してみてください。
SharePointより検索が強いナレッジ共有ツール「NotePM」
目次
SharePointでHTMLの埋め込みをする3つの方法
SharePointでHTMLの埋め込みをする方法は、以下の3つです。
- Webサイトアドレスを使用する
- 埋め込みコードを使用する
- ASPXファイルを活用する
それぞれのやり方を把握し、自社に合った方法を検討しましょう。
Webサイトアドレスを使用する
Webサイトアドレスを使用する場合は、事前に埋め込みたいコンテンツのあるWebサイトに移動し、リンクアドレスをコピーしておきます。HTMLを埋め込む方法は、以下のとおりです。
- ページ右上の「編集」をクリックする
- ツールボックスから「すべての Web パーツを表示」を選択する
- 「埋め込み </>」を選択またはドラッグ＆ドロップする
- 「プロパティの編集」を選ぶ
- コピーした Web サイトアドレスを貼り付ける
ただし、Webサイトアドレスを使用できるのは、特定のサービスを提供しているサイトだけです。Webサイトアドレスを使用できないサイトでは、埋め込みコードを使用しましょう。
埋め込みコードを使用する
埋め込みコードとは、別のページのコンテンツの表示方法を説明する特殊な指示の一覧のことです。
多くのサイトでは「埋め込みコード」や「/><」というラベルのボタンから簡単に取得できます。埋め込みコードを使用すれば、より柔軟にコンテンツを表示できるでしょう。
具体的な方法は、以下のとおりです。
- ツールボックスから「埋め込み</>」のWebパーツを選択する
- 「埋め込みコードを追加」をクリックする
- 埋め込みコードを入力する
- コンテンツの表示を確認する
- 「発行」または「再発行」をクリックして完了
単純にリンクを貼りたいだけの場合は、「リンク」機能の使用がおすすめです。
ASPXファイルを活用する
通常、SharePointに直接HTMLファイルをアップロードしても、単なるダウンロードファイルとして扱われるため、ページとしての閲覧はできません。
しかし、HTMLファイルの拡張子とファイル内のすべてのリンク先を.aspxに変換することで、ページとしての閲覧が可能になります。具体的な方法は、以下のとおりです。
- HTMLファイルの拡張子とファイル内のリンク先をすべて.aspxに変換する
- PowerShellでカスタムスクリプトを許可する
- サイトコレクション管理者権限でファイルをアップロードする
アップロードする際は、必ずサイトコレクション管理者権限を持つアカウントで実施しなければなりません。また、アップロード後にファイルを一度削除して再アップロードが必要になる可能性もあります。
SharePointより検索が強いナレッジ共有ツール「NotePM」
SharePointでHTMLを埋め込む際の3つの注意点
SharePointでHTMLを埋め込む際の注意点は、以下の3つです。
- ドメイン設定をする
- HTTPS要件を満たしているか確認する
- 埋め込むコンテンツのサイズを確認する
注意点を把握しておくことで、スムーズに作業を進められるでしょう。
ドメイン設定をする
カスタムスクリプトがオフの場合、埋め込みWebパーツのみに適切な設定ができるようになります。基本的な設定は、以下のとおりです。
- サイトコレクション全体でiFrameの使用を完全に禁止可能
- 任意のドメインからのiFrame挿入を許可可能（セキュリティ上非推奨）
- 特定のドメインのみからのiFrame挿入を許可可能
HTMLフィールドでは、指定された外部ドメインからの埋め込みのみ許可されます。管理者は必要に応じてドメインリストの追加・削除ができるので、特定のWebドメインを選択して個別に削除することも可能です。
HTTPS要件を満たしているか確認する
SharePointでは、セキュリティ確保のためHTTPS要件を満たすWebサイトのみ埋め込みが可能です。Webサイト側でも埋め込みを許可する設定が必要なので、許可されていないとエラーメッセージが表示されます。
また、埋め込みコードは、<iframe>タグでなければなりません。<script>タグを使用する埋め込みコードには対応していないため、事前に埋め込みコードの形式を確認しておきましょう。
埋め込むコンテンツのサイズを確認する
大きなページや複雑な構造を持つコンテンツを埋め込むと、ページの読み込みに時間がかかる可能性があります。
また、PCやスマートフォン・タブレットなど、デバイスによって、表示が異なるケースもあるので注意が必要です。レスポンシブデザインに対応していないコンテンツは、モバイル端末での閲覧時に表示が崩れる可能性があるため、事前に確認しておきましょう。
悪意のあるコードやウイルスが含まれているコンテンツもあるので、信頼できるソースからのファイル取得を心がけるのも重要です。
SharePointでHTMLが埋め込みできない場合の対処法
SharePointでHTML埋め込みできない場合の対処法は、以下のとおりです。
- アクセス権限を確認する
- ドメインの許可設定を確認する
対処法を知っておくことで、HTMLの埋め込みがうまくいかなくてもすぐに対処できるでしょう。
アクセス権限を確認する
SharePointでは、適切なアクセス権限が付与されていないとHTMLを正しく埋め込めません。アクセス権限の確認方法は、以下のとおりです。
- SharePointサイトの歯車アイコンから設定メニューを開く
- サイト情報メニューから「すべてのサイト設定を表示」を選択する
- サイトコレクション管理グループ内の「HTMLフィールドセキュリティ」を選ぶ
特定のドメインのみに許可を与えたい場合は、「指定したドメインからのみiFrame挿入を許可」を選択しましょう。
ドメインの許可設定を確認する
「このWebサイトからのコンテンツの埋め込みは許可されていません」というエラーメッセージが表示される場合は、SharePointサイトのURLをホワイトリストに登録する必要があります。
サイトコレクション管理者権限を持つユーザーしか、設定ができないので注意しましょう。
SharePointより検索が強いナレッジ共有ツール「NotePM」
SharePointでHTML以外に埋め込める主なWebパーツ
SharePointでHTML以外に埋め込める主なWebパーツは、以下の5種類です。
- テキスト
- 画像
- イベント
- ドキュメントライブラリ
- ヒーロー
- ファイルとメディア
主要なパーツを知ることで、サイトを効果的にカスタマイズできるでしょう。
テキスト
テキストは、テキストの表示と書式設定ができるパーツです。基本的な段落の追加だけでなく、豊富な書式設定オプションにより、見やすく魅力的なコンテンツを作成できます。
具体的に利用できる機能は、以下のとおりです。
- テキストのスタイル設定
- インデント調整
- 強調表示
- ハイパーリンクの設定
- 箇条書き作成
- テーブルの追加
そのほかに、ニュース記事のような洗練された見た目に調整したり、画像を直接ドラッグして挿入したりすることも可能です。
画像
画像は、さまざまな形式の画像を簡単に挿入できるパーツです。
PNGやJPEGなど一般的な画像形式に対応しているため、ビジネス文書やプレゼンテーションに必要な画像を効果的に表示できます。挿入後の画像には、キャプションの追加やトリミング・サイズ調整・リンク設定などの編集も可能です。
ヘッダーやフッターの画像設定に画像パーツを活用することで、統一感のある高品質なページデザインを実現できるでしょう。
イベント
イベントは、会社やチームのイベントや会議の予定を効果的に表示・管理できるパーツです。予定の追加や編集が簡単にできるだけでなく、場所情報やマップ表示・オンライン会議情報なども含めた詳細なスケジュールを管理できます。
Outlookの予定表と比べてチームメンバーの予定把握が直感的にできるので、複数人が関わるスケジュール管理におすすめです。メンバー全員が最新の予定情報を簡単に共有できる環境を構築できるため、効率良くスケジュール管理を進められるでしょう。
＞関連記事：SharePointの予定表を徹底解説！基礎からカスタマイズ・よくあるトラブルの対処法まで紹介
ドキュメントライブラリ
ドキュメントライブラリは、Windowsのエクスプローラーに似た使い勝手で、ファイルやフォルダーを効率的に管理できるパーツです。
OneDriveやSharePointに保存されているコンテンツを直感的に表示・整理できます。タイトルの設定やビューの調整、サイズの変更など、用途に応じたカスタマイズも可能です。
「すべて表示」機能を使用することで、完全なドキュメントライブラリへも移動できるので、チーム内でスムーズにファイル共有ができるでしょう。
ヒーロー
ヒーローは、画像とテキストを組み合わせたレイアウトを作成できるパーツです。最大5枚までの画像表示に対応しており、それぞれの画像にリンクを設定できます。
説得力のある画像と文字列を組み合わせることで、ページの重要なコンテンツを効果的に強調できる視覚的な関心を引くデザインを実現できるでしょう。5種類の異なるレイアウトパターンから、目的に応じた最適なデザインを選択できます。
また、ヒーローパーツは、コミュニケーションサイトにデフォルトで含まれていますが、他のページにも追加可能です。
ファイルとメディア
ファイルとメディアは、ページ内で直接ライブラリのファイルを表示できるパーツです。ドキュメントライブラリパーツと連携することで、効率的なファイル管理ができます。
対応している主なファイル形式は、以下のとおりです。
- Excel
- Word
- PowerPoint
- 3Dモデル
ファイルを開かずに内容を確認できるため、マニュアルや仕様書・社内規定・各種フォーマットなど、頻繁に参照される文書の管理におすすめです。
NotePMはSharePointの代わりに使えます
マニュアル作成・ナレッジ共有ツール の「NotePM」なら、チームサイト（ポータルサイト）に載せた情報の一部を、社外にも簡単に共有できます。
NotePM は、ドキュメントの共同編集ができるだけでなく、アクセス制御を柔軟に変えられるので、セキュリティ対策も万全です。過去180日分のログイン履歴もチェックできるため、他部署や社外のメンバーにも安全にページやファイルを共有できるでしょう。
＞関連記事：SharePointの概要・機能・独自性・料金などを徹底解説
SharePointより検索が強いナレッジ共有ツール「NotePM」
SharePointを活用して使いやすいサイトを作成しよう
SharePointでは、Webパーツを使用し、サイトアドレスか埋め込みコードを入力することで埋め込みが可能です。
しかし、HTTPSで始まるサイト安全なサイト以外は埋め込みができないので注意しましょう。Microsoft365を導入していない企業の場合は、「NotePM」を代わりに使用することも可能です。
マニュアル作成・ナレッジ共有ツール「NotePM」は、社員のナレッジを集め、共有できます。検索性も高く、ほしい情報がすぐに手に入り、情報の更新も容易です。
「社内のナレッジをスムーズに共有したい」「教育コストを削減したい」とお考えの方は、NotePMの無料トライアルを試してみてください。
