MageParts

Skip to Main Content »

User Guides

My Cart

You have no items in your shopping cart.

Community Poll

What do you think of our support service?
 
 
 
 

Newsletter

Newsletter
 

Drop-Down Quantity   -   User Guide

Chapter 1: Working with the Drop-Down Quantity extension

This chapter will cover how to use the Drop-Down Quantity extension in Magento.

1.1Applying default settings for the entire catalog

From the system configuration section included in this extension you can apply default settings for your entire catalog (see chapter 2.3). This means that you can apply drop-down lists for all of your products at once, rather than applying separate rules for each of your products.

You can of course override these settings for specific products (you can even disable the extension for specific products). Please see chapter 1.2 for more information regarding single product settings.

1.2Applying specific settings for a single product

The Drop-Down Quantity settings are located in the Inventory tab on your products.

Inventory tab

From here you can enter the product specific settings for the drop-down list.

Drop-Down Quantity Box
SettingDescription
Use Drop-Down Quantity On This ProductWhether or not to use Drop-Down Quantities for this product.
ValuesQuantity options, can be both integer and decimal numbers. Options are separated by commas (,). Example: 10,12,15.5,20.75,25
PreselectedThe option you wish to be preselected (must be one of the comma separated numbers in the Values setting). Leave this blank if you wish for the top option to be selected by default.
Hide Unavailable Quantity OptionsTick this checkbox to hide unavailable quantity options from the drop-down list for this product.

You can of course also use decimal values, as long as you do not include trailing zeros. For example use 2.5, not 2.500.

Drop-Down Quantity Box 2

To apply the settings, simply save the product as you normally would and they will take effect immediately.

1.3Configurable products

Just as explained in chapter 1.2, you can apply specific settings for a configurable product. However, configurable products are, as we all know, constructed by simple products, which can have their own drop-down quantity settings. We have written a short example to better illustrate how this works:

example

Let's say that we have a configurable t-shirt product, which can be purchased in various sizes and colors. Now, let's say that the drop-down quantity settings for the configurable product are as follows:

Table 1

Configurable Product 1
SettingValue
EnabledYes
Values2,4,6,8,10,12,14,16,18,20
Preselected8
Hide Unavailable Quantity OptionsTicked (Yes)

And now let's say that the associated product with size large and color green has the following settings:

Table 2

Configurable Product 2
SettingValue
EnabledYes
Values3,6,9,12,15,18,21
Preselected12
Hide Unavailable Quantity OptionsTicked (Yes)

Now, whatever options the customer selects for the configurable product (expect for size large and color green), the drop-down quantity list will carry the values of the configurable product (in this example, the data displayed in table 1).

Configurable Product 3

But if the customer select the options large and green the drop-down quantity list will be updated to carry the values specified for that specific product instead (in this example, the data displayed in table 2).

Configurable Product 4

1.4Grouped products

You cannot apply any drop-down quantity settings directly on your grouped products, you will instead have to apply the settings on each of the simple products associated with the grouped product.

If your grouped product for example contains three (3) simple products, you will need to apply the desired drop-down quantity settings on each of those simple products.

Chapter 2: Configuration options

This chapter will cover how to configure the Drop-Down Quantity extension.

2.1Configuration overview

The configuration is accessible from the top menu System → Configuration on the tab MageParts → Drop-Down Quantity.

Config overview
  1. Navigate to System → Configuration in the top menu.
  2. Click on the Drop-Down Quantity tab in the MageParts section of the left-hand menu.

2.2General Settings

General Settings
OptionDescription
EnabledWhether or not the extension is enabled.
Enable For Product CollectionsWhether or not the extension is enabled for category view, product searches, CMS pages displaying product lists, etc.
Specify QTY MessageThe message which will appear when a product can't be added to the shopping cart because its quantity is incorrect. For a more detailed explanation please see chapter 2.5.

2.3Default Settings

If these settings are filled out, every product in your entire catalog (regardless of product type) will have their quantity boxes replaced by select lists with the values filled out in these settings.

These settings can be overridden by applying specific settings on your products (please see chapter 1.2 for more information regarding single product settings).

Default Settings
OptionDescription
Drop-Down List ValuesDefault quantity options, can be both integer and decimal numbers. Options are separated by commas (,). Example: 10,12,15.5,20.75,25
Preselected ValueThe option you wish to be preselected (must be one of the comma separated numbers in the Drop-Down List Values setting). Leave this blank if you wish for the top option to be selected by default.
Hide Unavailable Quantity OptionsIf this setting is enabled all unavailable quantity options will be hidden from the drop-down lists by default.

