Aanpassing thema
Gemaakt voor:
- User
U kunt de HTML-code en het CSS-bestand aanpassen en zo een aparte organisatie-specifieke vormgeving geven voor de AEM Forms-app. U kunt bijvoorbeeld de achtergrondkleur en -hoogte van taken of Startpunten wijzigen. In het volgende voorbeeld worden instructies gegeven om te wijzigen:
- aanwijzingen weergeven in plaats van de beschrijving
- aantal weergaveroutes
- kleur achtergrondverloop
Stappen
-
Open uw project.
- Voor iOS: open
Capture.xcodeproj
in Xcode - Voor Android opent u het Android-project in Eclipse.
- Voor Windows: open
MWSWindows.sln
in Visual Studio.
- Voor iOS: open
-
Navigeer naar de map templates.
- Navigeer in Xcode naar de Vastleggen > www > wsmobile > js > runtime > templates map.
- Navigeer in Eclipse naar de assets > www > wsmobile > js > runtime > templates map.
- In Visual Studio, navigeer aan MWSWindows > www > wsmobile > js > runtime > templates map.
-
Open de
template.html
bestand voor bewerking. -
Zoek de volgende tekenreeks:
<%if ( (task.description !== "") && (task.description !== null) && (typeof task.description !== null) && (typeof task.description !== 'undefined') ) {%> <div class="description_details"> <%= task.description %> </div> <%} else
Vervangen door
<%
. -
Zoek de volgende code in het dialoogvenster
template.html
bestand:<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>
-
Neem een opmerking op in de volgende regel en sla het bestand op.
task.availableCommands.directCommands[1]%>"> <%= task.availableCommands.directCommands[1]%> </li>
-
Navigeer naar de css-map.
- Navigeer in Xcode naar Vastleggen > www > wsmobile > css.
- Navigeer in Eclipse naar middelen > www > wsmobile > css.
- In Visual Studio, navigeer aan MWSWindows > www > wsmobile > css.
-
Open de
_style.css
bestand voor bewerking. -
Voor achtergrondafbeelding wijzigt u
#323232
tot#fff
. -
Wijzigingen opslaan en sluiten
_style.css
bestand. -
Open de AEM Forms-app.
De AEM Forms-app geeft nu instructies weer in plaats van een beschrijving.