How to design a Magento Home Page

16 January 2011 Categories: General

A few months ago, I attempted to build a complex home page in a Magento shop installation. The page had to be an exact copy of a client’s site due to it having to maintain the design of their marketing material. By complex I mean a page with two types of Flash slider, a news area that updated dynamically from the backend and a Flash logo.

I must admit I was a little overawed by the prospect and started to try and work out how the page could be changed. The problem was that I was trying to reskin a theme which was already very complicated, or at least complicated to me at the time. I was put off. The way in which Magento is built was new to me and at that point, the interaction between html, php, xml and css was confusing.

I decided to start from the very beginning.

This is where I started:

A guide on how to create your own Magento theme.

I Went throught this tutorial and to be honest it was very useful. There are other documents attached that will help you to understand how the Magento filesystem is organised. This system can be confusing, especially for a beginner but it is actually rather clever. You are given a default theme and then told to create a new theme. You can put as much or as little as you require within your new theme, as Magento will check in your new theme folder for updates and if nothing is present, it will revert to the default (the default is created at the point of installation).

This was well and good but the theme I was left with had no styling at all (this would be ideal for some people) so I had to look for something else.

Whilst learning Magento I have browsed these three publications.

The Magento User Guide

Magento Beginner’s Guide

Definitive Guide to Magento

The first two guides are certainly worth looking at and enabled me to construct simple Magento sites using pre-made themes and a variety of product types etc. The last guide was the solution to my custom design problems.

The Definitive Guide to Magento recommmends that a designer should use the ‘Blank Theme’, a theme which is downloadable from Magento Commerce. This theme was the helpup I needed.. The theme is simpler than a full pre-made theme and is not really styled at all, giving the user a blank canvas.

I am now making impressive (in terms of my previous progress) strides and will hopefully soon be able to provide you with a link to a custom Magento site that I have designed and built myself.

Read the full article 0 Comments

Long time no see :(

23 October 2010 Categories: General

What a couple of months!

I have been so busy that the blog has been left alone for almost two months. I have moved to Portsmouth and now live with my girlfriend in a small gatehouse with  a balcony and a mezzanine floor. Very strange but surprisingly homely.

This blog is something I write at home. I am not sure how happy my boss would be with me writing this whilst at work. It has taken a month for my provider to enable my broadband, so that is the reason for the gap in writing. Hopefully normal service will resume ;) .

The last month has see me start my first solo Magento build. The client is Solent Yamaha, who sell outboard engines for boats and yachts. They have asked me to upgrade their current installation from 1.1 to 1.4. Initially I thought, how hard can this be, surely you just press the upgrade button and away it goes but the reality is that this process has many pitfalls to which the uninformed may fall foul. I have look at many processes for completing this task but the most efficient and risk free goes something like this.

  • Install the latest version of Magento
  • Backup the media file, products and  customers from the original installation.
  • Research the compatibility of extensions existing in the original installation to the new installation.
  • Install these extensions.
  • Install the template.
  • Upload the CSV.
  • Upload the customers.
  • Remove all mention of the demo store and try as best as you can to mimic the settings of the original installation.
  • Et Voila!

I am currently in the process of adding the products csv. It seems to me that each client will have some part of their product list which adds a layer of complexity. For Yamaha it is the presence of an extra set of attributes which must be shown on the front end in a tabbed view. The trials and tribulations of a Magento Designer ;) !! The way of solving this issue is to add the attributes to the new installation and download this csv. Then add the products from the initial csv to the new version. This takes time but is necessary.

As things progress, I will let you know about other issues I am having (hopefully there will be none).

Read the full article 1 Comment

Multiple Stores, One Magento

06 September 2010 Categories: General

We are reaching the finishing stages of a trade site for Concept International. They specialise in making amazing picnic products like this. The construction of this site has been my first full development of Magento. Previously, I have worked on adding products and modules but this project has demanded the full process. The site is a trade store and has needed various modifications, such as, only being able to see prices when logged in and that you are only ble to login once your account has been varified by the administrator.

Concept have asked us to build on this site by adding a retail store. This is where Magento really come into it’s own. You are able to have multiple store fronts/domains rooted tro one installation of Magento.

So for example, lets say you had a store selloing teddies and one selling sweets. Y0u purchase ilovesweet.com and teddytime.co.uk for this purpose. You then turn off sharing to stop unique data being accesible between both sites. You can then select specific languages, payment methods and categories for either of both sites.

The above image is an example of how the sites may be organised. Continuing my example, this could mean that you split ilovesweet.com into two areas, one for sugar free and one for sweets containing sugar. The possibilities are endless. With a number of Magento sites on the horizon, it seems my skills with this site are going to get tested. I will report back with how things are going.

Read the full article 0 Comments

Sources of Inspiration

28 July 2010 Categories: General

Sources of Inspiration

Often, when making a website, it is best to use design influences that exist all around you rather than trying to re-invent the wheel. Over the last year, I have been introduced to many fantastic resources which will help you do just that.

You can also use these resources to see what designers are making now. Letting you know what up-to-date techniques to use and ensuring you are not left behind. I feel that sometimes, the comments that respond to the articles are just as important as the articles themselves, as they may point out shortfalls and mistakes in the article and save you lots of time.

My out and out favourites have t0 be:

tutsplus.com – They have number of sites specialising in web design and development. I especially like PSDTUTS and NETTUTS

csszengarden.com – To see just what can be done with design skill and CSS knowledge, check this out.

smashingmagazine.com – They are focused on design and web-development. Choosing to deliver useful information on the latest trends etc.

It is very important to not just stick to the same resources all of the time. Try finding the latest lists that other designers have put together, detailing their favourite content. A quick search of “most beautiful websites” resulted in finding this

sitesketch101.com/beautiful-websites

My old tutor once told me, “if it is in nature, it will go”. I think you can see that from the image above.

Read the full article 0 Comments

And so it starts!

20 June 2010 Categories: General

And so it starts!

After studying for one year into a variety of web medias, it seems an ideal opportunity to start this blog.

Initially I taught myself HTML, CSS and the basics of design, PHP and Javascript. I then began volunteering for the Hampshire & Isle of Wight Wildlife Trust

They use the Beekeeper CMS system and provide a huge amount of services from education and conservation through to running an online shop. My role was to create pages using the CMS , add upcoming events and important information , as well as administering the online shop.

More recently I have begun contracting for Boxchilli Media. They specialise in Web Design, E-Commerce and marketing. Here I have taken on a full designer’s role and have learnt to use the Joomla content management system. We are able to design, create and host all manner of websites.

My aim over the coming years, is to grow this blog to chart my progress and to hopefully point out pitfalls and areas that are worth focussing on to anyone wishing to follow a similar path.

Read the full article 1 Comment