The Hide Unavailable Quantity Options setting is probably best explained with a short example.

example

Let's say that you have a cell phone with a stock level (quantity) of 45, and the available quantity options are set to 10, 20, 30, 40, 50, 60, 70, 80, 90, 100.

Hide Unavailable Qty Options 1

Please note that in the image above the Hide Unavailable Quantity Options setting is turned on.

On the frontend of the store the options 50, 60, 70, 80, 90 and 100 are now removed from the drop-down list for this particular product as it only has a stock level (quantity) of 45.

Hide Unavailable Qty Options 2

If the Hide Unavailable Quantity Options setting had been turned off all of the quantity options would be displayed regardless of the products stock level (quantity).

Hide Unavailable Qty Options 3

2.4Automatic Price Updating

Automatic price updating basically means that the price of a product will be updated to display price * selected quantity whenever a customer changes the selected quantity of a product.

example

If you for example have a cell phone with a price of $150.00 available in your store and the customer selects the quantity option 10 then the displayed price would be updated to $1,500.00.

Automatic Price Updating 1

If the customer then would select the quantity option 20 the displayed price would be updated to $3,000.00.

Automatic Price Updating 2

This feature works of course in product lists as well (such as the category view / product searches etc.). And it works for all price forms (special prices / regular prices / price incl. tax / price excl. tax).

Tax is set to 10% in the image below.

Automatic Price Updating 3

This feature also works with custom options, tier pricing and super attributes. And of course it also works with all product types (such as configurable / grouped / bundled / simple / virtual / downloadable etc.).

Automatic Price Updating 4
SettingValue
Regular price$13.50
Tier pricingBuy 10 for $11.50 each ($12.65 incl. tax) (save 15%)
Super attributesThe color green which we have selected costs an additional $5.25 each ($5.78 incl. tax)
Price ea. excl. tax11.50 + 5.25  =  $16.75
Price ea. incl. tax16.75 + 1.675  =  $18.425
Tax10%
Quantity selected10
Custom optionPadding +$10.00 each (+$11.00 incl. tax)

As you can see in the image above the prices are calculated accurately and they take both custom options, super attributes, taxes, and tier pricing into account:

Total Price Excl. Tax: (16.75 * 10) + (10.00 * 10)  =  $267.50
Total Price Incl. Tax: (18.425 * 10) + (11.00 * 10)  =  $294.25

The price updating works regardless of how many custom options are selected, and the price is updated accordingly as soon as an option is selected / deselected.

Automatic Price Updating 5
SettingValue
Regular price$13.50
Tier pricingBuy 10 for $11.50 each ($12.65 incl. tax) (save 15%)
Super attributesThe color green which we have selected costs an additional $5.25 each ($5.78 incl. tax)
Price ea. excl. tax11.50 + 5.25  =  $16.75
Price ea. incl. tax16.75 + 1.675  =  $18.425
Tax10%
Quantity selected10
Custom optionPadding +$10.00 each (+$11.00 incl. tax)
Custom option 2Water Proof +$30.00 each (+$33.00 incl. tax)

Total Price Excl. Tax: (16.75 * 10) + (10.00 * 10) + (30.00 * 10)  =  $567.50
Total Price Incl. Tax: (18.425 * 10) + (11.00 * 10) + (33.00 * 10)  =  $624.25

Again if the customer would change the selected quantity of the product the price would update immediately and would still take custom options, super attributes, taxes, and tier pricing into account when calculating the new price.

Automatic Price Updating 6
SettingValue
Regular price$13.50
Tier pricingBuy 20 for $9.50 each ($10.45 incl. tax) (save 15%)
Super attributesThe color green which we have selected costs an additional $5.25 each ($5.78 incl. tax)
Price ea. excl. tax9.50 + 5.25  =  $14.75
Price ea. incl. tax14.75 + 1.475  =  $16.225
Tax10%
Quantity selected20
Custom optionPadding +$10.00 each (+$11.00 incl. tax)
Custom option 2Water Proof +$30.00 each (+$33.00 incl. tax)

