Stuart Template for 2.3.3.4 osCommerce

My latest template can now be seen here. I’ve called it “Stuart” after the comic book guy in Big Bang Theory.

stuart

As you can see it is a “minimal” theme ready for you to build on in any way you wish. The side column infoboxes can of course be added back in should you wish and colour scheme is very easy to change.

Header Area

Very minimal, with a custom coded Cart and Buttons to “create account” and “login”, and of course when logged in “view account” and “log off”. Notice also that the cart icon changes when a product is placed into the cart, and the checkout link becomes “active” as well – have a look by placing a product into the cart.

Main Content Area

I have recoded the “new products” module from scratch to utilise a more semantically correct “list” of products. Buttons can of course easily be made smaller, just by amending 1 line of css code.

In the product page, I have removed the “bx gallery” in favour of a custom coded gallery which gives better results in my opinion (example; you can click on the main image or any of the thumbnails).

Titles

I have used a custom font which I believe looks good. This is very simple to change if you do not like it.

Footer Area

Contains a nice looking “social” box as well as a redesigned listing of categories, information, contact details and so on.

Final thoughts

As you can see the Stuart template is quite a departure from the normal osCommerce look and will make your site look very professional inside 30 seconds – as that is how long it takes to install on a new osCommerce 2.3.3.4 (will also work with any version of osCommerce from 2.3.1 onwards).

My overall idea for the template is to take away the “clutter” of normal osCommerce, and instead concentrate solely on the products you are selling.

Have a look, and if you are ready to take your shop to the next level by installing this template (or indeed any of my other templates), go to my osCommerce Templates site and press the buy button (it’s only £16, about $25usd).

Currencies as Icons in 2.3.x

Almost exactly 5 years ago I posted about using icons for currency selection. The question still comes up fairly regularly in the osCommerce forum.

So, here’s how to do it in 2.3.x – you’re going to end up with something like this:

20130325_1

You need to make a “currency” icon for each currency that you have. In a standard installation of osCommerce, this is EURO’s [ EUR ] and US Dollars [ USD ]. Save them into the /images/icons/ directory as .png files like so; EUR.png USD.png

Next up open up /includes/modules/boxes/bm_currencies.php

Step 1: create a variable holder

$currencies_string = NULL;

this line of code needs to be placed in the execute() function, right underneath the line that starts global $PHP_SELF …

Step 2: create the variable

Here we need to loop through the available currencies and output them as an image. Code; http://pastebin.com/6D8ewzsn

This should be added underneath this line of code: reset($currencies->currencies);

Step 3: Change the $data to output the $currencies_string

http://pastebin.com/iSu4tVDB

Done. Refresh your page and you should see your currencies box as images. Of course, I could make this into a better addon allowing you to associate an image with a currency from within the admin area, but that’s for another day if someone wants it badly enough.

In action

Latest osCommerce 2.3.3 Theme – Penny

This theme changes around 10 core osCommerce files so is easy to install even onthe most modified of sites. Have a look at the demo.

It is a 1 column design, so there is lots of available space on every page for promoting your products. It has a horizontal menu (with dropdowns), along with a much nicer footer area. Of course, the “new products” module is also updated.

The cost of this template? Just £16 (approx $25), and you could even get it for free by purchasing the “design oscommerce” ebook. If you would like to see my other templates I’ve recently built head over to choices page.

Sneak Preview of GREY theme

Here’s the latest template which is now complete:

amy_preview

This is a grey theme, perfect for any shop that is all about showing off the product and not showing off the look of the store. Of course, any aspect of the design can easily be changed to suit individual stores.

I’ll be updating the free choice page this afternoon, and so if you have not yet gotten the eBook, now’s the time!

Sneak Peek of Latest FREE template

Here’s a sneak-peek of the latest template available free of charge to the buyers of the eBook;

sneak-peek

Let me know what you think. I’ve still some work to do in the footer area, and on the product_info page. As well as some general cleaning up here and there.

There will also be a “grey” template before the end of February, again free of charge for buyers of the eBook.

