第11章 Liquid: デベロッパーポータル

このセクションでは、マークアップのさまざまな要素、その要素のつながり、デベロッパーポータルでの使用方法の簡単な例など、Liquid フォーマットのタグおよびそれらが 3scale システム内で機能する仕組みについて説明します。

Liquid の基本を知るには、『Liquid Reference』を参照してください。

11.1. デベロッパーポータルでの Liquid の使用

本セクションでは、レイアウトおよびページで Liquid マークアップ処理を有効にする方法を説明します。

11.1.1. Liquid の有効化

Liquid マークアップ処理は、すべてのパーシャルとメールテンプレートに対してデフォルトで有効です。レイアウトで Liquid を有効にするには、system_name 入力フィールドの右下にあるチェックボックスを選択します。ただし、ページで有効にする場合は、そのページの ADVANCED OPTIONS セクションに移動する必要があります。

developer portal configuration liquids enable

ADVANCED OPTIONS セクションを展開して、Liquid enabled チェックボックスを選択します。これ以降、Liquid マークアップはすべて内部エンジンで処理され、デベロッパーポータルの組み込みエディターでも、Liquid コードが強調表示されます。

11.1.2. ページ、パーシャル、およびレイアウトでの使用方法の違い

Liquid の使用方法は通常、ページ、パーシャル、およびレイアウトによって若干異なります。ページ内では、Liquid は使用が 1 回限りの要素ですが、Liquid をパーシャルやレイアウトと併用すると、デベロッパーポータルで再利用できる要素になります。つまり、さまざまなページに少しずつ変更を加えて複数のレイアウトまたはパーシャルを適用するのではなく、論理 Liquid タグを追加して、ユーザーが操作するページに応じてレウアウトを変更できるということです。

<!-- if we are inside '/documentation' URL -->
<li class="{% if request.request_uri contains "/documentation" %}active{% endif %}"><!-- add the active class to the menu item -->
  <a href="/documentation">Documentation</a>
</li>

11.1.3. CSS/JS との使用

Liquid マークアップは HTML で機能するだけでなく、CSS や JavaScript コードと簡単に組み合わせて制御を強化することもできます。スタイルシートまたは JS で Liquid を有効にするには、これをページとして作成し、通常のページで有効にするのと同じ手順に従います。これにより、CSS に条件マークアップを追加することや、JavaScript でサーバー側のデータを使用することが可能です。ページのコンテンツタイプを CSS または JS として設定するのを忘れないでください。

11.2. メールテンプレートでの Liquid の使用

本セクションでは、Liquid タグを使用してメールテンプレートをカスタマイズする方法を説明します。

11.2.1. デベロッパーポータルでの使用との相違点

前述のように、Liquid タグを使用してユーザーに送信されるメールテンプレートをカスタマイズすることもできます。前述した Liquid を記述する際の一般規則は、すべてメールテンプレートにも適用されますが、一部の例外があります。

  • すべてのテンプレートで利用可能な、一般に共有される変数リストはありません。代わりに、前述の {% debug:help %} タグを使用してテストを行う必要があります。
  • 電子メールは本質的に Web ページとは異なるため、使用に制約のあるタグや使用できないタグがあります。たとえば、電子メールには URL がないため、{{ request.request_uri }} は意味を持ちません。

11.3. トラブルシューティング

このトラブルシューティングセクションは、一般的に発生する可能性のあるエラーをデバッグして修正する場合に役立ちます。

11.3.1. デバッグ

正常に保存はされているが何かが意図したとおりに機能しない場合は、以下の点を確認してください。

  • すべてのタグが正しく閉じられていること。
  • 現在のページで利用可能な変数を参照していること。
  • 配列へのアクセスを試みていないこと (たとえば、current_account.applications はアプリケーションの配列です)。
  • 論理が正しいこと。

11.3.2. 典型的な誤りとその解決方法

  • Liquid エラーのためにドキュメントを保存できない原因は、通常タグまたはドロップが正しく閉じられていないことです。{% %} タグや {{ }} タグがすべて正しく閉じられていること、また iffor などの論理式が endifenfor などで正しく終了していることを確認します。この場合は通常、エディターの上のページ最上部に、エラーを説明するメッセージと共にエラーが表示されます。
  • すべてが正しく保存されているにも関わらずタグの効果が見られない場合、空の要素を参照していないか、また、コンテンツの表示に論理タグを使用していないかを確認します。すでにより複雑なタグとドロップのセットのエイリアスであるタグでの使用を除き、{% %} がコンテンツをレンダリングすることはありません。
  • # 記号のみが表示される場合は、表示しようとしている要素が配列であることを意味します。「Hierarchy」セクションを確認してください。

11.3.3. サポートへの問い合わせ

問題が解決しない場合は、Red Hat カスタマーポータル から新しいケースを作成することができます。