Mryntu

Custom theme using Magento 2.2.1 in developer mode, inheriting from the Magento/blank theme.

When selecting an item from a sizing dropdown on a product page, created using a configurable product, an element appears, which I believe is the 'tier price'.

The element in question is<div class="price-box price-tier_price" data-role="priceBox"></div>.

I have tried adding <referenceBlock name="price-tier_price" remove="true" /> and <referenceBlock name="price-box" remove="true" /> to default.xml, but neither have worked.

Please can someone advise me how to hide this element?

Thanks.

EDIT:

Found this link.
Looks like this might be the root of the problem, which is marked 'Done' ready for Magento 2.3.

Did a little reading up on Khoa TruongDinh's answer and discovered this issue posted on Magento's github:

https://github.com/magento/magento2/issues/4945

Looks like this is a known bug that has been fixed for v2.3.

I've managed to work around the bug in my custom theme using three different methods.

Method One:

Added the line

<referenceBlock name="product.price.tier" remove="true" />

to

<Vendor>/<Theme>/Magento_Theme/layout/default.xml

and it seems to be working.

Method Two:

First, I copied the file

Magento/Catalog/layout/catalog_product_view.xml

to

<Vendor>/<Theme>/Magento_Catalog/layout/catalog_product_view.xml

.

Then, I removed the following code from the new file:

<block class="MagentoCatalogPricingRender" name="product.price.tier" after="product.info.price">
<arguments>
<argument name="price_render" xsi:type="string">product.price.render.default</argument>
<argument name="price_type_code" xsi:type="string">tier_price</argument>
<argument name="zone" xsi:type="string">item_view</argument>
</arguments>
</block>

Method 3 (from Khoa TruongDinh's answer):

See how tier price is rendered:

MagentoConfigurableProductBlockProductViewTypeConfigurable::getOptionPrices

Configurable product JS comes from here:

Magento_ConfigurableProduct/js/configurable

Create requirejs-config.js file here:

app/code/[Vendor]/[Module]/view/frontend/requirejs-config.js

Create the following mixin inside the file requirejs-config.js:

var config = 
 config: 
 mixins: 
 'Magento_ConfigurableProduct/js/configurable': 
 'Vendor_Catalog/js/configurable-mixin': true
 
 
 
;

Then create configurable-mixin.js here:

app/code/[Vendor]/[Module]/view/frontend/web/js/configurable-mixin.js

configurable-mixin.js should contain the following code:

define(
[
 'jquery'
],
function ($) 
 'use strict';

 return function (target) 
 $.widget('mage.configurable', target, 

 _displayTierPriceBlock: function (optionId) 
 //Do no thing here.
 
 );

 return $.mage.configurable;
 ;
);

Method 4 (from goodlook's answer):

Copy the file

Magento/Catalog/layout/catalog_product_view.xml

to

<Vendor>/<Theme>/Magento_Catalog/layout/catalog_product_view.xml

and remove the following line:

<?= /* @escapeNotVerified */ $block->renderAmountMinimal() ?>

We can see how tier price was rendered: MagentoConfigurableProductBlockProductViewTypeConfigurable::getOptionPrices.

There is an easy way to hide the tier price - but not sure it's the best way:

The js for changing value of configurable product comes from Magento_ConfigurableProduct/js/configurable.

We need to override it by using mixin

app/code/[Vendor]/[Module]/view/frontend/requirejs-config.js

var config = 
 config: 
 mixins: 
 'Magento_ConfigurableProduct/js/configurable': 
 'Vendor_Catalog/js/configurable-mixin': true
 
 
 
;

app/code/[Vendor]/[Module]/view/frontend/web/js/configurable-mixin.js

define(
[
 'jquery'
],
function ($) 
 'use strict';

 return function (target) 
 $.widget('mage.configurable', target, 

 _displayTierPriceBlock: function (optionId) 
 //Do no thing here.
 
 );

 return $.mage.configurable;
 ;
);

on magento 2.3.0 you can remove by editing

Magento_Catalog/templates/product/price/final_price.phtml

I added text to tell there is % when buy more 'by more and get %'
then I marked out the render of tier price.
So, no tier price is shown, only some replace text with link to product page where tier prices are correct.

<a href="<?= /* @escapeNotVerified */ $block->getSaleableItem()->getProductUrl() ?>" class="minimal-price-link"> By more and get %
<!-- marke out code or delete line
<?= /* @escapeNotVerified */ $block->renderAmountMinimal() ?>
--> </a>