Popup – Processing Your Order…

Have you (or rather have your customers) ever noticed a delay when hitting the “do it” button on checkout_confirmation.php ? I have to say that I have never noticed it, but I don’t often buy from osCommerce shops and every test order I make is on my dev server where everything is blazing fast.

One of my long-standing clients sent me this;

…come across a small issue when I hit confirm order on the checkout confirmation page. When I hit the button the button goes a different shade, so it can’t be pressed again which is what should happen, but nothing else happens for a good 3 – 4 seconds. No spooling on the tab bar or anywhere else. It make it look like the page has frozen then the page starts to spool and another few seconds the checkout_confirmation page loads.

I had a bit of think about it, and found some code that creates a popup like this;

I plugged this into a HT module, so it is a super simple installation…just upload, turn on and configure appropriately (text message, colour of graphic bar etc). DONE! NO CODE CHANGES!

Want It?

Donate £5 over here. Please ensure that you mention “popup order” on the paypal note, and remember that your donation can be made anonymous…I look forward to getting this to you as my client rightly says;

…very nice and very good for UX especially after having customers put in their card details. Not a time you want to be putting doubt in their minds…

As a developer rather than a shopowner…I would never have thought about something like this. Yet something so very simple can add a pleasing experience to the Customer.

Easy Slider for Index Page

I’ve coded up a new Slider system for the Front Page of any Responsive osCommerce. This Slider system takes as many “items” as you add, and sets them out as a multi-carousel, so let us imagine you have 8 items, and you select that each item takes 25% width (3 columns), it will show the first 4, along with prev/next buttons…to show the next 4, and so on.

On the Shop Side – WITH NO CORE CHANGES!

On the Admin Side – all WITH NO CORE CHANGES!


you get a new link in the Tools Box


a new admin page for adding/editing/deleting slider items


a new module which creates the output on the shop side

Conclusion

A really nice system for (eg) linking to special areas of your osCommerce site or linking to other places on the net. All done via Simple Upload, turn on, insert items…done! NO CODE CHANGES AT ALL!!

Want it?

Make a donation of just £5 or more at this link – donations can be anonymous and are done via Paypal. By making a donation, you are helping to support the future of the Responsive osCommerce project. Within 24 hours of your donation, I’ll get the zip to you. Please place a note on the donation stating “slider system”.

Important Note

This system is available only for the Community Responsive osCommerce.

Responsive Template “Jesse” for osCommerce – Bootstrap…

Here is the very latest template for the Responsive osCommerce:

jesse-large

As you can see, the layout has just the main column. The sideboxes are not useful anymore, as everything needed can now be found in the header and footer.

The template comes in a very easy to install format. Simply upload a few new modules and turn them on, with NO core code changes. It as simple as going into your shop admin and clicking a few buttons.

The only file that is changed is the “new products for month” module on the index page – this has a slightly different layout to the standard responsive layout – of course, this is an option that you might choose not to install.

The base colour scheme comes as standard in 2 shades of green, along with two shades of grey. These colours are incredibly easy to change, just find a colour you like and change the user.css file to match.

It also comes with carousel module which is linked to the Banner Manager in admin – again making it incredibly easy to set up sliding banners.

Demo

Want to see the Demo? Have a play with the site, maybe open it in both your normal computer and your mobile phone or tablet. This will give you a flavour of how responsive the template is.

To use this template, you need to be using the Responsive osCommerce, the standard osCommerce will not do.

How to buy?

Get yourself over to my template site and click the Buy Button.

osCommerce Bootstrap Template “AMY” now available

Pleased to say that I found time to update my “Amy” template to make it Bootstrap Enabled. Here’s a screenshot;

AMY_BS

As you can see the template changes “shape” to accomodate different viewing devices. This template changes very minimal core files (about 5 only)! Link to Demo: http://www.template.me.uk/amy_bs/

Let me know if you’re interested in purchasing, as I’ll have a special price for the first few buyers.

Responsive osCommerce now a reality, using Bootstrap

For the last couple of months a small team of coders has been working on updating the shop side of osCommerce to be responsive…

What is responsive?

Responsive Web Design (RWD) is a Web design approach aimed at crafting sites to provide an optimal viewing experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from mobile phones to desktop computer monitors).

In easy to understand terms, the site changes “shape” if you visit in a mobile phone compared to an iPad compared to a desktop computer.

With that in mind, we had a lot of recoding to do, we pretty much pulled apart the cosmetic look of normal osCommerce and updated it to Responsive osCommerce. Have a look at the responsive version and see how it changes shape depending upon which device you are viewing it in…

Going so in-depth into the code, I also took the opportunity to update a few areas to make them more modern;

The Footer area (which is now modular and controlled from the Admin)

footer

The Reviews (which has a top-down bottom-up overhaul)

reviews

The Header area (modularisation mostly implemented)

header

Other bits and pieces new to this version;

  1. New Category Tree Class
  2. Updated checkout experience
  3. New Card Icons
  4. New Infoboxes (contact us, generic text, customer services)
  5. Grid / List switching in category display
  6. and too much more to list…

Speed

Another important factor in todays online experience is the speed at which your page displays to your customers. We put together this version to be as fast as we could make it. Using “Gt Metrix” to test our changes we saw a great result:

97

Go ahead and try your own osCommerce site and compare your results…you’ll be shocked at the difference.

Changing the look of the site

Pretty much how osCommerce has always been as we did not yet have the time to build in a template system. With just a few changes to around 4 core files I built this:

LARGE
large view

SMALL
small view

Conclusion

I’m really pleased with how this project turned out. Shopowners now have a choice to use the normal 2.3 series osCommerce or to use the new Bootstrapped 2.3. It is possible to upgrade an existing osCommerce shop from normal to Bootstrap, and this Bootstrap version has a massive advantage in that all of the existing addons are useable with it.

So, have a look at the test site. Feel free to fork the codebase or to download the master zip. Install as you would any osCommerce, then go into Admin and turn on the relevant boxes that you would like to show and relevant Header Tags.

Enjoy.