Lorsque mon prix affiche 99,00 €, je souhaite que soit affiché uniquement la valeur avant la virgule: 99 €. Pour celà, il faut surcharger le fichier vendor/magento/module-catalog/view/base/templates/product/price/amount/default.phtml dans un thème.
Remarque: on voit dans notre exemple que le fichier natif est « rangé » dans le dossier base ce qui signifie que cette vue PHTML va servir pour afficher des informations autant en front que dans l’interface d’administration de Magento 2. J’ai cependant besoin de n’afficher mon prix sans décimales qu’en front. Pour ce faire, je vais recréer une version modifiée de mon fichier de départ dans app/design/frontend/Sodifrance/pdv/Magento_Catalog/templates/product/price/amount/default.phtml.
La partie qui nous intéresse plus particulièrement se situe dans l’élément <span class="price-wrapper">:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<span <?php if ($block->getPriceId()) :?> id="<?= $block->escapeHtmlAttr($block->getPriceId()) ?>"<?php endif;?> <?= ($block->getPriceDisplayLabel()) ? 'data-label="' . $block->escapeHtmlAttr($block->getPriceDisplayLabel() . $block->getPriceDisplayInclExclTaxes()) . '"' : '' ?> data-price-amount="<?= $block->escapeHtmlAttr($block->getDisplayValue()) ?>" data-price-type="<?= $block->escapeHtmlAttr($block->getPriceType()) ?>" class="price-wrapper <?= $block->escapeHtmlAttr($block->getPriceWrapperCss()) ?>" > <?php $dot = "."; $price = $block->escapeHtmlAttr($block->getDisplayValue()); ?> <?php if(strpos($price, $dot) !== false) :?> <?= $block->escapeHtml($block->formatCurrency($block->getDisplayValue(), (bool)$block->getIncludeContainer()), ['span']) ?> <?php else :?> <span class="price-without-decimal"><?= $block->escapeHtmlAttr($block->getDisplayValue()) ?> <?= $block->escapeHtmlAttr($block->getDisplayCurrencySymbol()) ?></span> <?= $block->escapeHtml($block->formatCurrency($block->getDisplayValue(), (bool)$block->getIncludeContainer()), ['span']) ?> <?php endif; ?> </span> |
J’ai remarqué, en parcourant la source de la page avec l’inspecteur d’éléments, qu’il existait dans le bloc <div class="price-box"> un data attribut data-price-amount qui contenait déjà les prix ronds sans décimales (data-price-amount="99" au lieu de data-price-amount="99.00"). L’idée ici est de le ré-exploiter.
|
1 2 3 4 |
<?php $dot = "."; $price = $block->escapeHtmlAttr($block->getDisplayValue()); ?> |
Ci-dessus, je créer une variable $dot qui contient juste le caractère .. Je vais avoir besoin de savoir si la valeur de mon data-price-amount contient la valeur de $dot ou pas.
Je crée également une variable $price qui contient la valeur de mon data-price-amount (le prix).
|
1 2 3 4 5 |
<?php if(strpos($price, $dot) !== false) :?> <?= $block->escapeHtml($block->formatCurrency($block->getDisplayValue(), (bool)$block->getIncludeContainer()), ['span']) ?> <?php else :?> ... <?php endif; ?> |
Dans une condition if/else, j’utilise la fonction strpos de PHP pour vérifier si la valeur de $price contient la valeur de $dot.
Si « oui » (!== false), alors je conserve l’affichage standard du prix dans Magento 2 (un <span class="price"></span> avec des décimales, peu importe si le prix est de 99,00 €).
|
1 2 3 4 5 6 |
<?php if(strpos($price, $dot) !== false) :?> ... <?php else :?> <span class="price-without-decimal"><?= $block->escapeHtmlAttr($block->getDisplayValue()) ?> <?= $block->escapeHtmlAttr($block->getDisplayCurrencySymbol()) ?></span> <?= $block->escapeHtml($block->formatCurrency($block->getDisplayValue(), (bool)$block->getIncludeContainer()), ['span']) ?> <?php endif; ?> |
Si « non » (code après le <?php else :?>) j’ajoute un <span class="price-without-decimal"> au-dessus de l’affichage standard du prix dans Magento 2 pour y afficher la valeur de mon attribut data-price-amount (un prix sans décimales, si mon code fonctionne correctement).
Attention: je me retrouve désormais avec 2 prix affichés si je suis dans le cas où la valeur du prix ne contient pas de décimales. J’ai choisi de conserver l’affichage standard du prix dans Magento 2 dans le DOM au cas où il sert (via un javaScript ou autre…) à des calculs.
Pour masquer ce dernier à l’utilisateur, j’utilise CSS:
|
1 2 3 4 |
.price-box .price-without-decimal + .price { position: absolute; left: -99999em; } |
Le fichier app/design/frontend/Sodifrance/pdv/Magento_Catalog/templates/product/price/amount/default.phtml complet:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 |
<?php /** * Copyright © Magento, Inc. All rights reserved. * See COPYING.txt for license details. */ ?> <!--Override from: vendor/magento/module-catalog/view/base/templates/product/price/amount/default.phtml--> <?php /** @var $block \Magento\Framework\Pricing\Render\Amount */ ?> <span class="price-container <?= $block->escapeHtmlAttr($block->getAdjustmentCssClasses()) ?>" <?= $block->getSchema() ? ' itemprop="offers" itemscope itemtype="http://schema.org/Offer"' : '' ?>> <?php if ($block->getDisplayLabel()) :?> <span class="price-label"><?= $block->escapeHtml($block->getDisplayLabel()) ?></span> <?php endif; ?> <span <?php if ($block->getPriceId()) :?> id="<?= $block->escapeHtmlAttr($block->getPriceId()) ?>"<?php endif;?> <?= ($block->getPriceDisplayLabel()) ? 'data-label="' . $block->escapeHtmlAttr($block->getPriceDisplayLabel() . $block->getPriceDisplayInclExclTaxes()) . '"' : '' ?> data-price-amount="<?= $block->escapeHtmlAttr($block->getDisplayValue()) ?>" data-price-type="<?= $block->escapeHtmlAttr($block->getPriceType()) ?>" class="price-wrapper <?= $block->escapeHtmlAttr($block->getPriceWrapperCss()) ?>" > <?php $dot = "."; $price = $block->escapeHtmlAttr($block->getDisplayValue()); ?> <?php if(strpos($price, $dot) !== false) :?> <?= $block->escapeHtml($block->formatCurrency($block->getDisplayValue(), (bool)$block->getIncludeContainer()), ['span']) ?> <?php else :?> <span class="price-without-decimal"><?= $block->escapeHtmlAttr($block->getDisplayValue()) ?> <?= $block->escapeHtmlAttr($block->getDisplayCurrencySymbol()) ?></span> <?= $block->escapeHtml($block->formatCurrency($block->getDisplayValue(), (bool)$block->getIncludeContainer()), ['span']) ?> <?php endif; ?> </span> <?php if ($block->hasAdjustmentsHtml()) :?> <?= $block->getAdjustmentsHtml() ?> <?php endif; ?> <?php if ($block->getSchema()) :?> <meta itemprop="price" content="<?= $block->escapeHtmlAttr($block->getDisplayValue()) ?>" /> <meta itemprop="priceCurrency" content="<?= $block->escapeHtmlAttr($block->getDisplayCurrencyCode()) ?>" /> <?php endif; ?> </span> |
(partie en work-in-progress) Si vous voulez pouvoir cibler certaines pages spécifiquement, voici ce qu’il faut mettre dans votre layout XML:
|
1 2 3 4 5 6 7 8 9 |
<!-- From: vendor/magento/module-catalog/view/base/layout/default.xml--> <!-- https://magento.stackexchange.com/questions/210585/change-price-template-only-for-product-view-page--> <block class="Magento\Framework\Pricing\Render" name="product.price.render.default"> <arguments> <argument name="price_render_handle" xsi:type="string">catalog_product_prices</argument> <argument name="use_link_for_as_low_as" xsi:type="boolean">true</argument> <!-- set "override" configuration settings here --> </arguments> </block> |