Introduction to Magento
Current magento version – 22.214.171.124
This is a very brief introduction to Magento, a powerful php based open-source e-commerce platform.
I am currently working on my first ever Magento project, and given the flexibilty and complexity of Magento and it’s code base, it seems a good idea to write a series of Magento hints and tips so that the next time that I come to use it I’ll be able to spend less time searching out the solutions to little niggly problems or requirements.
As an e-commerce solution, Magento is extremely powerful and flexible and may well be the answer for many peoples e-commerce needs. However because of this power and flexibility the code base is extremely large and the processing can be a little on the slow side, so if all your looking for is a really small and basic shop then this might prove to be overkill.
Overall though, now that I’ve almost got my head round the basics, I really like Magento as a tool and it can be fairly straightforward to work with if you know what you’re doing. If you’re not sure what you’re doing or you’re trying something a bit new then it can prove to be very frustrating and mentally draining, as the documentation isn’t always great and the forums can prove frustrating. But if you keep at it and in turn share what you’ve learned yourself then you’ll find yourself with a site that does exactly what you want, while at the same time improving the amount of information out there and possibly giving a lifeline to other magento users. If you learn something, share it! It might help someone who could provide you with invaluable help later on!
First Steps (note I’m running this on windows):
If you want to you can download the sample data from the Magento site. This might be useful as you can then use it when you install Magento itself and it will set up a populated demo store with products and categories etc, rather than just the straight blank demo store you’d otherwise get. This can help you understand how to set up an actual store and provides examples of things you can do.
To install Magento, download the latest community edition installer and un-zip the folder into the document root of your site. If you don’t want the site to be installed into a magento folder (it is by default) then move all the files in the magento folder out into your document root and delete the magento folder. This will stop /magento/ showing up in your url from the start. If you don’t set it up like this to start with but then decide you want to change later on then it is possible but can be really tricky and is almost asking for something to go wrong. (I did this, and I will post later how I did it but to be honest I really wouldn’t recommend it).
If you then visit your new site url (go into the magento folder if you’ve not removed it), then you’ll be taken through the installation process by the magento installer, which is pretty straightforward to follow so I won’t go through that here.
You’ll then end up with the basic magento demo store.
Creating your own theme
Update: this is based on version 126.96.36.199. The new 1.4 version uses a very different structure which I shall hopefully post about soon.
Most likely you’ll want to create your own Magento theme so that you can style up your store in the way that you want. To do this it’s best to copy the default theme folders and create your own, so that you’ll have the original there if you want and to prevent your theme potentially being messed with should you upgrade Magento.
Update: you should be able to just copy over only the files that you need to modify. For other files magento should try to find them in the default folders. If this doesn’t work though then you’ll probably need to copy over all the files.
app/design/frontend/default/default -> app/design/frontend/default/my_theme
skin/frontend/default/default -> skin/frontend/default/my_theme
I’ve called my new theme my_theme (I’m original like that).
Now log into your magento admin area (doc root/admin) and go to system->configuration->design->themes. In the default box, type in the name of your new theme and press ‘Save Config’.
Introduction to Magento files
Now that you’ve set up your custom theme, you need to know how to change the layouts and styles. The first thing that I recommend you do is in the admin area, go to system->cache management, and untick all the boxes. This should turn off Magento’s inbuilt caching. However if you are having a problem and not seeing a change you were expecting, it is always advisable to enter the cache management, select refresh and save, just to make sure that caching isn’t an issue.
The other main folders that you will be using are app/design/frontend/default/my_theme/template and app/design/frontend/default/my_theme/layout. The template folder holds all the phtml template files which control the layout of the various pages and blocks with the pages. The layout folder holds all the xml files that control the layout/content of the page and determine which blocks should go where on which page. It will probably take a little while for this file setup to start to make sense, and the best way to learn is just to get stuck in and start trying to customise your own site.
As a quick intro though, app/design/frontend/default/my_theme/layout/page.xml controls the basic content of every page, and the app/design/frontend/default/my_theme/template/page folder holds the phtml files for different page templates (1 column, 2 columns with a right sidebar, 3 columns etc). Having a look at these should give you a good idea of how Magento works.
If you want to see how a page on your site is constructed, go into system->configuration->developer->debug (select your store view from the configuration dropdown, top left). Enable ‘template path hints’ and ‘add block names to hints’ and save. Refresh your page and you should now see the different page block outlined in red, with red boxes telling you which xml block it is and which template file is being used. This can be very useful when you’re trying to work out which file you need to change, but it does mess with the page styling so I find that I’m constantly turning it on and off.
So that’s it
That was my very basic introduction to Magento, which may or may not have been all that helpful but if it’s helped point one person in the right direction then my job is done. I’ll be posting more about Magento soon, about specific problems that I’ve had and solutions that I’ve found which I hope will also be useful, so watch this space.
Good luck with your own Magento projects!
Edit: it is also possible to download blank themes from magento connect that you can then use to create your own theme. This means that you won’t have all the images/css from the defualt theme hanging around and getting in the way.