この記事では、Liferayプラットフォームを使用する際に、4つの異なるポジションタグリブを使用する方法を説明します。 タグリブは以下の4つです： BodyBottomTag, BodyTopTag, HtmlBottomTag and HtmlTopTag...。
これらのタグリブは、その中に含まれるコードを、DOM（Document Object Model）内の指定された領域の上部または下部に配置します。 また、テーマ内にポートレットを埋め込むこともできます。 本記事では、これらのポジションタグリブの使用方法について、情報および使用例を提供します。
解決策
ポートレットの中に位置タグリブの1つを含めると、ポートレットが埋め込まれているかいないかで、デフォルトの動作が少し違ってきます。
-
ポートレットが埋め込まれていない
ポートレット が 埋め込まれていない場合、taglib は上部または下部にコードを含むことになります。
-
ポートレットが埋め込まれている
ポートレット が 埋め込まれている場合、taglib はコードをインラインで含めることになります。 つまり、ポートレットが埋め込まれている位置と同じ位置に。
埋め込みポートレットがこのように機能するのは、JavaScriptを読み込んだ後に追従するためで、埋め込みポートレットのレンダリング時のパフォーマンス問題を回避するのに役立ちます。
デフォルトの動作として、コードを上部または下部に表示するpositionタグリブを持つポートレットを埋め込みたい場合、そのタグリブの属性position（値 auto ）を利用する必要があります。 以下は、埋め込みポートレットのコードの一部の例です：
アトリビュート・ポジションを使用せずに
<liferay-util:html-bottom>
<script>
console.log('This log will be executed inline.');
</script>
</liferay-util:html-bottom>
アトリビュート・ポジションを使用する：
<liferay-util:html-bottom position="auto">
<script>
console.log('This log will be executed at the bottom.');
</script>
</liferay-util:html-bottom>