Magento Web Development

How To Make the Best Ecommerce Website Design For Magento?

Rushik Shah User Icon By: Rushik Shah

Magento can be used to make your shopping cart online since it is an E-Commerce Platforms software. However, it is more often than not that the client requires customizing the basic theme and changing it to something very different and something that he desires. The procedure required to do so needs some designing and programming skills and thus may require professional help.

Magento is an eCommerce online Stores that can be used to make your shopping cart. It is common to wish to have your own design for a Magento shopping cart website. The process of making a new Magento Website Design for good Customer Experience though simple may require some graphics as well as programming knowledge and hence if you are totally new to this it is best left to the capable hands of the Indian web developers. Ecommerce Platform used for online business there are multiple Payment Gateway and you can also track your conversion rate.

A website design for Magento consists of several different sections. This can be mainly broken down into two sections the design and the skin. The basic directory structure of the Magento design is as below considering the new theme that we are about to make is called theme5.

1. Base – contains the theme files 2. Default – contains the default theme (basic theme) 3. Theme5 – contains the theme by the name theme5.

Here we will assume that we have set Magento to use the theme by the name Theme5. Thus if we were to try to load the website in the browser Magento would first attempt to load the file package/theme/catalog/product/view.phtml under the theme5 directory. When it doesn’t find the file it will check the default theme in the same directory, theme 5 again when not found it will revert back to the default theme in the default directory. And if for some reason that is not found too then and then only will Magento throw an error message. The files Magento tries to access are listed below and it has many Built-In Features or Additional Feature:

For the sake of simplicity, we shall allow Magento to load the default theme files from the base/default directory and not copy a copy of the basic theme to the theme5/default directory. Although it is possible to do so it is beyond the scope of this article.

How To Make the Best Ecommerce Website Design For Magento?

A similar kind of theory applies to the skin folders. It too falls back on the base/default directory. The templates may have a similar theme however the style sheet and Java Scripts files of the theme are usually different.

To make matters even simpler we shall have a look at the proposed directory structure considering the name of the theme is theme 5.

Once the folders for the new theme are created you need to copy over the contents from skin/frontend/default/default to skin/frontend/theme5/theme5-theme.

Once again we need to make sure that this custom theme of ours is enabled. This custom theme can be enabled by going to the admin panel menu System Configuration Design and selecting the new theme.

Now, fire up your favorite FTP program and make the following directories:

Now add the following code to the view.phtml file to prove it is working:

If it works this means the new theme we created is working. We can now customize the theme further to suit our needs. To start with we need to copy the contents of the file base/default/catalog/product/view.phtml to our file above, overwriting the existing content. We can now modify this basic template to suit our needs.

As you may have now guessed it is possible to create a new theme in a jiffy by simply change this basic theme that we have and adding a custom Style sheet and JavaScript (making new CSS and JS). This new theme of our can be based on an HTML design provided by a designer or on the other hand can be made directly by editing the file. It is a good idea to first make the design in HTML and then integrate it into the structure above to have a new theme ready to use. Most of customers comes from mobile platform.

Feel free to contact our Magento Web Developers Why Choose Alakmalak As a Your Growth Partner?

Alakmalak is a web development company in India that offers services for several technologies. There have been around for a very long time and have developed over 2500 projects for clients all around the world.

They have highly skilled web developers with a great deal of experience.

  • How to Make Magento E-Commerce Website?
  • Top Magento Ecommerce Website Designs

What’s Next ?

I know after reading such an interesting article you will be waiting for more. Here are the best opportunities waiting for you.

Share via
Copy link
Powered by Social Snap