ModularMerchant
MMv4 Knowledge Base
Shopping Cart Software Knowledge Base
If it can be known about the shopping cart software, it is here.
Create reusable headers/footer with Custom QuickCode Tags Have your store match a website that links to it
Home > Shopping Cart Software Components > Administration Area > Design > FAQs & Tutorials > Display sale prices in red text

Display sale prices in red text

loraine g. from billings writes:
Dear Modular Merchant Shopping Cart Software,

In my online store, I'd really like to draw attention to the products I have on sale by highlighting their sale price in red text. Is it possible to highlight the sale products, and only the sale products, in this way?


With Sincerest Gratitude,
Loraine G.

Thank you for the heartwarming question, Loraine. It warms my heart even more to be able to tell you that, yes, it is possible to display sale prices in red — or with any special treatment, for that matter.

Here is one example of how this can be achieved. Note: For simplicity's sake, the following technique uses a simple HTML "font" tag. The same affect could be achieved with CSS styles too, of course.

To edit the color of a product's sale price, you will need to edit the HTML template of any storefront page that displays the product's price. To do that, first log in to your store's Administration Area and go to [Design > HTML Templates]. That is the location of the aptly named Template Editor.

In the Template Editor, load a template that displays product prices, such as the storefront template. Locate the section of the template that displays the product price. It will look something like this:

example

Replace that chunk of code with something like this:

example

In this example, the content between the {IF-PRODUCT-PRICE-REDUCED-BEGIN} and {ELSE} QuickCode Tags is only displayed if the product is on sale. (ie: its price has been reduced by a discount, promotion, event, coupon, etc.) So, to achieve the desired effect, a font tag coloring the text red is applied to the price displayed in this section.

The text between the {ELSE} and {IF-PRODUCT-PRICE-REDUCED-END} QuickCode Tags is displayed if the product isn't on sale. In this section, no effects have been applied to the price, and it displays normally.

feel free to innovate
Keen readers may have realized that any content may be encapsulated within the {IF-PRODUCT-PRICE-REDUCED-BEGIN} and {IF-PRODUCT-PRICE-REDUCED-END} QuickCode Tags — it's not restricted to just the product's price.

These tags could be used to display (or hide) entire paragraphs of information, or images, or links to other pages, or information on other products in the promotion, or a picture of Abraham Lincoln eating a sandwich — depending on whether the product is on sale or not. The possibilities are endless*!

*This statement is based upon the assumption that the Universe is indeed infinite. If the Universe is ever found to be, in actuality, finite, and its own magnitude causes it to henceforth collapse upon itself, Modular Merchant will graciously redact this statement prior to the ensuing fiery apocalypse.

— Last Edited - 10/12/2011 9:04pm PDT
Rank and add a comment to this article
Only logged in users may leave comments and rank articles. Log in to have your say!
  Knowledge Base Home

  QuickCode™ Tag Glossary

  Modular Merchant.com Homepage

Not Logged in.
Either Log in or create a User Account.

Other articles in this category...

Add a "Terms of Service" agreement to a store page

Can QuickCode Tags Be Used in PHP Statements?

Can QuickCode Tags be used on non-store webpages?

Create a custom version of any QuickCode Tag

Create reusable headers/footer with Custom QuickCode Tags

Display sale prices in red text

Have your store match a website that links to it

List of available Templates for use in Template Packages

Playing Flash video instead of downloading it

Require service agreement when a specific product is purchased

The difference between templates and web pages

Untranslated Red QuickCode Tags

Using "Add to Basket" links on your website.

Using comments in Custom QuickCode Tags

Your storefront on smartphones & mobile devices

Creating Template Packages: Part 1 of 4

Creating Template Packages: Part 2 of 4

Creating Template Packages: Part 3 of 4

Creating Template Packages: Part 4 of 4