WP e-Commerce add the Variation price to the Variation selector

Posted by on Apr 8, 2012 in Blog, E-Commerce, Echo, Storefront Themes, WP e-Commerce | 5 Comments

The question

“Is there was a way to display the price of each variation next to it in the drop down menu, that would be great?”

I actually thought this would be quite difficult and involve hacking on the core plugin files. I hunted around in the plugin files without any luck. Then I took a look at the single product page and realized it was really easy and could be accomplished in the theme. The instructions below are specifically for the Storefront Themes Echo theme, but should work with most WP e-Commerce themes. The line numbers will of course vary but the code should be very similar even identical.

Locate the wpsc-single_product.php file which is in the Echo theme folder. Make a safe copy somewhere in case you have problems. If you have never edited PHP before don’t worry this edit is a simple cut and paste, jump in! See the note at the end for good free tools to do this.

Find the code highlighted below. The example is from Echo version 1.4.1, you should be able to find it easily in any version.

										<?php /** the variation HTML and loop */?>
										<td class="col2"><select class="wpsc_select_variation" name="variation[<?php echo wpsc_vargrp_id(); ?>]" id="<?php echo wpsc_vargrp_form_id(); ?>">
										<?php while (wpsc_have_variations()) : wpsc_the_variation(); ?>
											<option value="<?php echo wpsc_the_variation_id(); ?>" <?php echo wpsc_the_variation_out_of_stock(); ?>><?php echo wpsc_the_variation_name(); ?></option>
										<?php endwhile; ?>
										</select></td></tr>
									<?php endwhile; ?>

You just need to add space colon space after the variation name for looks and then the variable for the variation price. The change is to line 134, below is the new line you can find the change by looking for the colon, the change is remarkably simple. You can just copy and paste this line to replace the entire existing line 134.

<option value="<?php echo wpsc_the_variation_id(); ?>" <?php echo wpsc_the_variation_out_of_stock(); ?>><?php echo wpsc_the_variation_name(); ?> : <?php echo wpsc_the_variation_price(); ?></option>

Tools:

You must use an appropriate code editor NOT microsoft word or anything like that which adds a lot of invisible formatting and will be a disaster.
If you do not have one, 2 excellent free ones are…
TextWrangler for Mac, http://www.barebones.com/products/textwrangler/
Notepad++ for the PC http://notepad-plus-plus.org/

5 Comments

  1. norb
    October 11, 2012

    I was looking all over the internet for a similar solution. I’m using WP e-commerce plugin version 3.8.8.5 and the code you provided seems not work as you describes. Instead of price next to variation name i just get colon with empty space. Any sugestions?

    Reply
    • norb
      October 11, 2012

      I forgot to mention that the price appears only when a product have only one set of variations. When you set more than one variations set the price dissapears 🙁

      Reply
      • Mark
        December 1, 2012

        I think it can not work with 2 variations as you do not know what the price is until both are selected. So where would you put what price?

        If one variation does not effect price maybe you could use the product options plugin. This would make your price work in the one variation and your database load less. Plugin is free in the WordPress plugins page

        WP e-Commerce Simple Product Options
        http://www.leewillis.co.uk/product-options-for-wp-e-commerce/

        Reply
  2. mgason
    September 7, 2012

    You do it with the Price Control panel where you enter price in the Products screen. You can not do %. You can do a price per item.
    So you have a product and you set the price to $50.00
    Then you check “Table Rate Price”
    2 boxes appear put the number say 2 and the per product price say $45
    Click + Add level
    3 price is $40
    and so on.

    Reply
  3. Dan Pratt
    September 6, 2012

    I’m looking to add a field to allow buyers the option when they purchased 2 of the same items get 10% off, or three and get 15% off … any ideas how I can do this. (wp ecommerce)

    Reply

Leave a Reply