Magento Forums
Help
cancel
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Showing results for 
Search instead for 
Did you mean: 

How do I add custom text under the price in frontend?

SOLVED
Go to solution
‎07-31-2018 07:54 AM
‎07-31-2018 07:54 AM

How do I add custom text under the price in frontend?

Hey Guys,

 

since I use Magento ver. 2.1.7. I Want to add a simple Text under every price in the frontend. 
The Text has to inform the customer, that the price includes 19% Taxes and has to include a link to the shippingcosts page. I need to do that, so my site fits to the german laws.

Can anybody help me with this issue, I'm struggling since a week to solve this problem. 

 

 

Thank you in advance! 

0 Kudos
Reply
1 ACCEPTED SOLUTION

Accepted Solutions
‎08-01-2018 12:02 AM
‎08-01-2018 12:02 AM

Re: How do I add custom text under the price in frontend?

Hi @BlackstoneFatih

 

Method - 1:  If you want to display custom text only in product view page, then create catalog_product_view.xml in your custom theme

app/design/frontend/Vendor/theme/Magento_Catalog/layout/catalog_product_view.xml

<?xml version="1.0" ?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceContainer name="product.info.main">
            <block class="Magento\Framework\View\Element\Template" name="custom.text" template="Magento_Catalog::view/customtext.phtml" after="product.info.price"/>
        </referenceContainer>
    </body>
</page>

 

Now create customtext.phtml and add your custom text

 

app/design/frontend/Vendor/theme/Magento_Catalog/templates/view/customtext.phtml

 

Now flush the cache and check

 

Method - 2: If you want to display custom text after price at everywhere then override final_price.phtml

 

FROM

vendor/magento/module-catalog/view/base/templates/product/price/final_price.phtml

TO

app/design/frontend/Vendor/theme/Magento_Catalog/templates/product/price/final_price.phtml

 

Method - 3: Last and the most simple way to do it with CSS

 

 

.product-info-price .price:after {
    content: 'Custom Text';
}

 

 If Issue Solved, Click Kudos/Accept As solutions.

 

View solution in original post

Reply
7 REPLIES 7
‎08-01-2018 12:02 AM
‎08-01-2018 12:02 AM

Re: How do I add custom text under the price in frontend?

Hi @BlackstoneFatih

 

Method - 1:  If you want to display custom text only in product view page, then create catalog_product_view.xml in your custom theme

app/design/frontend/Vendor/theme/Magento_Catalog/layout/catalog_product_view.xml

<?xml version="1.0" ?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceContainer name="product.info.main">
            <block class="Magento\Framework\View\Element\Template" name="custom.text" template="Magento_Catalog::view/customtext.phtml" after="product.info.price"/>
        </referenceContainer>
    </body>
</page>

 

Now create customtext.phtml and add your custom text

 

app/design/frontend/Vendor/theme/Magento_Catalog/templates/view/customtext.phtml

 

Now flush the cache and check

 

Method - 2: If you want to display custom text after price at everywhere then override final_price.phtml

 

FROM

vendor/magento/module-catalog/view/base/templates/product/price/final_price.phtml

TO

app/design/frontend/Vendor/theme/Magento_Catalog/templates/product/price/final_price.phtml

 

Method - 3: Last and the most simple way to do it with CSS

 

 

.product-info-price .price:after {
    content: 'Custom Text';
}

 

 If Issue Solved, Click Kudos/Accept As solutions.

 

Reply
‎08-01-2018 01:06 AM
‎08-01-2018 01:06 AM

Re: How do I add custom text under the price in frontend?

Thank you very much! This solved all my problems! 

 

0 Kudos
Reply
‎08-01-2018 01:39 AM
‎08-01-2018 01:39 AM

Re: How do I add custom text under the price in frontend?

okay, I tried to display the Text in the product listing page also, but method 2 won't work for me :/

0 Kudos
Reply
‎08-04-2018 12:42 PM
‎08-04-2018 12:42 PM

Re: How do I add custom text under the price in frontend?

Hello Prince I've been able to create a custom attribute and place the price under the text my issue is getting the attribute inline with the price like so.

 

per deadlock.PNG

Is there a way to add a custom attribute here

Magento/Catalog/Templates/Product/Price/Amount/Default.phtml

<?php
/**
* Copyright © Magento, Inc. All rights reserved.
* See COPYING.txt for license details.
*/

// @codingStandardsIgnoreFile

?>

<?php /** @var \Magento\Framework\Pricing\Render\Amount $block */ ?>

<span class="price-container <?= /* @escapeNotVerified */ $block->getAdjustmentCssClasses() ?>"
<?= $block->getSchema() ? ' itemprop="offers" itemscope itemtype="http://schema.org/Offer"' : '' ?>>
<?php if ($block->getDisplayLabel()): ?>
<span class="price-label"><?= /* @escapeNotVerified */ $block->getDisplayLabel() ?></span>
<?php endif; ?>
<span <?php if ($block->getPriceId()): ?> id="<?= /* @escapeNotVerified */ $block->getPriceId() ?>"<?php endif;?>
<?= ($block->getPriceDisplayLabel()) ? 'data-label="' . $block->getPriceDisplayLabel() . $block->getPriceDisplayInclExclTaxes() . '"' : '' ?>
data-price-amount="<?= /* @escapeNotVerified */ $block->getDisplayValue() ?>"
data-price-type="<?= /* @escapeNotVerified */ $block->getPriceType() ?>"
class="price-wrapper <?= /* @escapeNotVerified */ $block->getPriceWrapperCss() ?>">
<?= /* @escapeNotVerified */ $block->formatCurrency($block->getDisplayValue(), (bool)$block->getIncludeContainer()) ?>
</span>

