First of all you will need a domain name and a hosting account. There are various providers that do this, it’s up to you to choose one of them.

First things to make clear:

1. It’s absolutely indifferent for osCommerce what domain name you’ll use. It can be www.mystore.com or www.kuku.com.
2. osCommerce doesn’t require any special hosting plan. You don’t need to buy any of the “e-commerce ready” type of hosting plans like many hosting companies offer.
3. You don’t need to sign up for any merchant account with yahoo, google etc. You don’t need to sign up anywhere
4. osCommerce is free software. There are no fees to pay to anyone. There are also no “free gifts” to get from anyone

osCommerce is a standalone shopping cart program (you can say e-commerce program) that has very few hosting requirements to run smoothly. It be installed on any PHP enabled web server that can connect to a MySQL database. In other words, make sure your hosting plan include at least one database

Your osCommerce hosting plan should include

• PHP 5+
• MySQL 5+
• cPanel access
• phpMyAdmin access

To say the truth there are very few, if any, hosts that do not offer this fot a couple of euros per month. The above describe a simple, common hosting plan.  So, please, don’t get on somebody’s hook who will try to sell you any “e-commerce ready” or “osCommerce optimized”  hosting for more money

In case you ask about my personal preference, I can only say that I’m very satisfied with the host I use now. You can take a look if you are interested, in case you want to start with them I would say that a basic “business package” is all you need for your start. Later on, depending on your traffic, the number of products you have etc, you can upgrade to an other plan anytime. Feel free to get in touch in case you are not sure about what kind of hosting you need

Avoid “installers”

One more thing of importance: Avoid any of the “one click” installation programs like “fantastico” or others. It can be that your host, or the one who offers the installation script does not offer the latest version of osCommerce. Also, you will miss a big part of the necessary understanding about how things work, and you will find your self asking questions like “where is the catalog” or “how can I go live” and such

Use the original

Don’t download osCommerce from anywhere else but from the official osCommerce website. You will see there 2 available versions: osCommerce Online Merchant v2.3.1 and osCommerce Online Merchant v3.0 Alpha 5. Take the first one, version 2.3.1. It may give the impression that version 3 is the latest but it is not. Version 3 is in “alpha” stage, that means it is still under development and not ready for production. Version2.3.1 is the latest stable version and this is the one you should use

I wish you a good start with osCommerce. In the next article I’ll explain how to install osCommerce easily. If you have any questions feel free to ask, or post a comment

The order confirmation email contains all kind of information except customers phone and email. What if you need to contact your customer? The only way to do this in osCommerce is, to go to the administration panel, search for the customer and retrieve the information from there.

Why do have it that complicated? Why not to have the information right in the email? Let’s add phone and email into the order confirmation mail, it’s a simple 2 step and straightforward task.

We know that the mail is getting generated in file catalog/checkout_process.php. The lines we need to edit in this file are in the “// lets start with the email confirmation” section. It all depends where in the mail we want the information to appear, lets say we need it to be under the “billing address”.

In this case we go to the lines

  $email_order .= "\n" . EMAIL_TEXT_BILLING_ADDRESS . "\n" .
                  EMAIL_SEPARATOR . "\n" .
                  tep_address_label($customer_id, $billto, 0, '', "\n") . "\n\n";

Directly after hat we add

// BOF Multimixer 26 11 10
  $email_order .= EMAIL_TEXT_CUSTOMER_TELEPHONE . ' ' . $order->customer['telephone'] . "\n";
  $email_order .= EMAIL_TEXT_CUSTOMER_MAIL . ' ' . $order->customer['email_address']. "\n\n";
// EOF Multimixer 26 11 10

Basically we are done. Only thing we need to do now, is to add 2 more language definitions for the words “email” and “phone”. In file catalog/includes/languages/english/checkout_process.php add before the last ?>

// BOF Multimixer 26 11 10
define('EMAIL_TEXT_CUSTOMER_TELEPHONE', 'Telephone:');
define('EMAIL_TEXT_CUSTOMER_MAIL', 'email:');
// EOF Multimixer 26 11 10

Thats it ! Enjoy :)

As a side note, let’s mention that,  for all people who believe that it is not necessary to have a script generating the buttons and who would prefer to use pure css buttons instead, I will post the way to do it soon. Same if you want to replace the image buttons.

Back to the topic, the button work fine, pressing it the customer gets one item added to the cart. To order eg 10 pieces, he need’s to go to his shopping cart, enter the desired quantity, click “update” and proceed to checkout. That’s also not bad if your store sell it’s items one by one usually.

What is if your store sell’s it’s items usually in larger quantities? Let’s say a customer what to buy 5 items as follows:

• A: 5pcs
• B: 8 pcs
• C: 3pcs
• D: 21 pcs

He need either to repeat the procedure of going to the cart, entering the desired quantity, pressing “update”, continue shopping, or to keep a list to change the quantities after all items are in the cart. In the first case he’ll forget maybe to add something to the cart, in the second case he’ll maybe forget to update something or he’ll think it over and order a lower quantity. All of this is not good for your store, not to mention all the unnecessary “clicks” that do not add any joy to the shopping experience.

What we need to do, is to add a quantity input field to the product information page of your osCommerce store, so  that customers can enter the desired quantity right away

To do this, we need first to know how the “add to cart” button work on that page. The following post refer to version RC2a of osCommerce, things are not very different in v2.3.1

Going to file  catalog/product_info.php we see that the file is in real a “POST”  form, and the “add to cart” button it’s submit button. On this we need to work.

Here is the part of the file we’re interested in

