Magento multi-tab image display on product page with Admin support

Our magento store needs to have an additional feature built for front-end and back-end.

On the back-end, each of our products are tagged as being in Phase 1, 2, or 3, which is a simple attribute we created. It is one product, but goes through 3 phases.

Each phase will have its own set of pictures, so first thing is:


Need to modify the Product images section of Magento Admin page. All images need to be able to be distinguished by Phases. Phase 1, 2, or 3. Then, each image needs to be able to be sorted within its Phase. For example, images for Phase 1 can be sorted as 1, 2, 3, etc. Phase 2 images can be sorted 1, 2, 3, etc.


On the magento product page, need to create a 3 tab block for the images to display. See attached pdf -- it's the green section that we're talking about. The Phases, Image and Thumbs.

I already have a zoom extension that I like that is installed, so can use that for the zoom and thumbnails. When the main image is moused over, a zoom box of the image appears above the right content. When a thumbnail is moused over, the main image is changed to the one moused over. IMPORTANT: All of this is already built-in to the extension that I have.

But, need to modify the code slightly so that when the Phase 1 tab is open, the only images that show are the Phase 1 images. Phase 2 tab would only have Phase 2 images.

The Phase buttons at the top (PHASE 1, PHASE 2, PHASE 3) should have background images that I will create. The Phase that is active will have a different background image to show it is active. The Phase that the product is currently on will also have a different image. For example, if a product is in Phase 3, the Phase 3 button will look different than the others, even if it is not active. So buttons will have the following states:

for each phase (meaning 3x each)

- current phase button active

- current phase button inactive

- non-current phase button active

- non-current phase button inactive

When a non-active Phase button is moused over, the non-active phase tab will be displayed, meaning the tabs are opened from just mouseover of the tab in the top (like Phase 1).

When the product page first loads, it will run through an auto-sequence very very quickly -- showing each Phase starting with Phase 1 until the active Phase is reached at which point it stops. For example, if the Product is in Phase 2, then when the product opens, it will first show Phase 1 as active for a very very brief moment (maybe less than a second, but can adjust time if needed) then Phase 2 and stays on Phase 2 as active. If Phase 3, then it shows Phase 1, then Phase 2, then settles on Phase 3.

Skills: AJAX, jQuery / Prototype, Magento, PHP, Software Architecture

See more: magento admin show image, magento product image, it admin support, simple product images, multi store, multi product, Magento Multi Store, image to pdf, front page image, create magento product, create a multi, back end support, all admin support, magento create admin, image show admin magento, show image thumbnail php, tab display php, magento show product image, image thumbs, product image magento showing, zoom thumbnails, thumbs image, magento image product showing thumbnail, front page background, front display products

About the Employer:
( 3 reviews ) Belmont, United States

Project ID: #4860089

3 freelancers are bidding on average $8045 for this job


Please check your site.

$1546 USD in 15 days
(84 Reviews)

Let's start

$368 USD in 7 days
(5 Reviews)

Dear Sir/Madam, I am interested in mention project, so please check my pm. Thanks and regards, Joel

$22222 USD in 30 days
(0 Reviews)