Information Pop Up – Cool Feature

I’ve been trying to make the front page of osCommerce a little less intimidating – it’s my opinion that a typical osCommerce store is too “busy”. What I wanted to do was find a way to have less information in the page, in other words make the page more bare.

A good way to do this is to remove some text! Well, that’s easy to do – just amend the welcome greeting etc. Then you can cut down on the number of infoboxes and maybe even remove a column (or both columns)…

It’s Web2.0 baby!

I wanted to go a step further so went on the hunt for a feature that I had seen – “information pop up bubbles”. Here’s what I came up with, which is full integrated into the “New Products for Month” box in the front page of osCommerce.

The actual look is much smoother than you see in the video – basically, the “name” and “price” and “view product” link are contained within the popup. I think it adds a lot of style to a store! What do you think?

What else could this be used for?

Well, it would be ultra simple (assuming you had a small/large image modification installed) to show the larger image in the pop-up. Or it could be used for the “Welcome Guest” greeting or anywhere else – maybe the “Your Previous Orders” box. The possibilities are endless.

9 thoughts on “Information Pop Up – Cool Feature”

Gary Post authorApril 23, 2008

And here it is with a large image.

http://www.youtube.com/watch?v=toe_RbparKE

This is actually using my own “easy thumbnail” modification to give two sizes of image and then the “bubble” code pulls in the large image to display. Sweet!

Torki April 23, 2008

Really cool!

Gary Post authorApril 23, 2008

Kinda not so good as it’s done with javascript. Any ideas on the % of people who browse with JS off?

restless one April 24, 2008

Gary, I’m also one of those whose javascript is turned off (using the excellent NoScript add-on for Firefox).
Well, as this problem will only happen to “non-beginners” I think you should not worry too much about that as long as a click on the picture lead to the product_info page.

In my shop I added this little code in header.php:

So to customers with JS off a small div is presented at the top of the header saying “Please turn on javascript”, while they are still able to surf the shop – no matter if they turn it on or not.

Gary Post authorApril 24, 2008

Restless One – I think that you are right. Now that all sorts of websites like Yahoo, Google etc are relying more and more on JavaScript, I think that a large number of people DO have JS turned on…

Did you try to post some code? For some reason, WordPress stripped it out. If you’d like to send it to me by email (oschsops AT gmail DOT com) I can add it in your message…

Cheers, Gary