Actualizar el escaparate para vender kits dinámicos con el widget de Omni-Configurator

Si tiene una tienda existente, puede habilitar el escaparate para que venda kits dinámicos utilizando el widget de Omni-Configurator. Si publica una nueva tienda, el escaparate ya está configurado con el widget de Omni-Configurator. Puede personalizar el widget de Omni-Configurator después de que esté habilitado en el escaparate.

Nota: Esta tarea solo es necesaria si la tienda se ha publicado antes de 9006+ HCL Commerce. Si la tienda se basa en 9006+, puede saltarse este paso, ya que el escaparate está configurado para utilizar Omni-Configurator de forma predeterminada.

Antes de empezar

  1. Si utiliza un modelo de tienda B2B, debe instalar HCL Commerce 9.0.0.7 (o superior).
  2. Descargue e instale Sterling Visual Modeler.
  3. Despliegue Sterling Omni-Configurator.
  4. Habilita la integración de Sterling Omni-Configurator con HCL Commerce.

Por qué y cuándo se efectúa esta tarea

En la siguiente tarea, añade el widget de Omni-Configurator al escaparate basándose en el código de ejemplo de los elementos AuroraStorefontAssetStore. Una vez que el escaparate esté configurado para utilizar el widget de Omni-Configurator, puede personalizar la interfaz de usuario del widget para que se ajuste a las necesidades específicas de la tienda.

Procedimiento

  1. Habilite el escaparate con el widget de Omni-Configurator.
    1. Abra el archivo crs-web/WebContent/WEB-INF/spring/other-view.xml y, a continuación, localice el valor URL para el ID de bean ConfigureView, tal como se muestra en el siguiente ejemplo de código. 
      <bean id="ConfigureView" class="com.ibm.commerce.store.mvc.view.spring.StoreInternalResourceView"> 
    <property name="url" value="/ShoppingArea/Configurator/Configure.jsp"/>  
    <property name="https" value="1"/>
  </bean>
    2. Cierre el archivo crs-web/WebContent/WEB-INF/spring/other-view.xml.
    3. Edite el archivo JSP que ha localizado en el paso anterior. En el ejemplo de código, el archivo era /ShoppingArea/Configurator/Configure.jsp.
      Nota: Si la tienda se ha publicado al actualizar a 9006+ HCL Commerce, debe actualizar el archivo Configure.jsp con la versión de 9006+. Para actualizar este archivo, revise el archivo /ShoppingArea/Configurator/Configure.jsp predeterminado en 9006+ y fusione los cambios con el archivo existente.
    4. Incorpore el widget de Omni-Configurator para representar toda la página del configurador en el escaparate añadiendo el siguiente código.
      <!DOCTYPE html>
<%@ include file="../../Common/EnvironmentSetup.jspf" %>
<%@ include file="../../Common/nocache.jspf"%>
<html xmlns:wairole="http://www.w3.org/2005/01/wai-rdf/GUIRoleTaxonomy#"
xmlns:waistate="http://www.w3.org/2005/07/aaa" lang="${shortLocale}" xml:lang="${shortLocale}">
    <head>
        <%@ include file="../../Common/CommonCSSToInclude.jspf"%>
        <title><fmt:message bundle="${storeText}" key="CONFIGURE" /></title>
        <%@ include file="../../Common/CommonJSToInclude.jspf"%>
       </head>

    <body>
        <c:set var="hasBreadCrumbTrail" value="true" scope="request"/>
        <%@ include file="../../Common/CommonJSPFToInclude.jspf"%>
        <div id="page">
            <!-- Start Header -->
            <div class="header_wrapper_position" id="headerWidget">
                <%out.flush();%>
                    <c:import url = "${env_jspStoreDir}/Widgets/Header/Header.jsp" />
                <%out.flush();%>
            </div>
            <!-- End Header -->
            <%out.flush();%>
                <wcpgl:widgetImport useIBMContextInSeparatedEnv="${isStoreServer}" 
                 url="${env_siteWidgetsDir}com.ibm.commerce.store.widgets.OmniConfigurator/OmniConfigurator.jsp">                                                         
                </wcpgl:widgetImport>
                <%out.flush();%>
            <!--Start Footer Content-->
            <div class="footer_wrapper_position">
                <%out.flush();%>
                    <c:import url = "${env_jspStoreDir}/Widgets/Footer/Footer.jsp" />
                <%out.flush();%>
            </div>
            <!--End Footer Content-->
       <%@ include file="../../Common/JSPFExtToInclude.jspf"%> 
</body>
</html>
<!-- END Configure.jsp -->
    5. Guarde y cierre el archivo /ShoppingArea/Configurator/Configure.jsp.
  2. Opcional: Personalice el widget de Omni-Configurator para adaptarlo a las necesidades del escaparate.
    1. Abra el paquete de desarrollo de interfaz de usuario del configurador desde WCDE_installdir/samples/integration/Omni-Configurator/Configurator_UI_Update.zip.
    2. Personalice y cree su widget ConfiguratorUI.
    3. Cree un widget de Omni-Configurator para utilizar el nuevo paquete de interfaz de usuario.
      1. Copie un nuevo widget del origen com.ibm.commerce.store.widgets.OmniConfigurator.
      2. Sustituya el paquete de interfaz de usuario del configurador por el paquete que ha creado.
      3. Vuelva a crear el código de tienda, incluidos los archivos JavaScript y CSS.
      4. Actualice el archivo ShoppingArea/Configurator/Configure.jsp para importar el nuevo widget de JSP, tal como se describe en el paso 1.