Total Price Excl. Tax: (14.75 * 20) + (10.00 * 20) + (30.00 * 20)  =  $1,095.00
Total Price Incl. Tax: (16.225 * 20) + (11.00 * 20) + (33.00 * 20)  =  $1,204.50

As said, this feature works with every product type and all price forms (special prices / regular prices / incl. tax / excl.tax / tier pricing / custom options / super attributes etc.). However there are two problems with the feature which should be noted.

1) It doesn't work with bundle products which has their price type set to dynamic. There are no problems with bundle's which uses the price type fixed though.

2) It doesn't calculate the price of custom options with the price type percent correctly, there are no problems with custom options which uses the price type fixed though.

You can enable / disable the feature from the system configuration.

Automatic Price Update Settings
OptionDescription
EnabledWhether or not automatic price updating is enabled.
Enabled For Product CollectionsWhether or not automatic price updating is enabled for category view, product searches, CMS pages displaying product lists, etc.
Enabled In Shopping CartWhether or not automatic price updating is enabled on the shopping cart page.

2.5Drop-Down List Settings

Drop-Down List Settings
OptionDescription
Use Top OptionWhether or not to include an option at the top of every select list.
Top Option TitleThe title of the top option.
Option PrefixSign, word or text which is to be included before each option title.
Option SuffixSign, word or text which is to be included after each option title.

2.6Shopping Cart Evaluation

Shopping cart evaluation is used to ensure that products added to the shopping cart have been assigned proper quantity values. We have written a short example below to better illustrate the meaning of this:

example

Let's say that you have a simple product in the available quantities of 3, 6, 12 and 15.

Shopping Cart Evaluation 1

A customer now navigates to the product on the frontend of your store, selects the quantity 6 and adds this to the shopping cart.

Shopping Cart Evaluation 2

The customer then proceeds to continue shopping and decides to add another 3 of the same product to the shopping cart.

Shopping Cart Evaluation 3

The cart evaluation system will now notice that the product the customer is trying to add already exists in the shopping cart, and that its current quantity is 6.

It will then check if the current quantity (6) + the requested quantity (3) is an available option for the product (in this case 6 + 3 = 9).

As described above, the only quantities available for this specific product are 3, 6, 12 and 15. Since 9 is not one of these values, the customer will be unable to add this to the shopping cart, and the quantity of the product will remain at 6.

In Magento version 1.4 and above, the customer will also get a message explaining what went wrong.

Shopping Cart Evaluation 4

In earlier version than 1.4 the customer will simply receive an error message stating that the product couldn't be added to the shopping cart.

Had the customer instead tried to add another 6 of the same product to the shopping cart it would have succeeded, since 12 is one of the available quantities.

Disabling evaluations will make the system skip this checkup.

Shopping Cart Evaluation
OptionDescription
Evaluate Grouped ItemsWhether or not to use quantity evaluation for grouped products.
Evaluate Bundled ItemsWhether or not to use quantity evaluation for bundle products.
Evaluate Configurable ItemsWhether or not to use quantity evaluation for configurable products.
Evaluate Item QuantityWhether or not to use quantity evaluation at all.

2.7Quantity Box Element Paths

A lot of Magento based stores uses a customized theme, and sometimes the designer modifies the search paths of certain HTML elements in the source code. In some cases this means that the quantity boxes this extension is meant to replace cannot be found. Thankfully this can easily be resolved by modifying the settings available in this section.

Please note that if you do not have basic knowledge of HTML and CSS we recommend that you consult your developer or our support staff (info@mageparts.com) if you need to modify these settings.

Quantity Box Element Paths
OptionDescription
Simple Product ViewSearch path of the quantity box element in the normal product view (simple / virtual / downloadable / custom product types).
Grouped Product ViewSearch path of the quantity box elements in the grouped product view (must refer to a class, not an id).
Configurable Product ViewSearch path of the quantity box element in the configurable product view.
Bundle Product ViewSearch path of the quantity box element in the bundle product view.
Shopping Cart Form ElementSearch path of the shopping cart form element on the shopping cart page. Please note, the form element in which the quantity boxes reside, not a direct reference to the quantity box elements themselves.
Product List ID PatternAn ID pattern which is meant to be used on all product lists. Please see chapter 3.1 for more information regarding this.

Please see chapter 3.3 for more information regarding DOM paths.

2.8CSS Style Settings

CSS Style Settings
OptionDescription
Select Box WidthHere you can set a width for the drop-down quantity select box elements. Please make sure to use an integer if you modify this setting. Leave empty for Magento defaults.

