テンプレート処理中にエラーが発生しました。
Java method "com.liferay.portal.json.JSONFactoryImpl.createJSONObject(String)" threw an exception when invoked on com.liferay.portal.json.JSONFactoryImpl object "com.liferay.portal.json.JSONFactoryImpl@2ad66ae2"; see cause exception in the Java stack trace.

----
FTL stack trace ("~" means nesting-related):
	- Failed at: navigationJSONObject = jsonFactoryUti...  [in template "17855804202317#32484267#LEARN-ARTICLE-NAV" at line 4, column 9]
----
1<#assign 
2	groupFriendlyURL = themeDisplay.getScopeGroup().getFriendlyURL() 
3	groupPathFriendlyURLPublic = themeDisplay.getPathFriendlyURLPublic() + groupFriendlyURL 
4	navigationJSONObject = jsonFactoryUtil.createJSONObject(navigation.getData()) 
5	navigationMenuItems = 
6
7			"Analytics Cloud": { 
8				"image": "/documents/d${groupFriendlyURL}/analytics_c-svg", 
9				"title": "Analytics Cloud", 
10				"url": "analytics-cloud" 
11			}, 
12			"Commerce": { 
13				"image": "/documents/d${groupFriendlyURL}/commerce_product-svg", 
14				"title": "Commerce", 
15				"url": "commerce" 
16			}, 
17			"DXP": { 
18				"image": "/documents/d${groupFriendlyURL}/dxp_p-svg", 
19				"title": "DXP / Portal", 
20				"url": "dxp" 
21			}, 
22			"Liferay Cloud": { 
23				"image": "/documents/d${groupFriendlyURL}/dxp_c-svg", 
24				"title": "Liferay Cloud", 
25				"url": "liferay-cloud" 
26			}, 
27			"Reference": { 
28				"image": "/documents/d${groupFriendlyURL}/reference-svg", 
29				"title": "Reference", 
30				"url": "reference" 
31
32
33 
34	breadcrumbJSONArray = navigationJSONObject.getJSONArray("breadcrumb") 
35	childrenJSONArray = navigationJSONObject.getJSONArray("children") 
36	parentJSONObject = navigationJSONObject.getJSONObject("parent") 
37	productJSONObject = breadcrumbJSONArray.getJSONObject(breadcrumbJSONArray.length()-1)!navigationJSONObject.getJSONObject("self") 
38	siblingsJSONArray = navigationJSONObject.getJSONArray("siblings") 
39/> 
40 
41<div class="learn-article-nav"> 
42	<#if productJSONObject?has_content && productJSONObject.getString("title")?has_content && navigationMenuItems[productJSONObject.getString("title")]?has_content && navigationMenuItems[productJSONObject.getString("title")].title?has_content> 
43		<div 
44			class="dropdown learn-article-nav-root learn-dropdown" 
45
46			<div class="learn-article-nav-item"> 
47				<div class="d-flex"> 
48					<div class="learn-article-nav-image"> 
49						<img 
50							class="lexicon-icon lexicon-icon-caret-bottom product-icon" 
51							role="presentation" 
52							src='${navigationMenuItems[productJSONObject.getString("title")].image}' 
53							viewBox="0 0 512 512" 
54						/> 
55					</div> 
56 
57					<span class="learn-article-nav-text">${navigationMenuItems[productJSONObject.getString("title")].title}</span> 
58				</div> 
59 
60				<div id="dropdown-icon"> 
61					<svg 
62						class="lexicon-icon lexicon-icon-caret-bottom" 
63						role="presentation" 
64						viewBox="0 0 512 512" 
65
66						<use xlink:href="/o/admin-theme/images/clay/icons.svg#caret-bottom"></use> 
67					</svg> 
68				</div> 
69			</div> 
70 
71			<ul class="dropdown-menu learn-dropdown-menu"> 
72				<#list navigationMenuItems as key, value> 
73					<li> 
74						<a 
75							class="dropdown-item learn-article-nav-item" 
76							href="/w/${navigationMenuItems[key].url}/index" 
77							tabindex="4" 
78
79							<span class="d-flex"> 
80								<span class="learn-article-nav-image"> 
81									<img 
82										class="lexicon-icon lexicon-icon-caret-bottom product-icon mt-0 mr-2" 
83										role="presentation" 
84										src="${value.image}"height: 25px; margin-left: 5px; max-width: none; width: 25px; 
85										viewBox="0 0 512 512" 
86									/> 
87								</span> 
88								<span class="learn-article-nav-text">${value.title}</span> 
89							</span> 
90 
91							<#if navigationMenuItems[productJSONObject.getString("title")].url == value.url> 
92								<span> 
93									<@clay["icon"] symbol="check" /> 
94								</span> 
95							</#if> 
96						</a> 
97					</li> 
98				</#list> 
99			</ul> 
100		</div> 
101	</#if> 
102 
103	<div class="learn-article-nav-content"> 
104		<#if parentJSONObject?has_content && parentJSONObject.getString("url")?has_content> 
105			<div class="learn-article-nav-item learn-article-nav-parent liferay-nav-item p-2"> 
106				<div class="mr-2"> 
107					<a 
108						href='${parentJSONObject.getString("url")}' 
109
110						<svg 
111							class="lexicon-icon lexicon-icon-angle-left" 
112							role="presentation" 
113							viewBox="0 0 512 512" 
114
115							<use xlink:href="/o/admin-theme/images/clay/icons.svg#angle-left"></use> 
116						</svg> 
117					</a> 
118				</div> 
119 
120				<span>${parentJSONObject.getString("title")}</span> 
121			</div> 
122		</#if> 
123 
124		<#if childrenJSONArray.length() gt 0> 
125			<ul class="m-0 p-2"> 
126				<#list 0..childrenJSONArray.length()-1 as i> 
127					<li class="learn-article-nav-item"> 
128						<a 
129							class='liferay-nav-item ${(navigationJSONObject.getJSONObject("self").url == childrenJSONArray.getJSONObject(i).url)?then("selected", "")}' 
130							href="${childrenJSONArray.getJSONObject(i).url}" 
131
132							<span>${childrenJSONArray.getJSONObject(i).getString("title")}</span> 
133						</a> 
134					</li> 
135				</#list> 
136			</ul> 
137		<#elseif siblingsJSONArray.length() gt 0> 
138			<ul class="m-0 p-2"> 
139				<#list 0..siblingsJSONArray.length()-1 as i> 
140					<li class="learn-article-nav-item"> 
141						<a 
142							class='liferay-nav-item ${(navigationJSONObject.getJSONObject("self").url == siblingsJSONArray.getJSONObject(i).url)?then("selected", "")}' 
143							href="${siblingsJSONArray.getJSONObject(i).url}" 
144
145							<span>${siblingsJSONArray.getJSONObject(i).getString("title")}</span> 
146						</a> 
147					</li> 
148				</#list> 
149			</ul> 
150		</#if> 
151	</div> 
152</div> 

Webコンテンツの表示ウィジェットの使用

ウェブコンテンツ記事 を作成した後、それを表示する最も簡単な方法は、ウェブコンテンツ表示ウィジェットです。 ウェブコンテンツ記事が表示されると、 ワークフロー を設定して更新を確認・承認しない限り、コンテンツの更新はすぐに表示されます。

Webコンテンツの表示をページに追加する

  1. Site Menu( Site Menu ) に移動し、 Site BuilderPages に移動します。

  2. 編集したいページの横にある Actions( Actions )をクリックし、 Edit を選択する(あるいは、 、新しいコンテンツページを作成する 。)。

  3. Add( Add widget icon ) をクリックして、Fragments and Widgetsパネルを開きます。

  4. ウィジェットタブの コンテンツ管理 カテゴリーで、 ウェブコンテンツ表示 ウィジェットをページ上の任意の場所にドラッグします。

    Drag-and-drop the web content display widget onto the page

  5. ウィジェットの右上にある Options( Options icon ) → Configuration をクリックします。

    Open the configuration options for the Web Content Display widget

  6. ウェブコンテンツ表示設定]で、[設定]タブの[選択]をクリックします。

  7. [Webコンテンツの選択] ダイアログで、追加したいWebコンテンツをクリックします。

    フォルダを使用してコンテンツを整理している場合、フォルダをナビゲートすることで、利用可能なすべてのコンテンツを視覚化できます。 フォルダやコンテンツセクションの上にあるパンくずを、ナビゲーションの手助けに使ってください。

    When you organize your web content using folders, view all available content by navigating throught the folders.

    tip

    検索バーを使ってすべてのコンテンツ(*)を検索することができます。 これは、サイト上で利用可能なすべてのフォルダとウェブコンテンツのリストを返します。

  8. ウェブコンテンツ表示オプションの設定 .

  9. 保存 をクリックし、[Webコンテンツ表示設定]ダイアログを閉じます。

  10. コンテンツ・ページを公開したい場合は、 公開 をクリックしてください。

