Interesting Project – File Uploads

Finished up another interesting osCommerce project this week, which involved allowing the shop owner to put a “flag” on a product. This flag determines whether the product requires interaction from the customer in terms of an upload (think in terms of an image for a printed t-shirt).

Step 1 was to add in the flag capability. Easy, I simply added an extra column in the category structure, along with the relevant DB changes.

Step 2 was to add in the upload facility in the account_history_info.php page. There is a contribution that allows file uploads from the product_info.php but this was unsuitable as the site already has too much complications in contributions – QTPro, different attributes and so on.

When the files are chosen, they are uploaded and show in the page;

Step 3 was to allow the Shop Owner to grab the files, make the product and use the order.php page as so;

to uploads images of the product;

At this point, Shop Owner emails the client asking him/her to log in to the account_history_info page.

Step 4 the account_history_info page shows the two client uploaded images and the two admin uploaded images.

along with “Fancy Box” popup to show the two admin images larger;

At this point, the client can “approve” the product, or “reject” the product – and tell the Shop Owner why.

If the product is rejected, the Admin/order shows this;

The Shop Owner makes the corrections, and uploads the images of the new product using the orders page. The customer can now see the new product and can again “approve” or “reject”;

This time, the product is perfect, so the customer “approves”.

The Shop Owner can now send the product to the customer.

As you can see, quite a big task, and fiddly to get right. This involved changes across multiple files, though the two main files changed are admin/orders.php and account_history_info.php

A very nice project to work on, and I am very pleased with the end result. As is my client;

….you did a great job….

Tabbed Information in the Product Info page

Sometimes it is desirable to split blocks of information up, to make it more readable. A good example would be a product that needs “technical specs” – example.

In osCommerce there is only 1 input box for the products description – so we need to think a way to separate the inputted information. I was pointed at this contribution by one of my good clients running on a 2.2 shop – this contribution uses webfxtabpane to show the tabs, based on some custom coding in the products description field.

It ends up looking like this;

The image above is taken from the download. The tabs are ugly in the extreme in my opinion, and the tabpane system is rather outdated I think.

My idea was to juice those tabs up using the jquery UI. A small coding change in product_info.php (as well as the addition of jquery ui backported from 2.3.1 to 2.2) allows the output to look like this;

Much nicer, much cleaner and more useable!

Stock Taking, jQuery, Reporting

Last week a new client approached me to help out with an admin function within her site. Here’s the basic idea;

Each Order received has a tickbox by the product:

The tickbox would update an entry in the database to state whether the product is “in stock” (1) or “out of stock” (0). The system worked well, but was coded as part of the form so needed the [update] button to be pushed. That’s not a massive big deal, but it’s an extra step that might get forgotten by the data entry people and so on.

Once the days orders of products had been “ticked”, a report is run to show the shopwoner what needs to be ordered from her suppliers and what she has already on hand. This was already coded.

The client had attempted to make the checkbox fire automatically using javascript, but had come to a dead end – which is when I was contacted.

The brief (in brief!!)

Make the checkbox fire automatically, to update the database entry on a per product, per order basis. Make the table row highlight if the checkbox is ticked.

The solution

Firstly, I tried to use the customers existing javascript code, but after a couple of hours was just going around in circles trying to make sense of what was happening. I gave up on that, and rolled my own.

The first step was to get it all working on a new RC2 (note that the client does not yet run 2.3.1, though 2.3.1 and 2.2 are very similar in most resepects especially in the admin area). I installed rc2 and amended the orders_products DB table to hold a tinyint flag saying 0 or 1 for stock purposes.

I then added a checkbox for each product ordered, the result looked exactly the same;

Next up, I coded up a .js file which (on checkbox tick) reads the value of the checkbox (1 or 0) and the value of the product ID and the Order ID. It then uses the ajax function of jquery to open a standalone php file which takes those inputs and updates the database accordingly. The .js file also fires off a css update using addClass to highight (or un-highlight) to row affected (which means anyone doing data work, can straightaway see what has been changed);

And no need to press the update button any more.

Shipping Prices per product (for two regions)

Anyone got an idea on how to do this? I’ve never used the “multi geo zone” shipping mod so not 100% sure if it would work well…

Basically:

UK
Product A shipping = £2.50
Product B = £1.99
and so on

Rest of the World
Product A shipping = £4.20
Product B = £4
and so on

My initial thought was to put in a couple more boxes in the product adding/editing page in admin;

UK shipping cost: [ ]
ROW shipping cost: [ ]

Then make a new shipping module to suit those inputs. But if there is something already made that does the same, and it’s well coded, let me know please. This would be for a 2.2 shop.

My site is live – good? bad? indifferent?

After well over a year, and then ditching the work, restarting, using 2.2, then trying 3 and eventually settling on 2.3.1…I am pleased to announce that my own osCommerce site has been freshened up and is online!

Have a look at oscommerce-templates.co.uk – it’s far from finished, but the basics are there.

Interesting Features

Mega Drop Down Menu System

Including LOGIN form:

Which changes to ACCOUNT and LOGOFF (when logged in):

Cart Summary In Header

Which changes when the cart has contents:

And changes again to show tiny product images when the “bag” is mouseover’d:

Cufon Font Replacement

To make the heading texts look much nicer than usual:

Popup Info

Cool popup information for the “New Products”:

Product Presentation

Nice looking presentation when in the category structure (and eslewhere):

Checking Out

Non invasive account set-up:

Lots more to do, I’m very aware of that. I also hope to add at least 1 template per week, and all the scripts and bits/bobs that I’ve worked on over the past years.

Anyway, let me know what you think.

My osC site – create_account.php

In my own oscommerce site, that I have been working on for about the last year as time allows, I decided to do away with the need for the clients address. I don’t need the address details as I sell only intangible products such as scripts and templates…

So, I have been locally testing a new create_account page, which looks like this;

As you can see I only have name, email, company, password. This should help to stop abandonment of carts.

I also coded up a quick and easy password generator – if the buyer clicks “or Random”, then a random password is made, inserted into the two boxes, and a message appears;

Once the person has created the account, no addresses show anywhere. This presented a bit of an issue as checkout_shipping depends upon having an valid address in order to work out postage costs. No problem for me as I do not charge postage – so simply setting the order_type to virtual skips the problem.

Next up, I had to change the address format in the database, to show only the name and company. And change some internal pages (such as checkout_confirmation) to not show the addresses (usually shows billing address and delivery address).