Modifier le magasin pour afficher la marge bénéficiaire dans l'aperçu du magasin

Dans cette leçon, vous personnalisez le magasin type Aurora pour afficher la marge bénéficiaire des produits recommandés dans l'aperçu du magasin uniquement. Vous devez configurer la zone de la marge bénéficiaire pour mapper les zones dans UserData du nom CatalogNavigationViewType. Ce nom est utilisé pour les résultats de recherche. Une fois le mappage terminé, les zones peuvent être extraites pour être affichées dans le magasin type Aurora.

Etant donné que la marge bénéficiaire est liée au prix, mettez à jour le widget de niveau site de recommandation de produits de votre magasin pour afficher la marge bénéficiaire après le prix de vente. En mettant à jour le widget de niveau site, le changement a lieu pour tous les magasins.

Procédure

Dans la vue Explorateur d'entreprise, crs-web > WebContent > Widgets_801 > com.ibm.commerce.store.widgets.CatalogEntryRecommendation.
Si vous modifiez directement le fichier .jspf dans le conteneur Docker, utilisez la commande suivante pour copier le fichier CatalogEntryRecommendation_Data.jspf :
```
docker cp commerce_store_1:/profile/apps/crs.ear/crs-web.war/Widgets_801/com.ibm.commerce.store.widgets.CatalogEntryRecommendation/CatalogEntryRecommendation_Data.jspf .
```
Ouvrez le fichier CatalogEntryRecommendation_Data.jspf pour l'éditer.

Localisez le code suivant :


<wcf:rest var="catalogNavigationView1" url="${searchHostNamePath}${searchContextPath}/store/${WCParam.storeId}/productview/byIds" >
  <c:forEach var="id" items="${catentryIdQueryList}">
    <wcf:param name="id" value="${id}"/>
  </c:forEach>
  <wcf:param name="langId" value="${langId}" />
  <wcf:param name="currency" value="${env_currencyCode}" />
  <wcf:param name="responseFormat" value="json" />
  <wcf:param name="catalogId" value="${WCParam.catalogId}" />
  <wcf:param name="profileName" value="IBM_findProductByIds_Summary" />
  <c:forEach var="contractId" items="${env_activeContractIds}">
    <wcf:param name="contractId" value="${contractId}"/>
  </c:forEach>
</wcf:rest>

Modifiez la valeur profileName pour qu'elle corresponde à votre nouveau profil de recherche.

Par exemple, X_findCatalogEntryProfitMargin.


<wcf:rest var="catalogNavigationView1" url="${searchHostNamePath}${searchContextPath}/store/${WCParam.storeId}/productview/byIds" >
  <c:forEach var="id" items="${catentryIdQueryList}">
    <wcf:param name="id" value="${id}"/>
  </c:forEach>
  <wcf:param name="langId" value="${langId}" />
  <wcf:param name="currency" value="${env_currencyCode}" />
  <wcf:param name="responseFormat" value="json" />
  <wcf:param name="catalogId" value="${WCParam.catalogId}" />
  <wcf:param name="profileName" value="X_findCatalogEntryProfitMargin" />
  <c:forEach var="contractId" items="${env_activeContractIds}">
    <wcf:param name="contractId" value="${contractId}"/>
  </c:forEach>
</wcf:rest>

Développez crs-web > WebContent > Widgets_801 > Common > PriceDisplay.
Si vous modifiez directement le fichier .jspf dans le conteneur Docker, utilisez la commande suivante pour copier le fichier PriceDisplay_Data.jspf :
```
docker cp commerce_store_1:/profile/apps/crs.ear/crs-web.war/Widgets_801/Common/PriceDisplay/PriceDisplay_Data.jspf .
```
Ouvrez le fichier PriceDisplay_Data.jspf pour l'éditer.

Définissez la nouvelle variable de marge bénéficiaire pour le widget d'affichage des prix en ajoutant le code suivant à la fin du fichier.


