ポータル Web テンプレートの概要

完了

Liquid は、ページに動的コンテンツを追加するために使用できる オープンソース テンプレート言語 です。 Liquid コードは、Web ページ、コンテンツ スニペット、Web テンプレートのコンテンツを含む、HTML またはテキスト コンテンツを入力可能なポータルの任意の場所で使用できます。

Liquid には、コンテンツを作成して、変革を適用し、実装フローを制御するのに役立つさまざまな言語構成要素があります。 FetchXML クエリ言語を使用するか、または識別子により直接エンティティを取得することによって Microsoft Dataverse データにアクセスする機能を提供する Liquid は、データ駆動型の Web ページを作成するための第一選択肢となります。 また、多くの特別なタグ (または処理命令) を含み、再利用可能な Web テンプレートの作成を特にターゲットとしています。 次のセクションでは、Microsoft Power Apps ポータルでテンプレートを使用する方法について説明します。

テンプレート

Power Apps ポータルでは、ポータルでレンダリングされた場合、Web ページはページの外観を定義しません。 その代わりに、レイアウトと動作を定義する ページ テンプレート レコードにリンクされます。

Power Apps ポータルで使用できるテンプレートには次の 2 つのタイプがあります。

  • 書き換え - これらのテンプレートでは、サーバー側の処理を使用して、一部のコンポーネントと特別なページ (エラーページ、サイト マップ、検索など) に必要な特殊な動作を実装します。
  • Web テンプレート - リンクされたレイアウト テンプレートは、ページのコンテンツを出力用にどのようにレンダリングするかを定義します。

書き換え テンプレートは、カスタマイズ機能が限定されています。 Liquid テンプレート言語はコンテンツまたはコンテンツ スニペットの一部として使用できますが、ページ レイアウトと動作は事前に定義されています。

一方、Web テンプレート オプションは完全にテンプレートを基にしており、Liquid を使用して、コンテンツのレンダリング方法を定義します。 テンプレートは柔軟です。 テンプレートには、コンテンツの一部として他のテンプレートを含めることができます。 また、テンプレートは別のテンプレートを基にして、基本機能を拡張することもできます。 Web テンプレートの一番の強みは、Dataverse データへのアクセスなど、静的コンテンツに処理機能を追加するような Liquid コードを持てることにあります。

ヒント

Web テンプレートには、HTML、カスケード スタイル シート (CSS)、JavaScript を含めることもできます。

Web テンプレートを使用すると、Web ページ全体、ページの一部、またはサイト ヘッダーやフッターなどの一般的な要素を定義することができます。 この方法により、ポータル全体で一貫した外観と動作が生み出され、レンダリングされる外観やデータを簡単に変更できるようになります。 次の例は、一般的な単純なテンプレートを示しています。

<div class="container">
  <div class="page-heading">
    {% include 'Breadcrumbs' %}
    {% include 'Page Header' %}
  </div>
  <div class="row">
    <div class="col-md-12">
    {% block main %}
      {% include 'Page Copy' %}

      {% if page.adx_tablelist %}
        {% include 'table_list' key:page.adx_tablelist.id %}
      {% endif %}
    
      {% if page.adx_tableform %}
        {% tableform id: page.adx_tableform.id %}
      {% endif %}

        {% endblock %}
    </div>
  </div>
</div>

この単純なテンプレートには、共通の部分をレンダリングするための他のテンプレートが含まれており、取得されたテンプレートとは異なる形式でレンダリングできるコンテンツ ブロックを定義しています。また、関連する テーブル リストテーブル フォーム のレコードを使用して Dataverse データをレンダリングします。

Web テンプレート (Web サイトのヘッダーとフッター)

Web テンプレートを使用すると、Power Apps ポータルが使用するグローバル ヘッダーおよびグローバル フッターを上書きすることができます。 このタスクを完了するには、Web サイトの ヘッダー テンプレート または フッター テンプレート フィールドを、選択した Web テンプレートに設定します。

Web テンプレートのヘッダーとフッターのスクリーンショット。

ヘッダー テンプレート フィールドをオーバーライドすると、選択したテンプレートは、通常は既定のヘッダー テンプレートで処理されるサイト インターフェイス要素向けに、プライマリ ナビゲーション、サイン イン/サイン アウト リンク、検索インターフェイスなどをレンダリングする役割を担います。

ヒント

Web サイト レコードでヘッダーまたはフッターのテンプレートを指定しなかった場合は、既定のコンテンツがレンダリングされます。 削除するには、空のテンプレートを指定します。