ウェブコンテンツ表示ウィジェットでスコープを使用する

ページにWebコンテンツ表示ウィジェットを追加した後、そのスコープを設定して、ウィジェットで表示可能なコンテンツが見つかるサイトとライブラリを定義することができます。 スコープの詳細については、 ウィジェット・スコープを設定する を参照してください。

  1. ウィジェットの右上にある Options( Options icon ) → Configuration をクリックします。

  2. [ウェブコンテンツ表示設定]で、タブの スコープ をクリックします。

  3. Liferay DXP をクリックして Scope メニューを開きます。 ここで、ウィジェットの希望する範囲を選択できます。 [保存]をクリックします。

  4. タブの 設定 をクリックします。

  5. Select をクリックすると、Select Web Content Menuが開きます。

  6. パンくずメニューの サイトとライブラリ をクリックします。

Click on Sites and Libraries option in the breadcrumb menu.

表示可能なコンテンツは、選択されたスコープに従って定義される。

note

Liferay DXP 7.3以前の場合、Webコンテンツ表示ウィジェットのスコープを選択しても、ウィジェットに表示できるコンテンツには影響しません。


## Webコンテンツの表示設定オプション

ウェブコンテンツを選択すると、ウェブコンテンツ表示ウィジェットで他のオプションを設定できます。