<c:set var="profitMargin" value="" />
<c:if test="${env_inPreview && !env_storePreviewLink}">
  <c:forEach var="userData" items="${catalogEntryDetails.UserData}" >
    <c:if test="${!empty userData.ProfitMargin}">
      <c:set var="profitMargin" value="${userData.ProfitMargin}" />
    </c:if>
  </c:forEach>
</c:if>

Ouvrez le fichier PriceDisplay_UI.jspf pour l'éditer.
Si vous modifiez directement le fichier .jspf dans le conteneur Docker, utilisez la commande suivante pour copier le fichier PriceDisplay_UI.jspf :
```
	docker cp commerce_store_1:/profile/apps/crs.ear/crs-web.war/Widgets_801/Common/PriceDisplay/PriceDisplay_UI.jspf .
```
Définissez l'affichage de la marge bénéficiaire dans l'aperçu du magasin uniquement pour le widget d'affichage des prix en ajoutant le code suivant à la fin du fichier :
```
<c:if test="${env_inPreview && !env_storePreviewLink}">
  <c:if test="${!empty profitMargin}">
    <div> Profit Margin: ${profitMargin}% </div>
  </c:if>
</c:if>
```
Remarque : La marge bénéficiaire s'affiche uniquement dans l'aperçu du magasin et uniquement si la valeur existe et n'est pas vide. En outre, profitMargin est l'exemple de nom de zone d'index utilisé dans ce tutoriel. Assurez-vous d'utiliser le même nom de zone d'index que vous avez défini lorsque vous avez mis à jour votre fichierx-schema.xml de recherche.

Sauvegardez et fermez tous les fichiers.

Si vous modifiez directement les fichiers .jspf dans le conteneur Docker, utilisez les commandes suivantes pour copier les fichiers mis à jour dans Docker :

docker cp CatalogEntryRecommendation_Data.jspf commerce_store_1:/profile/apps/crs.ear/crs-web.war/Widgets_801/com.ibm.commerce.store.widgets.CatalogEntryRecommendation/CatalogEntryRecommendation_Data.jspf
docker cp PriceDisplay_Data.jspf commerce_store_1:/profile/apps/crs.ear/crs-web.war/Widgets_801/Common/PriceDisplay/PriceDisplay_Data.jspf
docker cp PriceDisplay_UI.jspf commerce_store_1:/profile/apps/crs.ear/crs-web.war/Widgets_801/Common/PriceDisplay/PriceDisplay_UI.jspf

Si vous modifiez directement les fichiers .jspf dans le conteneur Docker, utilisez les commandes suivantes pour copier le fichier server.xml à partir du conteneur Docker :

docker cp commerce_store_1:/opt/WebSphere/Liberty/usr/servers/default/server.xml .

Editez le fichier server.xml et ajoutez recompileJspOnRestart=”true” à jspEngine :

<jspEngine disableResourceInjection="true" recompileJspOnRestart="true"></jspEngine>

<basicRegistry></basicRegistry>

<enterpriseApplication id="crs" location="crs.ear" name="crs">
    <classloader apiTypeVisibility="spec,ibm-api,third-party" />
</enterpriseApplication>

Utilisez la commande suivante pour copier le server.xml mis à jour dans le conteneur Docker :

docker cp server.xml commerce_store_1:/opt/WebSphere/Liberty/usr/servers/default/server.xml

Redémarrez le conteneur Docker du magasin.

docker stop commerce_store_1
docker start commerce_store_1

Ouvrez votre vitrine dans l'aperçu du magasin, accédez à n'importe quelle page de catégorie secondaire et vérifiez que la marge bénéficiaire s'affiche après le prix de vente.
Par exemple, si vous accédez à la page de la catégorie Femmes, votre widget de recommandation de produit peut ressembler à la capture d'écran suivante.

Résultats

Les marges bénéficiaire seront désormais affichées dans l'aperçu du magasin. Ensuite, testez votre personnalisation pour vous assurer qu'elle a abouti.