<?php echo tep_draw_hidden_field('products_id', $product_info['products_id']) . tep_image_submit('button_in_cart.gif', IMAGE_BUTTON_IN_CART); ?>

In version 2.3.1 the line number is 194 and look like this

    <span class="buttonAction"><?php echo tep_draw_hidden_field('products_id', $product_info['products_id']) . tep_draw_button(IMAGE_BUTTON_IN_CART, 'cart', null, 'primary'); ?></span>

In your file this will be placed in <td></td> or into <div></div> or similar. It can also be that in your file the number is a bit different, so please to not stick on it, and search for the code little more up or down in your file. However, we see that there is no word about any quantity, the only thing that get submitted is the product ID. We know that the quantity added to the cart is always 1. Going to file catalog/includes/application_top.php we also understand why.

Here is the line we’re interested in:

      case 'add_product' :    if (isset($HTTP_POST_VARS['products_id']) && is_numeric($HTTP_POST_VARS['products_id'])) {
                                $cart->add_cart($HTTP_POST_VARS['products_id'], $cart->get_quantity(tep_get_uprid($HTTP_POST_VARS['products_id'], $HTTP_POST_VARS['id']))+1, $HTTP_POST_VARS['id']);
                              }

In version 2.3.1 the line number is 333 and look a bit different

     case 'add_product' :    if (isset($HTTP_POST_VARS['products_id']) && is_numeric($HTTP_POST_VARS['products_id'])) {
                                $attributes = isset($HTTP_POST_VARS['id']) ? $HTTP_POST_VARS['id'] : '';
                                $cart->add_cart($HTTP_POST_VARS['products_id'], $cart->get_quantity(tep_get_uprid($HTTP_POST_VARS['products_id'], $attributes))+1, $attributes);
                              }

We see that number 1 is added to whatever amount exist already in the cart. It’s a “+1″ by default

Now that we know this 2 facts, we also know exactly what we have to do:

add one more field to the product information form. We want that field to be an input  field, so that customers can type in whatever they want

Change application top to add to the cart whatever got posted on the product page and not number 1 by default

First in file catalog/product_info.php we add in front of the submit button the quantity input field. We know that in osCommerce there is the predefined function tep_draw_input_field that do exactly what we want: To make an input field.

Finally the  line looks now like this for version 2.2 of osCommerce

<?php echo TEXT_ENTER_QUANTITY . ' ' . tep_draw_input_field('cart_quantity', '1', 'size="5"') . ' ' . tep_draw_hidden_field('products_id', $product_info['products_id']) . tep_image_submit('button_in_cart.gif', IMAGE_BUTTON_IN_CART); ?>

For the latest osCommerce version (2.3.1), the line look like this:

    <span class="buttonAction"><?php echo '<span class="text">' . TEXT_ENTER_QUANTITY . ' ' . tep_draw_input_field('cart_quantity', '1', 'size="5" style="vertical-align:middle;"') . '</span> ' . tep_draw_hidden_field('products_id', $product_info['products_id']) . tep_draw_button(IMAGE_BUTTON_IN_CART, 'cart', null, 'primary'); ?></span>

All we did was to add  tep_draw_input_field(‘cart_quantity’, ’1′, ‘size=”5″‘). We gave a name to this field, set the default number we want it to be (1) and set the size (5). You can also add a text, as we did, so that people know what he field is for. In this case, don’t forget to “define” this text in your file catalog/includes/laguages/english/product_info.php. Just copy the way it is done for other defines.

As you see, for version 2.3.1, we also wrapped that text into a <span class=”text”>, that we can format as we like in the stylesheet.css file. Also, adding a “vertical-align:middle;” to the input field we take care that it align nicely at the same height as the text. This all you are free to do as you like, it is not connected with the main function

Next step is in file catalog/includes/application_top.php. Instead of “+1″, that add 1 item to the cart each time the customer press the button, we want it to use the content of the input field we just created, so we replace “+1″ with + $_POST['cart_quantity']. Finally the line in the file looks like this for version rc2a

      case 'add_product' :    if (isset($HTTP_POST_VARS['products_id']) && is_numeric($HTTP_POST_VARS['products_id'])) {
                                $cart->add_cart($HTTP_POST_VARS['products_id'], $cart->get_quantity(tep_get_uprid($HTTP_POST_VARS['products_id'], $HTTP_POST_VARS['id'])) + $HTTP_POST_VARS['cart_quantity'], $HTTP_POST_VARS['id']);
                              }

and like this for version 2.3.1

     case 'add_product' :    if (isset($HTTP_POST_VARS['products_id']) && is_numeric($HTTP_POST_VARS['products_id'])) {
                                $attributes = isset($HTTP_POST_VARS['id']) ? $HTTP_POST_VARS['id'] : '';
                                $cart->add_cart($HTTP_POST_VARS['products_id'], $cart->get_quantity(tep_get_uprid($HTTP_POST_VARS['products_id'], $attributes)) + $HTTP_POST_VARS['cart_quantity'], $attributes);
                              }

You can of course replace the long $HTTP_POST_VARS with $_POST, I left it as is to make things more clear about what is changing and what not

A store owner asked me to do this for him, so I did and here are the results

How the “add to cart” area looked before

After adding the quantity input field, exactly as it is described here

And finally, after adding some css to make it look a little nicer

You see that it is easy to do as 1 2 3, so why don’t you try it your self?

I tried my self and here is the result of an other “add to cart” area I did

Don’t hesitate to ask if you have any problems. Or maybe you post your opinion here?

Update: If you want to go a step further and have a live price update functionality upon quantity and/or options change, then please check here: Live price update