PSD to Magento

PSD to magento or HTML to magento is really very demanding for every e-commerce(Magento) Developer i tried the same string “PSD to magento” in google and find all the bullshit tutorials so after little digging i am going to write my very own version of “PSD to magento” Tutorial

Step1:

The first and very basic thing is what you gonna create ? means which kind of magento store and the psd look and theme so first take a deep look on the PSD and compare it with the standard Magento Template (Default Magento Templates)

PSD to Magento

STEP2

The most important thing when you are doing any conversion either “PSD to Magento” or “Html to magento” isnavigation’s or menu means in the Magento PSD it is vertical menu or horizontal menu . Have a look below at Horizontal menu

PSD to Magento

,You’ll find mostly horizontal menu based template so if your magento PSD is horizontal menu PSD then Conversion from “PSD to Magento” is child play

STEP3
The real magento Magic is its template path Hints , These hints will show the HTML part of the magento with complete path . Have a look Below

PSD to Magento - Path Hints

, all the read lines are template path hints with complete path just go that path and edit your template as per your ease . This will be a .phtml file , as per the magento convention .Suppose that if you want to change something in header of that template follow this path as per the template path hintsfrontend\base\default\template\page/html/header.phtml

Further Read : http://vipinsahu.com/magento-psd-to-magento/