AEM 6.4 has reached the end of extended support and this documentation is no longer updated. For further details, see our technical support periods. Find the supported versions here.
You can customize the HTML code and CSS file to provide a distinct organization-specific look and feel to AEM Forms app. For example, you can change the background color and height of tasks or Startpoints. The following example provides instructions to change:
Open your project.
Capture.xcodeproj
in XcodeMWSWindows.sln
in Visual Studio.Navigate to the templates folder.
Open the template.html
file for editing.
Locate the following string:
<%if ( (task.description !== "") && (task.description !== null) && (typeof task.description !== null) && (typeof task.description !== 'undefined') ) {%>
<div class="description_details">
<%= task.description %>
</div>
<%} else
Replace it with <%
.
Locate the following code in the template.html
file:
<ul id="task_menu_list">
<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>
Comment the following line and save the file.
task.availableCommands.directCommands[1]%>">
<%= task.availableCommands.directCommands[1]%>
</li>
Navigate to the css folder.
Open the _style.css
file for editing.
For Background image, change #323232
to #fff
.
Save the changes and close _style.css
file.
Open the AEM Forms app.
The AEM Forms app now displays instructions instead of description.