テーマのカスタマイズ

HTML コードおよび CSS ファイルをカスタマイズし、AEM forms ワークスペースアプリケーションに組織固有の明確なルック＆フィールを提供することができます。たとえば、タスクまたはスタートポイントの背景色や高さを変更できます。次のことを変更する手順を、以下に例で示します。

• 背景諧調色
• タスクの高さまたはスタートポイント
• 表示ルート数
• 説明の代わりに手順を表示する

1. Xcode で Capture.xcodeproj プロジェクトを開きます。
2. Capture/www/wsmobile/js/runtime/templates フォルダーに行きます。
3. task.html ファイルを開いて編集します。
4. 次の行を探して<%
   
   <%if ( (task.description !== "") && (task.description !== null) && (typeof task.description !== null) && (typeof task.description !== 'undefined') ){%> <%= task.description %> <%}
   else    に置き換えます。
5. task.html ファイル内の次のコードを探します。

<ul>
<li class="approve" title="<%=
task.availableCommands.directCommands[0]%>" data-routename="<%=
task.availableCommands.directCommands[0]%>">
<%= task.availableCommands.directCommands[0]%>
</li>
<li class="reject last" title="<%=
task.availableCommands.directCommands[1]%>" data-routename="<%=
task.availableCommands.directCommands[1]%>">
<%= task.availableCommands.directCommands[1]%>
</li>
</ul>
</div>

6. 次の列をコメントアウトし、ファイルを保存します。
   

<li class="reject last" title="<%=
task.availableCommands.directCommands[1]%>" data-routename="<%=
task.availableCommands.directCommands[1]%>">
<%= task.availableCommands.directCommands[1]%>
</li>

7. Capture>www>wsmobile>css まで移動します。
   
8. _style.css ファイルを開いて編集します。
9. 次のコードを検索します：
   
   #wrapper .task {
   
   
10. 高さを 80px から 150px に変更します。
    
11. 背景画像に対して、#1d1d1d を #fff に変更します。
12. 変更を保存し、_style.css ファイルを閉じます。
13. AEM forms ワークスペースアプリケーションを開きます。