Frontend

Create a Color Switcher in Magento

Magento comes packed with a lot of options. But, no matter how many options you put into some product, you can never cover all of them. One of such options (for now) is a color switcher in Magento. To be more precise, an image switcher based on color selection.

The idea is to have a dropdown box from which you choose a color, and, based on the color you selected, product image changes. This should be based on some simple JavaScript (in my case, jQuery).

Read more

Add a New Reference in Magento

If you already performed some Magento research, you will know that it is built on a fully modular model that gives great scalability and flexibility for your store. While creating a theme, you are provided with many content blocks that you can place in structural blocks. If you are not sure what they are, please read Designer’s Guide to Magento first. Magento provides few structural blocks by default and many content blocks. This article tells what needs to be in place to create new structural block.

Read more

Changing default category sort order in Magento

Category toolbar has many options. By default it shows how many items are in the category, you can choose how many products you wish to be displayed per page, you can change the listing type (List or Grid) and you may choose Sort Order. This “Sort Order” can be confusing. The default “Sort Order” is “Best Value”. What does it mean? How is the Best value determined? Can we change the default sort order?

Read more

Magento form field AJAX validation

In this short article I will show you a quick way of adding an AJAX-ed validation on Magento form field. If you open up the {MAGENTO_ROOT}/js/prototype/validation.js file and look into its header comments you will see that Magento’s JavaScript validation is actually done trough 3rd party JavaScript library called Really Easy Field Validation by an author named Andrew Tetlaw, with its own GIT repository available here.

Read more

Hunting GPS Maps – Revamped

Hunting GPS Maps offers individuals hunting maps uniquely different from any other products out there. What makes Hunting GPS Maps products unique is the fact that Hunting GPS Maps has taken the time needed to find the best data from the most reliable sources (often as many as 15 sources are used per map); focusing mainly on providing accurate land ownership information (public as well as private).

Read more

Prevent PO Boxes in shipping address field on Checkout

© jechasteen@sxc.hu

We recently integrated a feature that would prevent users from creating an order with a PO Box in Australia. Since we are already familiar with Australia Post shipping integration (and heavy modifications of it, I might add :)), the first thing that came to mind is to have a look if there’s some API or web interface that can be used to filter out post codes that are linked to PO Boxes. Many high volume addresses and/or PO Boxes in Australia have their own post code, so it looked like an obvious solution. It turns out that it’s not that simple or logical, since there are many edge cases where you can not reliably tell if you should filter the code out or not. There is a guide made by Fontis that shows how to validate the input fields in order to filter out PO Boxes. However, in our case we had some dynamic content loading with Temando shipping method integrated. This guide is intended as a more general solution that is compatible with Checkout page’s dynamic content and third party Shipping methods integration like Temando.

Read more

Adding product image lightbox effect using jQuery plugin (a better way)

This is not a copy-paste kind of tutorial. It is made for beginners so please try to understand what is going on before you start copying the code. If you are an experienced developer you can skip to the end and inspect the final code.

Nowadays every client wants some kind of lightbox effect for product images on the product page. Although there are a lot of ways to do it, I often stumble upon Magento stores that have a buggy and sometimes useless implementation of this feature. In my opinion, it should be simple, fast, easy to use and above all intuitive.

Read more

Extension license for local project. Yes, no?

If you’re working for a client for a while there is a high probability that you got request to implement some commercial extension. Or perhaps you’re store owner and you bought specific extension but you now want to test it firstly locally, before you deploy it on your live site.

In this short post I’ll give you an idea of what you can do to “make it work” locally in case when you have valid license for the extension and extension doesn’t work on your local project. If you’re interested on what you can do in situation like this one, keep reading.

Read more

Track validation errors on Magento forms using Google Analytics

A couple of weeks ago one of my colleagues from Inchoo wrote a very nice article about Tracking Onepage Checkout abandonment using Google Analytics. We will go a bit further now and expand the set of data that we are tracking in order to try to pinpoint the exact cause of checkout abandonment, if possible. You will also see that this code is re-usable on any form in frontend, which is something that I’m sure you will find a use for.

Read more

How to hide shipping method on Magento frontend but leave it on in admin area

For some of you, this might come as a surprise, but Magento does not support “disabling” the shipping method on frontend but leaving it on in admin area. OK, thats not 100% correct since you can do some sort of a “tweak config” that would enable this effect. The thing is that although Magento supports “global/website/store” configs, shipping methods are turned on/off on a global and website level. On store level you can simply edit the title of a shipping method plus few other things, but usually you cannot enable/disable shipping method on a store level.

Read more

Enhance Magento 404 page

Magento default installation already has a predefined custom 404 page (no-route). But is it enough to help visitor/customer get back on right track!?. Let’s look over a few examples of custom designed 404 pages. http://centar-alata.hr/404, https://github.com/404, http://www.bluedaniel.com/404, http://www.casino-lemonade.com/404/ – as you can see, it can be funny, creative or you can take advantage of this “case” and try to engage potential customer. Here are a few quick and dirty ideas on how to reuse custom 404 page in Magento and try to serve specific content on it.

Read more

Inchoo Flickr Gallery Magento Extension

© By Wholtone (Own work) [CC-BY-3.0], via Wikimedia Commons

Inchoo Flick Gallery is an easy-to-use Magento extension that will integrate any Flickr gallery into your Magento website. It is fully customizable using a simple Magento back-end configuration page and it uses Flickr API to get all the required information and data. Extension is tested on Magento 1.6 and 1.7 but it’s still the first version so be careful if you decide to use it on your live site.

Read more