Añadir soporte para mapas de imágenes a los archivos JSP de zona de e-Marketing existentes de la tienda de inicio Aurora

Antes de poder mostrar contenido de marketing con varias acciones de pulsación en una zona de e-Marketing, debe añadir soporte para varias acciones de pulsación en el archivo JSP de la zona de e-Marketing.

Procedimiento

  1. En su programa de gestión de archivos, vaya al directorio que contiene el archivo JSP para la zona de e-Marketing.
    • LinuxAIXWindowsWC_eardir\Stores.war\store_dir\Widgets\ESpot\

      Por ejemplo, si desea añadir soporte a los archivos JSP de recomendación de contenido, puede encontrar estos archivos en el siguiente directorio: WC_eardirStores.war\store_dir\Widgets\ESpot\ContentRecommendation\

    • HCL Commerce DeveloperWorkspace_dir\Stores\WebContent\store_dir\

      Por ejemplo, si desea añadir soporte a los archivos JSP de recomendación de contenido, puede encontrar estos archivos en el siguiente directorio: Workspace_dir\Stores\WebContent\store_dir\Widgets\ESpot\ContentRecommendation\

    donde store_dir es el nombre del directorio para la tienda.
  2. Localice el archivo JSP de datos para la zona de e-Marketing que desea actualizar para dar soporte a varias acciones de pulsación.
    Por ejemplo, ContentRecommendation_Data.jsp. Abra el archivo para editarlo.
  3. En el archivo, localice la siguiente línea de código: 
    <jsp:useBean id="contentFormatMap" class="java.util.HashMap" type="java.util.Map"/>
  4. Añada el código siguiente después del código que ha localizado: 
    <%-- BEGIN Marketing Content Image Map --%>
<jsp:useBean id="contentImageAreaInputMap" class="java.util.HashMap" type="java.util.Map"/>
<jsp:useBean id="contentImageAreaNameMap" class="java.util.HashMap" type="java.util.Map"/>
<jsp:useBean id="contentImageAreaMap" class="java.util.HashMap" type="java.util.Map"/>
<jsp:useBean id="contentImageAreaSourceMap" class="java.util.HashMap" type="java.util.Map"/>
<%-- END   Marketing Content Image Map --%>
  5. Localice la línea de código siguiente:
    <c:set target="${contentDescriptionMap}" property="${currentRowCount}" value="${attachment.attachmentDescription[descriptionIndex].shortDescription}" />
  6. Añada el código siguiente después de la línea de código que ha localizado:
    <%-- BEGIN Marketing Content Image Map --%>
<c:if test="${!empty marketingSpotData.marketingContent.marketingContentImageMap}">
  <c:set target="${contentImageAreaInputMap}" property="${currentRowCount}" value="${marketingSpotData.marketingContent.inputOption.name}" />
  <c:set target="${contentImageAreaNameMap}" property="${currentRowCount}" value="${marketingSpotData.marketingContent.marketingContentImageMap[0].name}" />
  <c:choose>
    <c:when test="${!empty marketingSpotData.marketingContent.marketingContentImageMap[0].area}">
      <jsp:useBean id="contentImageAreaPerEspotMap" class="java.util.HashMap" type="java.util.Map"/>
      
      <c:forEach var="imageArea" items="${marketingSpotData.marketingContent.marketingContentImageMap[0].area}" varStatus="aStatus">
        <jsp:useBean id="contentImageAreaMap_current" class="java.util.HashMap" type="java.util.Map"/>
        <c:set target="${contentImageAreaMap_current}" property="shape" value="${imageArea.shape}" />
        <c:set target="${contentImageAreaMap_current}" property="coordinates" value="${imageArea.coordinates}" />
        <c:set target="${contentImageAreaMap_current}" property="url" value="${imageArea.url}" />
        <c:set target="${contentImageAreaMap_current}" property="title" value="${imageArea.title}" />
        <c:set target="${contentImageAreaMap_current}" property="target" value="${imageArea.target}" />
        <c:set target="${contentImageAreaMap_current}" property="altText" value="${imageArea.alternateText}" />
        <c:set target="${contentImageAreaPerEspotMap}" property="${aStatus.count}" value="${contentImageAreaMap_current}" />
        <c:remove var="contentImageAreaMap_current"/>
      </c:forEach>
      <c:set target="${contentImageAreaMap}" property="${currentRowCount}" value="${contentImageAreaPerEspotMap}" />
    </c:when>
    <c:when test="${!empty marketingSpotData.marketingContent.marketingContentImageMap[0].source}">
      <c:set target="${contentImageAreaSourceMap}" property="${currentRowCount}" value="${marketingSpotData.marketingContent.marketingContentImageMap[0].source}" />
    </c:when>
  </c:choose>