2.9Automatic Quantity Options

By enabling this feature the extension will automatically generate the options for the drop-down lists.

Please note that this feature only functions for Magento version 1.4.1.0 or later.

Automatic Quantity Options
OptionDescription
EnabledWhether or not the feature is enabled.
Generate From FieldWhich field the options should be generated from.
Option LimitMaximum number of options in drop-down lists. If you select Custom Limit Value you will need to fill in a custom option limit in the field Custom Option Limit which will appear when the option is selected.
Custom Option LimitMaximum number of options i drop-down list. Must be an integer (ie. a number that doesn't include any decimals).
List Option Refresh IntervalHow often the automatically generated options should be recreated.

Chapter 3: Developers section

This chapter will cover how to modify the extension to work in customized locations and product lists.

Please note that this chapter is meant for developers and assumes that you have basic knowledge of HTML and XML. If you require the assistance of a developer to apply any modifications, and you do not have one on staff, please contact us at info@mageparts.com.

3.1How to apply the extension on a product list

Some themes include quantity boxes in product lists displayed in for example the category view, product searches or even specific CMS pages. The DDQ extension comes prepared for this scenario, buy your developer will need to customize the source code of a few templates a little bit.

In order for the extension to find the quantity box elements, and apply the right rules on the right products, the quantity box elements will need an ID which can be interpreted by the extension.

The ID pattern you need to apply is constructed like this: value of the Product List ID Pattern setting (see the last setting in chapter 2.6) + [ PRODUCT_ID ].

Rather than explaining the necessary modifications in detail, we have linked the source code to a modified version of the template app/design/frontend/base/default/template/catalog/product/list.phtml below. Download the file and look at lines 64 to 71 and 119 to 126, or search for <!-- MAGEPARTS MODIFICATION -->.

Template example file: template_sample.txt

Please do not simply copy paste the modifications from this file as it is merely an example, and it's more than likely your template file will look different from ours.

If you require any help applying the necessary modifications, our support team is always available to help you out: info@mageparts.com.

3.2How to load this extension on customized locations

To implement the extension in specific sections of you website you only need to modify the file app/design/frontend/base/default/layout/mageparts/ddq.xml (please note the path is app/frontend/default/default/... below version 1.4 of Magento).

There are two important sections in this file, line 41 - 45 (<default>) and 47 - 51 (<catalog_product_view>).

Line 47 - 51 shows you how to implement the extension on a page which displays a single product, you just need to copy paste those lines and apply them for your controller / action. Which product is being displayed is picked up by the extension by using the id parameter.

Line 41 - 45 shows you how to implement the extension for product collections, such as in product searches, category view or similar. By default this block is implemented on every page, to ensure that it will always work, wherever product lists are being displayed. Though it isn't displayed unless a product collection is loaded and the Enable For Product Collections setting (see chapter 2.2) is set to yes. Again, you can copy this code and modify it to be implemented for the controllers / actions of your choice.

If you require any help applying any modifications, our support team is always available to help you out: info@mageparts.com.

3.3What are DOM paths, and how do they work?

DOM stands for Document Object Model.

A DOM path is a pointer to one or more HTML elements and mainly consists of classnames (defined by a dott (.)), id's (defined by a # (number sign)) and tag names (such as li, span or div).

DOM paths to certain elements can be different in independent themes, since designers may move or rename HTML objects. Thus, some of the DOM paths in the configuration may have to be modified in order for the extension to function properly with your theme.

Below is an example which illustrates a very simple piece of HTML code, and an accurate DOM path to one of the elements in that code.

Please note that we have used various colors to mark classnames, ids and tag names in the example. Classnames are marked with green, ID's are marked with red and tag names are marked with purple.


Example

  • <div id="main_col">
    • <div class="product-box">
      • <span classname="description">This is a simple product description.</span>
      • <span classname="price">$99.9</span>
      • <span classname="add-to-cart">
        • <button>Add to Cart</button>
      • </span>
    • </div>
  • </div>

According to the example above, this would be the DOM path to the <button>Add to Cart</button> element:

#main_col .product-box .add-to-cart button

As you can see, DOM paths needs to follow the structure of the HTML document.

Any web developer (and most web designers) will know how to find the DOM paths to various elements, and as always, our support staff is always happy to help you out. You can contact our support staff here.