Personalizzazione del tema theme-customization
Puoi personalizzare il codice HTML e il file CSS per fornire all’app AEM Forms un aspetto e un aspetto specifici per l’organizzazione. Ad esempio, è possibile modificare il colore e l'altezza dello sfondo delle attività o dei punti iniziali. L'esempio seguente fornisce istruzioni per la modifica:
- visualizza le istruzioni al posto della descrizione
- numero di percorsi di visualizzazione
- colore sfumatura sfondo
Passaggi steps
-
Apri il progetto.
- Per iOS, apri
Capture.xcodeproj
in Xcode - Per Android, apri il progetto Android in Eclipse.
- Per Windows, apri
MWSWindows.sln
in Visual Studio.
- Per iOS, apri
-
Passa alla cartella dei modelli.
- In Xcode, passa alla Cattura > www > wsmobile > js > runtime > modelli cartella.
- In Eclipse, passa alla risorse > www > wsmobile > js > runtime > modelli cartella.
- In Visual Studio, passare alla MWSWindows > www > wsmobile > js > runtime > modelli cartella.
-
Apri
template.html
file da modificare. -
Individua la stringa seguente:
code language-none <%if ( (task.description !== "") && (task.description !== null) && (typeof task.description !== null) && (typeof task.description !== 'undefined') ) {%> <div class="description_details"> <%= task.description %> </div> <%} else
Sostituisci con
<%
. -
Individua il seguente codice nel
template.html
file:code language-none <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>
-
Commenta la riga seguente e salva il file.
code language-none task.availableCommands.directCommands[1]%>"> <%= task.availableCommands.directCommands[1]%> </li>
-
Passa alla cartella css .
- In Xcode, accedi a Cattura > www > wsmobile > css.
- In Eclipse, passa a risorse > www > wsmobile > css.
- In Visual Studio, passare a MWSWindows > www > wsmobile > css.
-
Apri
_style.css
file da modificare. -
Per l'immagine di sfondo, modifica
#323232
a#fff
. -
Salva le modifiche e chiudi
_style.css
file. -
Apri l’app AEM Forms.
L’app AEM Forms ora visualizza le istruzioni anziché la descrizione.