For beginners, Magento front-end customization can be a difficult task. And the level of difficulty bases on the design complexity or the need for customizing and moving the pre-built objects within or between the templates. In this post, we will cover 5 lessons of the sections that involving Magento front-end development.
- Download the latest version of Magento community edition
- Open up the tar or zip file and extract in your web server and assume that you have an Apache web server installed
- Go to your phpMyAdmin and create a new database, assuming you have MySQL installed
- Open up the directory URL that you just created in your web browser and extract your Magento files in it, and it should run installation process
- Go through the installation process, except when it tasks for the Database type, choose database, not file system
Setting up package and theme
- Go to your Magento folder and app/design/frontend/. Create a new folder and then name for it. It will be your package name
- Create another new folder in the folder you’ve just created and then name for it. It will be the theme folder and contain all the templates you customize
- Back to the root of your Magento folder and then go inside the skin/frontend and create the same folder structure as above
- Log in to your admin section, which should be your local URL/admin or simply add/admin to the end of your Magento URL in the browser
- Go to System→ Configuration→ Design and then enter the package and theme name into the appropriate fields and then tap Save Config
- Go to your root folder of Magento and then go to the app/design/frontend/base/default/template and copy the page folder and paste it into your theme folder. In this case, it is app/design/frontend/your package folder/your theme folder
- Refresh the home page and you should see your change. If you want to make changes in header, you need to open up the page/html/header.phtml or if you want to customize product page or checkout, follow the same way you copied the folder and files from default/template and then paste it into your-theme/template and customize it as per your needs
- Go to the app/design/frontend/your package folder/your theme folder and then create a folder for layout. All the XML files will be stored by this folder, therefore, the final URL will be app/design/frontend/your package folder/your theme folder/layout
- Copy the xml from app/design/frontend/base/default/layout and then paste it in the layout folder that you just created in your theme folder
- Open up the xml and type <remove name=”right.poll” />. This will remove the whole poll block
- Refresh your home page
- Go to the root folder of your Magento folder and from there, go to the skin/frontend/default/default/ and then copy all folders and files to skin/frontend/the package folder/ the theme folder, which you created when setting up package and theme
- Open css and change CSS
That’s all 5 simple steps we advise you learn to master Magento templates. We think that all Magento users need to hold these tutorials for multiple benefits.
Thanks for reading!
>>>>> View more Magento tutorials