Quality Templates for osCommerce 2.3.x for FREE ?

I have a good offer on at the moment whereby anyone who purchases the “Designing osCommerce 2.3.x” eBook on or before 31 January 2013 can choose a quality coded theme/template for FREE.

233-ebook

So, if you have been umming and aahing about buying my eBook, now is the ideal time to go ahead and spend a few $$. In the eBook I show how to build a theme from scratch and you need no experience in PHP or HTML or CSS (or anything technical). So long as you can copy and paste you’ll be fine.

The choice of templates are listed here – at the price I am charging for the eBook you’ll be able to choose 1 of these 3 templates at no extra cost!!

templates

After the 31st January, I will create one template per month and any buyers (of the eBook) during that month will get free if they so choose.

Of course, I have no problem with buyers waiting to choose a free template if they do not like any of the ones on offer. Note that choices cannot be backdated, so if you buy in February, you will not be able to choose from template created prior to February. So the sooner you purchase, the more choice you will have.

Enquire about WHAT product?

Here’s a little project I completed some time back but updated today. The essence of the project is to create a new osCommerce page that acts like the “contact_us” page but allows the person contacting to let the shopowner know precisely what he or she is interested in.

So, I made a copy of contact_us with some extra details (name, email, enquiry, location and then a chained selector system based on manufacturer, product and size). Think in terms of a shoe shop which sells a range of manufacturers and model of shoe.

What is a chained selector?

So, the person first selects the manufacturer, the second dropdown is then populated ONLY with the products from that manufacturer, the third dropdown is a size dropdown. Now the customer can fill out all the info and the shopowner can email them back to let them know where/how to purchase.

All pretty good and works well.

I then came up with the idea of showing the image of the product based on the inputs. So, when a person selects the info, an image of what they have chosen appears. Does that make sense?

Here’s a video in action;

Let me know what you think…

New Gallery style for osCommerce Product Page

One of my clients needed a way to present products in more of a gallery style, utilisinig a thumbnail and popup full size to fancybox. The usual way for showing a gallery (that is products with more than 1 image) is like this;

The thumbnails are auto created, and the user can rollover them to show the larger image (also auto created). The larger image can then be clicked on to get a full sized popup in fancybox. The thumbnails are not clickable.

The main problem here, that no one has been able to get around is to make the thumbnails clickable to bring up the fancybox.

Moving on…

So, the project was to enlarge the thumbnails so that they sit 4 in a row, and to entirely remove the larger image. Also make the thumbnails clickable to bring up the fancybox. A few lines of code later I had this working – now the product_info interface looks like this;

and these thumbnails are clickable to Fancybox (full size);

Project for today 13 June 2012

Todays project was pretty hardcore, as part of an overall larger project that is ongoing. Client sells a range of products that need to be treated in different ways (particularly for postage)…

In essence, the products are either “live” or “dry”. Think in terms of a product such as live Coral, or a dry product which could be fish food…hopefully that example makes it a bit clearer.

I needed to make a system so that the shopowner can attach a flag to each product to show whether they are live or dry. This was done in catgeries.php like so;

Live products = 1
Dry products = 0

I then added a small amount of code to the shopping_cart.php class file to count the number of live products. Any cart_contents with (live > 0) hold at least 1 live product. Any with (live = 0) hold all dry products.

So far, so good. Next, I needed to put a message in the shopping_cart.php main file, as so;

Dry products get a similar message;

As you can see, live (or mixed) orders are limited to UK shipping, so a tiny piece of code in each shipping module (basically the count of the “live” products) turns the module on and off appropriately.

The project for today turned out pretty good, I am pleased with it. It was slightly more complicated than I have made out in the blog post, as the client also needed live (or mixed) orders (remember, postage UK only) to only be sent by courier, whereas dry orders to be sent by Royal Mail (option of recorded delivery OR special delivery). Orders abroad can only be dry, so live or mixed orders (going abroad) get a message at the checkout_shipping.php page;

You can see how it is getting more complicated!