</c:if>
<%-- END   Marketing Content Image Map --%>
  7. Guarde y cierre el archivo.
  8. Localice el archivo JSP de interfaz de usuario correspondiente para la zona de e-Marketing que desea actualizar para dar soporte a varias acciones de pulsación.
    Por ejemplo, ContentRecommendation_UI.jsp. Abra el archivo para editarlo.
  9. En el archivo, localice la siguiente línea de código: 
    <img id="ContentAreaESpotImg_${espotName}_${aStatus.count}" src="${contentImageMap[aStatus.current.key]}" alt="${contentDescriptionMap[aStatus.current.key]}"/>
<c:if test="${!empty contentUrlMap[aStatus.current.key]}">
  </a>
</c:if>
  10. Sustituya esas líneas de código por el código siguiente: 
    <img id="ContentAreaESpotImg_${espotName}_${aStatus.count}" src="${contentImageMap[aStatus.current.key]}" alt="${contentDescriptionMap[aStatus.current.key]}"
  <%-- BEGIN Marketing Content Image Map --%>
  <c:if test="${contentImageAreaInputMap[aStatus.current.key] eq 'Area' || contentImageAreaInputMap[aStatus.current.key] eq 'Source'}">
  usemap="#<c:out value="${contentImageAreaNameMap[aStatus.current.key]}"/>"
  </c:if>
  <%-- END   Marketing Content Image Map --%>
/>
<c:if test="${!empty contentUrlMap[aStatus.current.key]}">
  </a>
</c:if>
<%-- BEGIN Marketing Content Image Map --%>
<c:choose>
  <c:when test="${contentImageAreaInputMap[aStatus.current.key] eq 'Area'}">
    <c:if test="${!empty contentImageAreaMap[aStatus.current.key]}">
      <map name="<c:out value="${contentImageAreaNameMap[aStatus.current.key]}"/>">
      
      <c:forEach items="${contentImageAreaMap[aStatus.current.key]}" varStatus="bStatus">
        <area shape="<c:out value="${contentImageAreaMap[aStatus.current.key][bStatus.current.key]['shape']}"/>" 
          coords="<c:out value="${contentImageAreaMap[aStatus.current.key][bStatus.current.key]['coordinates']}"/>" 
          href="<c:out value="${contentImageAreaMap[aStatus.current.key][bStatus.current.key]['url']}"/>" 
          title="<c:out value="${contentImageAreaMap[aStatus.current.key][bStatus.current.key]['title']}"/>"
          target="<c:out value="${contentImageAreaMap[aStatus.current.key][bStatus.current.key]['target']}"/>" 
          <c:choose>
            <c:when test="${!empty contentImageAreaMap[aStatus.current.key][bStatus.current.key]['altText']}">
              alt="<c:out value="${contentImageAreaMap[aStatus.current.key][bStatus.current.key]['altText']}"/>" 
            </c:when>
            <c:otherwise>
              alt="<c:out value="${contentImageAreaMap[aStatus.current.key][bStatus.current.key]['title']}"/>" 
            </c:otherwise>
          </c:choose>
        />
      </c:forEach>
      
      </map>
    </c:if>
  </c:when>
  <c:when test="${contentImageAreaInputMap[aStatus.current.key] eq 'Source'}">
    <c:out value="${contentImageAreaSourceMap[aStatus.current.key]}" escapeXml="false"/>
  </c:when>
</c:choose>
<%-- END   Marketing Content Image Map --%>
  11. Guarde y cierre el archivo.

Resultados

Ha añadido soporte para mapas de imágenes a los archivos JSP de zona de e-Marketing.