/*   If Code added here it falls in-line */ 


<?php if ($block->hasAdjustmentsHtml()): ?>
<?= $block->getAdjustmentsHtml() ?>
<?php endif; ?>
<?php if ($block->getSchema()): ?>
<meta itemprop="price" content="<?= /* @escapeNotVerified */ $block->getDisplayValue() ?>" />
<meta itemprop="priceCurrency" content="<?= /* @escapeNotVerified */ $block->getDisplayCurrencyCode() ?>" />
<?php endif; ?>
</span>

Any suggestions?

0 Kudos
Reply
‎05-29-2020 12:13 AM
‎05-29-2020 12:13 AM

Re: How do I add custom text under the price in frontend?

How to apply this condition for all pages?

0 Kudos
Reply
‎10-14-2020 08:16 PM
‎10-14-2020 08:16 PM

Re: How do I add custom text under the price in frontend?

@Prince Patel I just created a static cms block, how to call this into below product price?

 

app/design/frontend/Codazon/fastest/grocery_gourmet/Magento_Catalog/layout/catalog_product_view.xml

 

	<referenceContainer name="content"> 
        <block class="Magento\Cms\Block\Block" name="block_identifier"> 
            <arguments> 
            	<argument name="block_id" xsi:type="string">usa_delivery_message</argument> 
            </arguments> 
        </block> 
	</referenceContainer>

The text display but displayed at bottom of the description box, how to show below the price?

0 Kudos
Reply
‎10-19-2020 10:47 PM
‎10-19-2020 10:47 PM

Re: How do I add custom text under the price in frontend?

@Prince Patel  I am created a custom static CMS Block and call from the product page, how can i exactly place under price but currently showing under description box.

 

Path : app/design/frontend/Codazon/fastest/grocery_gourmet/Magento_Catalog/layout/catalog_product_view.xml

 

code: (custom code added Botton of the code - usa_delivery_message )

 

 

<?xml version="1.0"?>
<!--
/**
 * Copyright © 2015 Magento. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<page layout="1column" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <move element="product.info.sku" destination="page.main.title" />
        <move element="product.info.review" destination="page.main.title" after="product.info.sku"/>
        <move element="product.info.stock.sku" destination="product.info.main" after="page.main.title"/>
	<referenceBlock name="catalog.leftnav" remove="true"/>
	<move element="product.info.overview" destination="product.info.main" after="product.info.review" />	
	
	<referenceBlock name="product.info.overview" template="product/view/short_description.phtml">
		<arguments>
            <argument name="at_call" xsi:type="string">getShortDescription</argument>
            <argument name="at_code" xsi:type="string">short_description</argument>
            <argument name="css_class" xsi:type="string">overview</argument>
            <argument name="at_label" translate="true" xsi:type="string">Overview</argument>
            <argument name="title" translate="true" xsi:type="string">Overview</argument>
            <argument name="add_attribute" xsi:type="string">itemprop="description"</argument>
        </arguments>
	</referenceBlock>
	<referenceBlock name="product.info.addto"/>
	<move element="product.info.addto" destination="product.info" after="-" />
	<referenceContainer name="product.info.social">
		<block class="Magento\Catalog\Block\Product\View" name="product.info.social.links" as="social" template="product/view/social.phtml" after="-" />
	</referenceContainer>
	<referenceContainer name="product.info">
		<container name="product.info.staticblock" label="Product Static Block" htmlTag="div" htmlClass="product-info-staticblock" before="-" />							
	</referenceContainer>
	<referenceContainer name="content">
		<container name="product.main.content" htmlTag="div" htmlClass="product-main-content" before='-'></container>					
	</referenceContainer>
	<referenceContainer name="product.main.content">
		<container name="product.info.row" htmlTag="div" htmlClass="row">
			<container name="product.info.left" label="Product Content Left" htmlTag="div" htmlClass="product-info-left col-sm-19" />
			<container name="product.info.right" label="Product Content Right" htmlTag="div" htmlClass="product-info-right col-sm-5" />
		</container>
	</referenceContainer>
	<move element="product.info.media" destination="product.info.left" before='-'/>
	<move element="product.info.main" destination="product.info.left" />

	<referenceContainer name="content"> 
	 		<block class="Magento\Cms\Block\Block" name="block_identifier" after="product.info.price"> 
            	<arguments> 
            		<argument name="block_id" xsi:type="string">usa_delivery_message</argument> 
           		</arguments> 
     		</block> 
    </referenceContainer>
    <move element="block.identifier" destination="product.info.main" after="product.info.price"/>

    </body>
</page>

 

 

Now display under https://i.imgur.com/VjKTKQp.png

0 Kudos
Reply