モバイル ホーム ページをカスタマイズする

  • [アーティクル]

最終更新日: 2011年2月2日

適用対象: SharePoint Foundation 2010

このチュートリアルでは、カスタム RenderingTemplate コントロールを実装することでモバイル ホーム ページをカスタマイズする方法を紹介します。例では、ホーム ページのヘッダー セクションのカスタマイズ方法を説明します。モバイル ホーム ページの任意のセクションをカスタマイズする手順の概要については、「[方法] モバイル ホーム ページをカスタマイズする」を参照してください。

カスタマイズ前

TemplateName プロパティが WebPartMobileSummaryViewTitle に明示的に設定されている SPMobileComponent オブジェクトを、チーム サイト (STS) のモバイル ホーム ページとして使用する mblwiki.aspx ファイルの両方の HeaderTemplate 要素に宣言します。この要素の 1 つを次に示します。

<HeaderTemplate>
  <SPMobile:SPMobileControlContainer RunAt="Server" Weightless="true">
    <SPMobile:SPMobileComponent RunAt="Server" 
       TemplateName="WebPartMobileSummaryViewTitle" />
    <SPMobile:SPMobileComponent RunAt="Server" 
       TemplateName="MobileDefaultSeparator" />
  </SPMobile:SPMobileControlContainer>
</HeaderTemplate>

このオブジェクトは、ID が "WebPartMobileSummaryViewTitle" の MobileDefaultTemplates.ascx 内にある RenderingTemplate を呼び出します。RenderingTemplate は次のとおりです。

<SharePoint:RenderingTemplate RunAt="Server" 
  id="WebPartMobileSummaryViewTitle">
  <Template>
    <SPMobile:SPMobileWebTitle RunAt="Server" Prefix="WebPartMobile" />
  </Template>
</SharePoint:RenderingTemplate>

この例に示されているように、レンダリング テンプレートは、クラス SPMobileWebTitle のテンプレート セレクター オブジェクトを呼び出します。テンプレート セレクター オブジェクトは、WebPageMobile_STS_HomePage_Title というレンダリング テンプレート ID を構築し、その ID を持つレンダリング テンプレートを呼び出します。その ID を持つレンダリング テンプレートがない場合、WebPageMobile_Default_HomePage_Title という名前のレンダリング テンプレートが使用されます。

Microsoft SharePoint Foundation には、ID Mobile_STS_HomePage_Title を持つ RenderingTemplate は用意されていません。このチュートリアルでは、ホーム ページのタイトルを 2 色のパネル内でレンダリングするレンダリング テンプレートを作成します。カスタマイズの前に、WebPageMobile_Default_HomePage_Title によって、STS ホーム ページのタイトルが次の画面ショットのようにレンダリングされます。タイトルのテキストは、対応するモバイル以外の STS ホーム ページのタイトルから引用されます。テキストは、濃い青色のパネルの内側に白の文字でレンダリングされます。

チーム サイト ホーム ページのタイトル領域の既定のレンダリング

カスタマイズされていないモバイルのホーム ページ

手順

STS モバイル ホーム ページのヘッダー セクションをカスタマイズするには

  1. Microsoft Visual Studio で、空の SharePoint プロジェクトを作成し、そのプロジェクトをサンドボックス ソリューションではなくファーム ソリューションにします。

  2. [SharePoint のマップされたフォルダー] を TEMPLATE\ControlTemplates に追加します。

  3. 新しいフォルダーを右クリックし、SharePoint ユーザー コントロールを追加します。.ascx ファイルに、他のソリューション プロバイダーの名前と簡単に区別できる名前 (ContosoMobileRenderingTemplates.ascx など) を付けます。Visual Studio により、ファイルが SharePoint Solution マニフェストに自動的に追加され、%ProgramFiles%\Common Files\Microsoft Shared\web server extensions\14\TEMPLATE\ControlTemplates に展開されるように設定されます。

    ヒントヒント

    ソリューション エクスプローラーでプロジェクトを右クリックしてユーザー コントロールを追加しないでください。この方法でユーザー コントロールを追加すると、Visual Studio は、そのコントロールを TEMPLATE\ControlTemplates のサブフォルダーに追加します。その後、Visual Studio は、移動されなかったコントロールを、%ProgramFiles%\Common Files\Microsoft Shared\web server extensions\14\TEMPLATE\ControlTemplates の対応するサブフォルダーに展開します。サブフォルダー内のモバイル版のレンダリング テンプレートは読み込まれません。

  4. .ascx.cs ファイルと .ascx.designer.cs (または .ascx.vb および .ascx.designer.vb) ファイルを削除します。これらのファイルはこのプロジェクトでは必要ありません。

  5. .ascx ファイルのディレクティブ セクション全体を次のマークアップで置き換えます。

    <%@ Register TagPrefix="GroupBoardMobile"   Namespace="Microsoft.SharePoint.Applications.GroupBoard.MobileControls" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Control Language="C#"   %> 
<%@ Assembly Name="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 
<%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile, Version=1.0.3300.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a" %> 
<%@ Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 
<%@ Register TagPrefix="SPMobile" Namespace="Microsoft.SharePoint.MobileControls" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 
<%@ Register TagPrefix="WPMobile" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>

  6. ディレクティブの下に、次のマークアップを追加します。これにより、STS ホーム ページのヘッダー領域をレンダリングするときにページ パーサーが検索する ID を持った RenderingTemplate が作成されます。

    <SharePoint:RenderingTemplate 
  ID="WebPartMobile_STS_HomePage_Title" RunAt="Server">


</SharePoint:RenderingTemplate>

  7. RenderingTemplate 要素内で、SPMobilePaddedPanel 子コントロールを持つ Template 要素を定義します。次の例に示すように、ラベルの ForeColor 属性、BackColor 属性、Font-Size 属性、および Font-Bold 属性を設定します。

    <Template>
    <SPMobile:SPMobilePaddedPanel RunAt="Server" 
      ForeColor="#FFFFFF" 
      BackColor="#990033" 
      Font-Bold="True" 
      Font-Size="13pt">
      <WPMobile:WebPartMobilePageTitle RunAt="Server" />
    </SPMobile:SPMobilePaddedPanel>
</Template>

  8. [ビルド] メニューで [ソリューションの展開] を選択します。これにより, .ascx ファイルが自動的に保存され、%ProgramFiles%\Common Files\Microsoft Shared\web server extensions\14\TEMPLATES\ControlTemplates に展開され、Web アプリケーションがリサイクルされるので、そのフォルダーにあるすべての .ascx ファイルが再度読み込まれます。

  9. デバイスまたはエミュレーターを使用して、展開内の任意の STS サイトのホーム ページに移動します。濃い青色のパネル内にある赤い内部パネルにタイトルが表示されるはずです (外部のパネルは、mblwiki.aspx ページに直接宣言されているため、カスタマイズでそのパネルを削除することはできません。これを削除する場合、STS サイト用の新しいホーム ページを作成し、ホーム ページのリダイレクトを使用してモバイル デバイスを新しいページにリダイレクトする必要があります。ホーム ページのリダイレクトの詳細については、「ホーム ページのリダイレクト」と「[方法] リダイレクションを使用してモバイル ホーム ページをカスタマイズする」を参照してください)。

ホーム ページ内のカスタマイズされたヘッダー セクション

関連項目

タスク

[方法] モバイル ホーム ページをカスタマイズする

概念

モバイル ページのレイアウトと改ページ

モバイル ページのレンダリング システム