現在表示中:

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

  • 説明の代わりに手順を表示する
  • 表示ルート数
  • 背景諧調色

手順

  1. プロジェクトを開きます。

    • IOS の場合、Xcode で Capture.xcodeproj を開きます。
    • Android の場合、Eclipse で Android プロジェクトを開きます。 
    • Windows の場合、Visual Studio で MWSWindows.sln を開きます。
  2. テンプレートフォルダーに移動します。

    • Xcode で、Capture > www > wsmobile > js > runtime > templates フォルダーに移動します。
    • Eclipse で、assets > www > wsmobile > js > runtime > templates フォルダーに移動します。
    • Visual Studio で、MWSWindows > www > wsmobile > js > runtime > templates フォルダーに移動します。
  3. template.html フォルダーを開き編集します。

  4. 次の文字列を探します。

    <%if ( (task.description !== "") && (task.description !== null) && (typeof task.description !== null) && (typeof task.description !== 'undefined') ) {%>
                  	<div class="description_details">
                    	<%= task.description %>
                  	</div>
                  <%} else 

    <% で置き換えます。

  5. templates.html ファイル内の次のコードを探します。

    <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>
  6. 次の行にコメントをつけ、ファイルを保存します。 

    task.availableCommands.directCommands[1]%>">
    <%= task.availableCommands.directCommands[1]%>
    </li>
  7. css フォルダーに移動します。

    • Xcode で、Capture > www > wsmobile > css フォルダーに移動します。
    • Eclipse で、assets > www > wsmobile > css フォルダーに移動します。
    • Visual Studio で、MWSWindows > www > wsmobile > css フォルダーに移動します。
  8. _style.css ファイルを開いて編集します。
  9. 背景画像に対して、#323232#fff に変更します。

  10. 変更を保存し、_style.css ファイルを閉じます。

  11. AEM Forms アプリケーションを開きます。

    AEM Forms アプリケーションには、説明の代わりに手順が表示されるようになっています。 

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー