Snappy begin to Magento front-end advancement
Magento front-end customization can be a troublesome undertaking for fledglings. The level of trouble can be measured by outline multifaceted nature or the requirement for altering and moving the pre-assembled protests inside or between the formats. In this arrangement, we will be dig into 5 lessons that will cover the greater part of the areas that including Magento front-end advancement.
[series_block]
This post is a piece of an arrangement on acing Magento layouts:
- Mastering Magento’s layouts in five simple advances [part 1] (current)
- Mastering Magento’s formats in five simple advances [part 2]
[/series_block]
Kindly note that the course expects you to have an essential comprehension of web advances like HTML, CSS, PHP, layouts, and XML.
Magento installation
Description: Setting up Magento
Steps:
- Go to http://www.magentocommerce.com/download and download the latest entry of the Community arrival of Magento.
- Once you have downloaded Magento Community, open up the pack or tar record and move it in your web server, tolerating you have an Apache web server presented.
- Go to your phpMyAdmin and make another database, tolerating you have MySQL presented.
- Now open up the registry URL that you simply made in your web program and focus your Magento reports in it, and it should run foundation process.
- Go through the foundation strategy, except for when it asks for the Database sort, pick database, not record system.
- You’ve as of late successfully presented Magento!
Setting up package and subject
Description: Creating our custom Package and Theme to avoid superseding our customization by the Magento invigorate.
Steps:
1. Go to your Magento coordinator and application/design/frontend/. Make another envelope there by any name, which will be your package name.
For example: app/design/frontend/your-package
2. Go inside the envelope you just made and make another organizer. Name your envelope, which will be your subject organizer. Every one of the layouts we redo will live here. For instance: application/outline/frontend/your-bundle/your-subject
3. Now backpedal to the foundation of your Magento organizer and after that go inside the skin/frontend and make a similar envelope structure as above.
For instance: skin/frontend/your-bundle/your-topic
4. Once the envelope structure is made, sign in to your administrator area, which ought to be your nearby URL/administrator or just add/administrator to the finish of your Magento URL in the program.
5. Once you are signed in, search for “Framework” in the best menu, mouse over and tap on “Design” situated on the base of the menu. Presently click “Plan” from the left menu and it shoul open the page beneath.
Sort your bundle and topic name into the fitting fields and snap “Spare Config” on the upper right.
Our bundle and topic structure is presently setup and we are prepared to begin tweaking the subjects!
3: Theme customization
Description: Editing the format records
Steps:
- Go to your root organizer of Magento and after that go to the application/outline/frontend/base/default/format and duplicate the page envelope and glue it into your subject organizer. For my situation, it’s application/plan/frontend/your-bundle/your-subject . Presently you should see numerous .phtml documents which are essentially layout records that open up the 2-segments right.phtml.Refresh the landing page and you should see your progressions. Keep in mind, page envelope contains format layouts which mean any change you make will apply to all pages to which this layout is assigned.In case you need to roll out improvements in the header, open up the page/html/header.phtml or in the event that you need to tweak item page or checkout, take after a similar way you duplicated the organizer and documents from default/layout : glue it into your-topic/layout and modify it according to your necessities.
2. Now you know how to tweak layouts!