ウィジェットの設定にアクセスするには、ウェブ・コンテンツ表示ウィジェットにカーソルを合わせ、ウィジェットの **オプション**(![オプション・アイコン](../../../images/icon-widget-options.png))から、 **設定** を選択します。 設定オプションはSetupタブの下に表示されます。

![Configuration options for the web content display](./using-the-web-content-display-widget/images/04.png)

### テンプレート

| オプション             | 説明                                                                 |
| :---------------- | :----------------------------------------------------------------- |
| デフォルトのテンプレートを使用する | ウィジェットの表示にデフォルトのテンプレートを使用します。 ここで使用されているデフォルトのテンプレートの名前を見ることができます。 |
| 特定のテンプレートを使用する    | 別のテンプレートでウィジェットを表示する場合は、このオプションを選択します。 新しいテンプレートを選択する必要があります。      |

### ユーザーツール

| オプション                    | 説明                                                                                                                                                                                  |
| :----------------------- | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| 翻訳                       | コンテンツの追加翻訳を表示します。 異なる言語に翻訳されたコンテンツをお持ちの場合、このオプションを使用して希望の翻訳を表示します。                                                                                                                  |
| 印刷する                     | 印刷に適したバージョンのコンテンツを含む印刷ダイアログを提供します。                                                                                                                                                  |
| PDF、DOC、ODT、TXTとしてダウンロード | 選択されたウィジェットのコンテンツを任意のフォーマットでダウンロードします。 このオプションは、 [OpenOffice または LibreOffice の統合](#integrating-open-office-or-libre-office-with-the-web-content-display) を設定した後でのみ利用可能です。 |

### メタデータコンテンツ

| オプション        | 説明                                                                                                                                                                                                                                                        |
| :----------- | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| 関連するアセット     | 関連する他のコンテンツへのリンクを表示する場合に設定します。 関連コンテンツは、コンテンツの Related Assets プロパティで設定します(基本的なウェブコンテンツアセットの例については、以下の画像を参照してください)。                                                                                                                                        |
| 評価           | ユーザーがさまざまな方法(いいね、スター、親指をたててグーなど)でコンテンツを評価できるクリック可能なオプションを表示します。 この評価オプションを異なるコンテンツの種類に設定するには、 [コンテンツの評価タイプの設定](../../../site-building/site-settings/site-content-configurations/configuring-content-rating-type.md) を参照してください。 |
| 掲示板のディスカッション | ウェブコンテンツ表示ウィジェットのコンテンツにユーザーがコメントを入力できるようにします。 デフォルトでは、ゲストはコメントを残すことはできません。 デフォルトのオプションを変更するには、 [Enabling Comments for Guest](#enabling-comments-for-guests) を参照してください。                                                                         |
| コメントの評価      | コメントの評価オプションを表示します。                                                                                                                                                                                                                                       |

![Configuring related assets for a basic web content entry](./using-the-web-content-display-widget/images/05.png)

### 閲覧数の増加を確認する

このウェブコンテンツ表示ウィジェットにビューカウンタを追加するには、 **ビューカウント増加** オプションを有効にします。

## Webコンテンツの表示ウィジェットの追加オプション

[セットアップオプション](#web-content-display-setup-options) に加えて、ウェブコンテンツ表示ウィジェットで追加設定を行うことができます。

### ゲストのコメントを有効にする

デフォルトでは、ゲストはWebコンテンツにコメントを残すことはできません。 Webコンテンツの記事にゲストがコメントできるようにするには、次の手順を実行します。

1. [Global Menu](../../../getting-started/navigating-dxp.md) ( ![Global Menu icon](../../../images/icon-applications-menu.png) ) を開き、 **Control Panel** &rarr; **Users** &rarr; **Roles** に移動します。

1. **ゲスト** ロールをクリックします。

1. **Define Permissions** 列をクリックします。

1. 左のメニューから、 **Site and Asset Library Administration** &rarr; **Content & Data** &rarr; **Web Content** を選択します。

1. **ウェブコンテンツの記事** セクションで、 **ディスカッションを追加** をチェックします。

1. [**保存**]をクリックします。

### Webコンテンツの表示ウィジェットからコンテンツを編集する

編集モードのコンテンツページで作業する場合、ウェブコンテンツ表示ウィジェットから公開コンテンツを直接編集できます。

1. ウェブコンテンツ表示ウィジェットをクリックします。

1. 左側のサイドバーパネルで、 **ページコンテンツ**( ![ページコンテンツアイコン](../../../images/icon-paperclip.png))をクリックします。

1. 編集したいコンテンツの **アクション**( ![Actions](../../../images/icon-actions.png) ) をクリックし、 **編集** を選択する。

   ![Open the editing options for the web content display widget](./using-the-web-content-display-widget/images/06.png)

### OpenOfficeまたはLibreOfficeとWebコンテンツの表示の統合

[OpenOffice / LibreOffice integration](../../../content-authoring-and-management/documents-and-media/devops/enabling-openoffice-libreoffice-integration.md) を Liferay ポータルインスタンスで有効にすると、コンテンツのドキュメント変換を有効にすることができます。 この統合により、ユーザーはさまざまなフォーマットでコンテンツをダウンロードできるようになります。 ウェブコンテンツ表示ウィジットのために、 [ユーザーツール](#user-tools) 構成の下で利用可能なフォーマットを選択する必要があります。

## 関連トピック

* [基本的なウェブコンテンツ記事の追加](../../../content-authoring-and-management/web-content/web-content-articles/adding-a-basic-web-content-article.md)
* [ウィジェット・スコープを設定する](../../creating-pages/page-fragments-and-widgets/using-widgets/configuring-widgets/setting-widget-scopes.md)
* [コンテンツページの使用](../../../site-building/creating-pages/using-content-pages.md)
* [表示ページのテンプレートにコンテンツを表示する](../using-display-page-templates.md)
* [資産の表示](../using-the-asset-publisher-widget/displaying-assets-using-the-asset-publisher-widget.md)