6.2テーマテンプレートの更新

ご覧のページは、お客様の利便性のために一部機械翻訳されています。また、ドキュメントは頻繁に更新が加えられており、翻訳は未完成の部分が含まれることをご了承ください。最新情報は都度公開されておりますため、必ず英語版をご参照ください。翻訳に問題がある場合は、こちらまでご連絡ください。

6.2テーマテンプレートの更新

Liferay DXP 7.1テーマテンプレートは、Liferay Portal 6.2テーマテンプレートと本質的に同じです。主な変更点は次のとおりです。

VelocityテンプレートはLiferay Portal CE 7.0で非推奨になりましたが、Liferay DXPのFreeMarkerテンプレートを優先して削除されました。この移行の主な理由は次のとおりです。
- FreeMarkerは定期的に開発および保守されていますが、Velocityはもはや積極的に開発されていません。
- FreeMarkerはより高速で、より洗練されたマクロをサポートします。
- FreeMarkerは、タグライブラリを表すメソッドを必要とせずに、タグライブラリを直接使用することをサポートしています。あなたはそれらにボディコンテンツ、パラメータなどを渡すことができます。
Dockbarは置き換えられ、3つの異なるメニューのセットに再編成されました。
- 製品メニュー：現在のサイトのサイトおよびページナビゲーション、コンテンツ、設定、ページを管理し、ユーザーアカウント設定などに移動します。
- コントロールメニュー：コンテンツを構成してページに追加し、シミュレーションウィンドウでページを表示します。
- ユーザーパーソナルバー：通知とユーザーのアバターと名前を表示します。

VelocityテーマテンプレートをFreeMarkerに変換することから始めます。ヘルプについては、Apacheの FreeMarkerドキュメントを参照してください。一般的なLiferay DXP FreeMarker変数とマクロは、 FTL_liferay.ftl

Gulp upgrade タスクを使用した場合、必要なテーマテンプレートの変更がログに記録されます。たとえば、Lunar Resortテーマの6.2から7.0へのアップグレードログと7.0から7.1へのアップグレードログは次のとおりです。

----------------------------------------------------------------
 Liferay Upgrade (6.2 to 7)
----------------------------------------------------------------

File: portal_normal.ftl
    Warning: <@liferay.dockbar /> is deprecated, replace with 
    <@liferay.control_menu /> for new admin controls.
    Warning: not all admin controls will be visible without 
    <@liferay.control_menu />
    Warning: ${theme} variable is no longer available in Freemarker 
    templates, see https://goo.gl/9fXzYt for more information.
[18:57:23] Finished 'upgrade:log-changes' after 5.61 ms
[18:57:23] Finished 'upgrade' after 19 s

----------------------------------------------------------------
 Liferay Upgrade (7.0 to 7.1)
----------------------------------------------------------------

Renamed aui.scss to clay.scss
[19:16:54] Finished 'upgrade:log-changes' after 2.53 ms
[19:16:54] Finished 'upgrade' after 16 min

ログは、削除され廃止されたコードについて警告し、該当する場合は置換を提案します。

Next, you’ll learn how to update various theme templates to Liferay DXP 7.1. テーマテンプレートを変更しなかった場合は、これらのセクションをスキップできます。

ポータル標準FTLの更新

portal_normal.ftlカスタマイズしなかった場合、このセクションはスキップできます。 portal_normal.ftlを更新するには、次の手順に従います。

変更された portal_normal.ftl ファイルを開き、次の6.2ディレクティブを更新された構文に置き換えます。この変更は、 7.0 Breaking Changes リファレンスドキュメントに記載されています。

6.2	更新しました
`${theme.include(top_head_include)}`	`<@liferay_util["include"] page=top_head_include />`
`${theme.include(body_top_include)}`	`<@liferay_util["include"] page=body_top_include />`
`${theme.include(content_include)}`	`<@liferay_util["include"] page=content_include />`
`${theme.wrapPortlet("portlet.ftl", content_include)}`	`<@liferay_theme["wrap-portlet"] page="portlet.ftl"> <@liferay_util["include"] page=content_include /> </@`
`${theme.include(body_bottom_include)}`	`<@liferay_util["include"] page=body_bottom_include />`
`${theme.include(bottom_include)}`	`<@liferay_util["include"] page=bottom_include />`
`${theme_settings["my-theme-setting"]}`	`${themeDisplay.getThemeSetting("my-theme-setting")}`
`${theme.runtime("56", "articleId=" + my_article_id)}`	`<@liferay_portlet ["runtime"] portletName =` `"com_liferay_journal_content_web_portlet_JournalContentPortlet"` `queryString = "articleId =" + my_article_id />`

