Liferayフロントエンド情報バー
情報バーには、サイドバーの追加情報の表示を切り替えるボタンがあります。 これは、ファイルサイズ、タイプ、URLなど、検索結果のより詳細なメタデータを提供するのに最適です。
構成には、情報バー（およびボタン）とサイドバーパネルの2つの重要な部分があります。
情報バー：
<liferay-frontend:info-bar>
<liferay-frontend:info-bar-buttons>
<liferay-frontend:info-bar-sidenav-toggler-button
icon="info-circle"
label="my info"
/>
</liferay-frontend:info-bar-buttons>
</liferay-frontend:info-bar>
<liferay-frontend:info-bar-sidenav-toggler-button>タグは、icon属性にClayアイコンを使用します。
サイドバーパネル：
<div class="closed container-fluid-1280 sidenav-container sidenav-right" id="<portlet:namespace />infoPanelId">
<liferay-frontend:sidebar-panel>
<div>
<h2>sidebar content</h2>
<p>Here is some content</p>
</div>
</liferay-frontend:sidebar-panel>
</div>
サイドバーパネルのラッパー<div>に、クラスclosedとsidenav-rightがあることに注目してください。 情報ボタンは、クラスopenとclosedを切り替え、サイドバーパネルの表示と非表示を切り替えます。 sidenav-rightクラスは、パネルが右側で開く必要があることを指定しています。
上記の例では、使用可能な属性のいくつかを使用しています。 タグで使用可能な属性の完全なリストについては、 情報バー 、 情報バーボタン 、 情報バーサイドナビゲーショントグルボタン 、および サイドバーパネル のtaglibdocを参照してください。