SharePoint ホスト型の SharePoint アドインで Web パーツをページに追加する

[アーティクル]
04/08/2023

これは、SharePoint ホスト型の SharePoint アドインの開発の基本に関する記事のシリーズの 5 番目です。SharePoint アドインとこのシリーズの前の記事 (「SharePoint ホスト型の SharePoint アドインの作成を始める | 次の手順」にある記事) をよく理解しておいてください。

注:

SharePoint ホスト型アドインに関するこのシリーズを続けて学習してきた方は、このトピックでも引き続き使用できる Visual Studio ソリューションをお持ちです。また、SharePoint_SP-hosted_Add-Ins_Tutorials でリポジトリをダウンロードし、BeforeWebPart.sln ファイルを開くこともできます。

この記事では、社員オリエンテーション SharePoint アドインの既定のページに Web パーツを追加します。

Web パーツをページに追加する

ソリューションエクスプローラーで、Default.aspx ファイルを開きます。
これから、シアトルの新入社員のリストが表示されるリストビュー Web パーツをページに追加するので、リストビューページに対するリストのリンクが不要になります。 ContentPlaceHolderId が PlaceHolderMainである asp:Content> 要素から< asp:HyperLink> 要素を削除します。<

同じ <asp:Content> 要素内に、次の WebPartZone を追加します。

  <WebPartPages:WebPartZone runat="server" FrameType="TitleBarOnly"
      ID="HomePage1" Title="loc:full" />

ファイルを保存して閉じます。
ソリューションエクスプローラーで、Pages ノードにあるページの elements.xml ファイルを開きます。
File 要素が自己終了する場合、"/" 文字を削除して終了タグ </File> を追加します。
File 要素で、AllUsersWebPart 子要素を追加し、その WebPartZoneID を、対象ページに作成した Web パーツ領域の ID に設定します。ファイルの内容は、次のようになります。このマークアップは、SharePoint に対して、AllUsersWebPart を "HomePage1" という名前の Web パーツ領域に挿入するよう指示します。
```
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
  <Module Name="Pages">
    <File Path="Pages\Default.aspx" Url="Pages/Default.aspx" ReplaceContent="TRUE" >
      <AllUsersWebPart WebPartZoneID="HomePage1" WebPartOrder="1">

      </AllUsersWebPart>
    </File>
  </Module>
</Elements>
```
次のマークアップに示されているように、CDATA 要素を AllUsersWebPart の子として追加し、次に、webParts 要素を CDATA の子として追加します。
```
<AllUsersWebPart WebPartZoneID="HomePage1" WebPartOrder="1">
  <![CDATA[
    <webParts>

    </webParts>
  ]]>
</AllUsersWebPart>
```

次の webPart マークアップを webParts 要素の子として追加します。このマークアップは、XsltListViewWebPart を追加し、シアトルの新入社員リストを表示するよう Web パーツに指示します。 ViewContentTypeId プロパティが、NewEmployee コンテンツタイプの実際の ID ではなく 0x である点に注目してください。

<webPart xmlns="http://schemas.microsoft.com/WebPart/v3">
  <metaData>
    <type name="Microsoft.SharePoint.WebPartPages.XsltListViewWebPart,
                  Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral,
                  PublicKeyToken=71e9bce111e9429c" />
  </metaData>
  <data>
    <properties>
      <property name="ListUrl">Lists/NewEmployeesInSeattle</property>
      <property name="IsIncluded">True</property>
      <property name="NoDefaultStyle">True</property>
      <property name="Title">New Employees in Seattle</property>
      <property name="PageType">PAGE_NORMALVIEW</property>
      <property name="Default">False</property>
      <property name="ViewContentTypeId">0x</property>
    </properties>
  </data>
</webPart>

アドインを実行してテストする

F5 キーを使用して、アドインを展開して実行します。 Visual Studio が、テスト用 SharePoint サイトにアドインを一時的にインストールして、すぐにアドインを実行します。
アドインの既定のページが開くと、リストビュー Web パーツが配置されて、リストが表示されます。

図 1. リストビュー Web パーツを含む既定のページ
リストに新しい項目を追加し、既存の項目を編集してみてください。
デバッグセッションを終了するには、ブラウザーウィンドウを閉じるか、Visual Studio でデバッグを停止します。 F5 を押すたびに、Visual Studio は以前のバージョンのアドインを取り消し、最新のアドインをインストールします。
このアドインおよび他の記事の Visual Studio ソリューションを操作し、ひととおり操作を終了したら前回のアドインを取り消すとよいでしょう。 ソリューションエクスプローラーでプロジェクトを右クリックして、[取り消し] を選択します。

次の手順

このシリーズの次の記事では、SharePoint ホスト型の SharePoint アドインにワークフローを追加します。

次の方法で共有

SharePoint ホスト型の SharePoint アドインで Web パーツをページに追加する

Web パーツをページに追加する

アドインを実行してテストする

次の手順

その他のリソース