Hard Coding Price Modifiers and Product Options

Many site owners would like to give their customers the option to configure products; t-shirt colors and sizes, part upgrades, material types and more. These options might be no-cost options, or price altering options. Though CartThrob offers a method to add product options and price modifiers via a product channel, you might prefer to hard code options and price modifiers. Perhaps, you have 100 products all with the same modifiers and options, or you only have a few products and don’t feel like setting up a product channel, what’s certain is you just want to hard code this information into your templates.

CartThrob offers you the ability to hard code information into your templates, or mix channel and hard coded data depending on your needs. The item_option variable is available in the Add to Cart Form that will allow you to create the configuration system that suits you best. Please see the relevant tag documentation for more details on adding products to your cart.

Fig 1. Hardcoded options sample with jQuery price updating

Hardcoded options sample
Hardcoded options sample

Fig 2. Default price of an option

Screencapture of rendered code
Screencapture of rendered code

Fig 3. Menu adjustment is made

Screencapture of rendered code with item selected
Screencapture of rendered code with item selected

Fig 4. Final price is updated both in a hidden field, and in the

display to the customer

Screencapture of changed values after menu selection
Screencapture of changed values after menu selection

The code shown in figure 1 will generate something like figure 2. This sample would allow you to add a product with a price that’s based on the size of a shirt, and change this price on the fly based on the item chosen. jQuery is used here to dynamically update a hidden price field, and change the price the custom sees.

When you adjust prices from the front end and manually set the price, you need to set “allow_user_price” parameter or your custom price will be ignored. This is a safety measure to confirm that if there’s a price set on the front end, it’s something that you expect.

Here’s that code again, in an easy to copy/paste format:

{exp:cartthrob:add_to_cart_form title="My Product" price="9.95"    allow_user_price = "yes" return="template_group/template"}
        T-Shirt name: My Custom Tee
        Price: <span id="my_price">$9.95
        Size: <select id="custom_size" name="item_options[custom_size]">
                <option value="S">Small
                <option value="M">Medium
                <option value="L">Large
            
        <input type="hidden" name="price" value="9.95">
        <input type="submit" value="Add to Cart">
{/exp:cartthrob:add_to_cart_form}

Using hardcoded data in your templates provides you with a lot of power and flexibility. You can mix these hardcoded scenarios with standard products as well, allowing you to create extremely complex one-off products, as well as to output database driven simple products within the same cart.