必要に応じて、パンくずリストとページタイトルコードを削除します。

...

${the_title}

Liferay Portal 6.2テーマで分割ドックバーを使用した場合、 body 要素の class 値から dockbar-split 削除して、以下のマークアップと一致するようにします。
```
<body class="${css_class}">
```
<a href="#main-content" id="skip-to-content"><@ liferay.language key = "skip-to-content" /></a> 要素を見つけ、以下に示す更新されたLiferay UIクイックアクセスマクロに置き換えます。
```
<@liferay_ui["quick-access"] contentId="#main-content" />
```
<@ liferay.dockbar /> マクロを更新されたコントロールメニューマクロに置き換えます。
```
<@liferay.control_menu />
```

navigation.ftl テーマテンプレートに <#if ...></＃if> ラッパーを追加します。

<#if has_navigation && is_setup_complete>
    <#include "${full_templates_path}/navigation.ftl" />
</#if>

コンテンツ <div> をHTML 5 セクション 要素に置き換えます。 セクション 要素はより正確で、スクリーンリーダーのアクセシビリティが向上します。
```
<section id="content">
```
コンテンツ <section> すぐ内側に <h1 class="hide-accessible">${the_title}</h1> ヘッダー要素を追加して、アクセシビリティをサポートします。

テーマのナビゲーションテンプレートを変更した場合は、次のセクションの手順に従います。

ナビゲーションFTLの更新

次の手順に従って、変更した navigation.ftl ファイルを更新します。

<nav class="${nav_css_class}" id="navigation" role="navigation"> 要素の下に、アクセシビリティスクリーンリーダーの次の非表示見出しを追加します。
<@liferay.language key=“navigation” />
レイアウトにアクセスするには、 <#assign nav_item_css_class = "" /> 変数宣言の下に次の変数宣言を追加します。
```
<#assign nav_item_layout = nav_item.getLayout() />
```
<a aria-labelledby="layout_${nav_item.getLayoutId()}"...</a> アンカーの $ {nav_item.icon（）}変数を次の要素に置き換えます。
```
<@liferay_theme["layout-icon"] layout=nav_item_layout />
```

ナビゲーションテンプレートが更新されます。次に、 portlet.ftl を更新できます。

ポートレットFTLの更新

次の手順に従って、変更した portlet.ftl ファイルを更新します。

<a class="icon-monospaced portlet-icon-back text-default" href="${portlet_back_url}" title="<@liferay.language key="return-to-full-page" />"> 要素を見つけて、 リストスタイルのない クラスを追加します。
```
<a 
  class="icon-monospaced list-unstyled portlet-icon-back text-default" 
  href="${portlet_back_url}" 
  title="<@liferay.language key="return-to-full-page" />"
>
```
<div class="autofit-float autofit-row"> 要素を見つけて、 ポートレットヘッダー クラスを追加します。
```
<div class="autofit-float autofit-row portlet-header">
```

ポートレットテンプレートが更新されます。次に init_custom.ftl を更新できます。

InitカスタムFTLの更新

テーマが構成可能なテーマ設定を使用している場合、以下のパターンに従って、新しい構文を使用するように設定を更新します。

元の構文：

<#assign theme_setting_variable = 
getterUtil.getBoolean(theme_settings["theme-setting-key"])>

<#assign theme_setting_variable = 
getterUtil.getString(theme_settings["theme-setting-key"])>

更新された構文：

<#assign theme_setting_variable =
getterUtil.getBoolean(themeDisplay.getThemeSetting("theme-setting-key"))/>

<#assign theme_setting_variable = 
themeDisplay.getThemeSetting("theme-setting-key")/>

たとえば、Lunar Resortテーマの更新されたテーマ設定は次のとおりです。

<#assign show_breadcrumbs = 
getterUtil.getBoolean(themeDisplay.getThemeSetting("show-breadcrumbs"))/>

<#assign show_page_title = 
getterUtil.getBoolean(themeDisplay.getThemeSetting("show-page-title"))/>

テーマテンプレートの変更のすべてではありませんが、ほとんどをカバーしています。他のFreeMarkerテーマテンプレートを変更した場合は、それらを _unstyled テーマテンプレートと比較してください。テーマでLiferay JS Theme Toolkitを使用している場合、Gulp upgrade タスクが報告する提案された変更を参照してください。

ヘルプセンター

製品

リソース

セキュリティ

サポート

ドキュメンテーション

6.2テーマテンプレートの更新

6.2テーマテンプレートの更新

ポータル標準FTLの更新

${the_title}

ナビゲーションFTLの更新

<@liferay.language key=“navigation” />

ポートレットFTLの更新

InitカスタムFTLの更新

関連トピック