Designing a Responsive Magento Website for $99

Build Your Own, Fully Responsive Magento Website for just $99

Magento-Responsive-Website-Design-Video-Course We’ll show you how you can build a Mobile Responsive Magento website on a budget of just $99, and most importantly zero “coding” knowledge is required.

Hundreds of people have already followed this course and saved untold amounts of money, not to mention the feel-good factor of building a their own Responsive Magento site from scratch following these step-by-step video tutorials.

Course Introduction Video

Press play on the video below to find out what’s included in this course and scroll down this page to see ALL of the step-by-step video tutorials that are included.

Save Thousands

It’s not uncommon to see Magento website quotes in the thousands or tens of thousands for bespoke designs and we know it doesn’t have to be that way.

We believe that it’s better to spend much less on the actual website build ( $99 to be precise ) and much, much more on the marketing to get people to your store and to become your customers. After all, the marketing side and sales is where you will make money for you and your business.

This way you’re not thousands in-the-hole before you even start with no customers.

Mobile Responsive Design

You can have a feature rich, fully mobile responsive Magento website on a shoestring budget, but not skimping on features that you want or need ( or splash out on extensions and not feel guilty ).

In this course we will guide you through step-by-step the different stages that you need to follow and how to build your very own responsive Magento website from nothing.

Want to See What’s Possible?

See the image gallery over to the right, you have complete control of your website.

These sites are built using the Ultimo Magento Responsive theme that costs just $99.

Example Features Gallery

Oh and one more thing… Nerds

Watch any tutorial on the Internet and it’s a matter of minutes before they flop-out a text editor and start showing you how to code a Magento website in PHP. No Nerd Required

“Get back indoors nerds”

We’ll show you how to build your own Magento website with ZERO coding.

And the little bits of coding you will need, we’ll give you example files so you can copy & paste it to your new responsive Magento website. This course is Matt & Dave proof.

What you will learn in this course:

  • How to build your own fully Responsive, customised Magento website
  • That works on tablets, phones and even desktops too
  • That a responsive Magento design doesn’t need to be expensive
  • All the theory you need to know first
  • How to build each section of your website, step-by-step
  • How to customise the product & category pages
  • How to create a fantastic looking homepage with image slideshows and product sliders
  • Everything you need to know about designing a Magento website using the Ulimo theme
  • Oh and we also show you the settings and tools to make your Magento website fast, globally

Magento Responsive Design Tutorials

Say Hello to Ultimo

We don’t believe that a Magento design needs to be expensive, apparently over 10,000 businesses also believe this too.

The Ultimo theme costs $99 USD and comes with more features than you can shake a stick at. For example:

  • Proven and used by over 10,000 Magento websites
  • Compatible with Magento 1.5 right up to the latest versions of Magento
  • 100% responsive, no separate apps or themes for mobile devices
  • Unlimited colours
  • A highly configurable “Mega Menu” for your categories
  • 4 layout styles for your homepage
  • Image slideshows and product sliders that you configure
  • Highly customisable product pages, with image zooms, brand logo’s, brand descriptions, related products and so on…
  • List and gallery views and layered navigation for category pages

And these are just some of the features, think how much this would cost you if you wanted this from a Magento design company.

You will need:

Don’t Over Pay for a Responsive Magento Website

Build your website in your pyjamas. Pause, rewind, ask questions at anytime for any of the tutorials in this course.

We’ll show you how and with everything you need to know step-by-step, in 100% Plain English. Spend your budget on what really matters, the marketing side and driving sales.

Lessons

2. The Plan of Attack

Complexity: Easy

This tutorial aims to prepare you for the task at hand because designing a feature-rich website like Magento requires time and careful planning.

3. Where to Obtain Support

Length: 6 minutesComplexity: Easy

We know first hand that building your own Magento website will be an incredibly rewarding process. When you need a hand though, the good news is, that you're not alone. There is loads of support options available

4. Preparation Introduction

Length: 3 minutesComplexity: Easy

This is where we will be getting you up to speed and getting you prepared with the basics that you are going to need to start building and designing your own Magento website.

5. Suggested Tools & Apps

Length: 12 minutesComplexity: Easy

In this tutorial we show you some of the tools and apps that we recommend you get hold of which will make designing your own Magento website much easier. You might not use them all right now, but you'll need a couple of the free plugins later on for testing.

6. How to Make a Backup of Magento

Length: 14 minutesComplexity: Easy

Backing up Magento the Easy Way

In this tutorial we share with you the easiest way we have found for backing up your Magento system. In as little as 4 clicks we have found a way you can back up your entire Magento system.

7. How to Make a Clone of Magento

Length: 18 minutesComplexity: Easy

In this tutorial we show you how you can clone your Magento system and make an exact copy. This is perfect for testing new extensions, themes and other changes before putting them live on your real website.

8. Purchasing the Responsive Magento Theme

Length: 12 minutesComplexity: Easy

In this tutorial, we are going to show you where to purchase the Ultimo theme from Theme Forest. Ultimo is the theme that we will be basing the tutorials on so it's required to continue with this course.

10. Creating a New Storeview in Magento

Length: 21 minutesComplexity: Easy

Having separate store views is super handy if you already have an existing Magento website and want to use a separate one for the Ultimo theme that you have just installed, in this tutorial you'll find out how to this.

12. The Ultimo Theme Defaults

Length: 11 minutesComplexity: Easy

In this tutorial you'll going to be putting some of the basic settings in place for our new Ultimo theme. There are loads of settings that we can play with and alter in the setup of Ultimo but for right now there are just three main settings that we need to alter before we continue any further.

13. Adding Test Products

Length: 7 minutesComplexity: Easy

In this tutorial we are going to be adding some test products to our Magento inventory. If you already have lots of products, happy days, skip this one :)

14. Preparation - Summary

Length: 6 minutesComplexity: Easy

Preparation Summary

Happy Days! You have now completed the preparation section of the Designing a Magento Website course and together we have the necessary steps to start build your responsive Magento website.

15. Theory - Introduction

Length: 8 minutesComplexity: Easy

Magento Theory Tutorials

We have included this section as if you can understand the Theory behind what we are doing and why we do it for some of the later tutorials then not only will it give you a deeper understanding of the website but also you will know exactly why we take some steps later on.

16. How Magento Themes Work

Length: 15 minutesComplexity: Easy

In this tutorial we introduce you to the Theme structure in Magento, looking at the fall back system and why you should really use a child theme for your website.

17. Creating Your Child Theme

Length: 14 minutesComplexity: Easy

In this tutorial we show you the easy way to add a child theme to your Magento system. We provide the files for you to use and all you have to do is copy and paste and you will have a child theme in your Magento system.

18. Static Blocks in Magento

Length: 12 minutesComplexity: Easy

In this tutorial we introduce you to static blocks in Magento. We look at what static blocks can do and why they are useful, and also find out that Ultimo comes with loads of pre configured static blocks that we can use.

19. Pages in Magento

Length: 15 minutesComplexity: Easy

In this tutorial we take a look at Pages in Magento and show you how you can add in the standard pages that come with the Ultimo theme.

21. CMS Markup Tags

Length: 14 minutesComplexity: Easy

In this tutorial we introduce you to CMS Markup tags. Now don't worry, although they sound scary they are actually really easy to use and also come up in really handy for your Magento website.

22. Disabling the WYSIWYG Editor

Length: 3 minutesComplexity: Easy

In this quick tutorial we show you how to disable the WYSIWYG editor in Magento. The reason that we suggest doing this is that the editor can really do some undesirable things to your code.

23. Disabling & Flushing Magento Cache

Length: 4 minutesComplexity: Easy

In this quick tutorial we cover with you all about the caches within Magento. We cover with you what the different ways of flushing the caches are in Magento but importantly what the caches do to your website and why we need to clear the caches.

24. Re-indexing in Magento

Length: 2 minutesComplexity: Easy

This is a really quick tutorial where we show you how to reindex your Magento website. We cover this with you once here so that when in later tutorials we tell you to re-index your website, you know exactly what we mean and can do it without having to be shown what to do.

25. Layout Grids System in Magento

Length: 17 minutesComplexity: Easy

In this tutorial we share with you the layout grids system for your Magento website. This makes creating columns for pages easy, but the thing is you may have never come across the idea of grids before.

26. Breaking the Website Up

Length: 13 minutesComplexity: Easy

In this tutorial we show you how to break your website up into pieces! Now this sounds harsh but really it makes perfect sense as it allows us to work on different parts of the site without getting overwhelmed by the page as a whole.

27. Theory - Summary

Length: 8 minutesComplexity: Easy

You have now completed the Theory section of the Designing a Magento Website course and we know that some of these tutorials have been quite Theory heavy and a little dry in places but we make no apologies or that as these tutorials will have given you a fantastic grounding and understanding of some of the key pieces of Magento websites.

28. Meet Osoyou

Length: 2 minutesComplexity: Easy

In this tutorial we introduce you to our pseudo business Osoyou. For those who have followed us along in our M2E Pro courses you will have come across Osoyou before.

30. Product Page Introduction

Length: 6 minutesComplexity: Easy

Welcome to the introduction to the Product Page section of the Designing a Magento website course. This is where we begin to start designing your very own Magento website.

32. Image Gallery on the Product Page

Length: 25 minutesComplexity: Easy

In this tutorial we take a look at the image gallery on the product page and take a look at the different settings that we can change to alter how the image gallery will work on your website.

33. The 5 Bullet Points

Length: 24 minutesComplexity: Easy

In this tutorial we show you how to customise the product page to display the 5 bullet points. For those that have followed along in our earlier guides in using M2E Pro to sell onto eBay these 5 bullet points will be familiar.

34. The Product Page Colours

Length: 30 minutesComplexity: Easy

In this tutorial we show you how you can edit all of the different colours on your Product Page. This is where we really begin to change the look of your site

35. Custom Product Tabs 1 & 2

Length: 14 minutesComplexity: Easy

In this tutorial we show you how to customise the custom tabs on your product page, and give you some ideas of what you could use them for.

36. Attributes on the Product Page

Length: 14 minutesComplexity: Easy

Showing your product attributes on the product page of your Magento website is a sensible way of introducing your product to your customers. In this tutorial, we'll be showing you how to show your product attributes on your product page for your customers to see.

37. Product page Static Blocks

Length: 17 minutesComplexity: Easy

In this tutorial we show you all of the static blocks that we have active on on the product page. There are 5 in total and in this tutorial we show you what we would do with three of them.

38. Brand Logo's on Product Pages - Part 1

Length: 26 minutesComplexity: Easy

In this tutorial, you’re going to look into brand logos and the different ways you can use them on your Magento website. This part of the tutorial points out the subtleties of brand images and the settings in Magento that will make your logos appear on your product page.

40. Related & Up sell Products

Length: 15 minutesComplexity: Easy

In this tutorial we show you how to add both related & up sell products to your Product Page. These are a great way to potentially increase the average basket spend on your website.

41. Related & Upsell Products - Fallback Setup

Length: 21 minutesComplexity: Easy

In this tutorial we introduce you to a handy fall back setup in which you can assign random products into your related and up sell sections. This doesn't give you the same level of control as doing it manually, but if you have a lot of SKU's and would rather display some products rather than none then this is a great alternative for you.

43. Swatches for Configurable Products

Length: 20 minutesComplexity: Easy

In this tutorial we show you how you can add colour swatches to your configurable products on your website. We give you 140 swatches to use and show you how to add them to your system

44. Product Reviews

Length: 5 minutesComplexity: Easy

In this tutorial we show you how to add product reviews to your product page. The good news is this is really straight forward to do and is literally just 3 settings in your Magento system.

45. How to put products on Sale

Length: 16 minutesComplexity: Easy

In this tutorial we show you how to put your products 'On Sale' on your new website. This is a fantastic tool to draw additional attention to certain products on your website.

46. How to mark a product as 'New'

Length: 6 minutesComplexity: Easy

In this quick tutorial we show you how you can mark a product on your Magento website as being 'New'. This doesn't mean that it has to be exclusively your new products that have just arrived.

48. BONUS: Responsive Video Players on Product Pages

Length: 17 minutesComplexity: Easy

Responsive Video Players on Magento Product Pages

In this Bonus video we show you how you can add either Youtube or Vimeo videos into your Magento website product pages. This question was asked in the UnderstandingE forums and we thought the suggestion was that good this video had to be added to the product page section of this course.

50. Updating Ultimo - Part 1 - Why and How?

Length: 33 minutesComplexity: Easy

In this tutorial, you will learn the proper way of updating the Ultimo theme of your Magento website from version 1.8.1 to version 1.9.0 and we'll help you decide whether you need to update your Ultimo theme or not.

52. Categories Introduction

Length: 2 minutesComplexity: Easy

Welcome to the categories section. In this section of tutorials we show you how to customise your Magento website categories to get them looking how you want them to look for your website.

54. Category Pages - Colours

Length: 28 minutesComplexity: Easy

In this tutorial we get on to the cool stuff and show you how to customise the colours on your Magento website category pages. Just like with the product pages this is where you can customise the look and feel of your category pages

55. Category Pages - Descriptions

Length: 20 minutesComplexity: Easy

In this tutorial we share with you how to add category descriptions to your Magento category pages. We show you where the settings are to add descriptions and then we show you the copy & paste code we have for you to expedite the process!

56. Category Page - Static Blocks

Length: 17 minutesComplexity: Easy

In this tutorial we show you how you can use the static blocks that are available in the Ultimo theme to customise your category pages on your website.

60. Category Menu Bar - Getting Started

Length: 19 minutesComplexity: Easy

In this tutorial we begin to show you the category menu bar and look at all of the options that the Ultimo theme comes with which enables you to customise it for your Magento website.

61. Category Menu Bar - Colours

Length: 22 minutesComplexity: Easy

In this tutorial we have more colours that we can customise! This time it's the category menu bar on your Magento website and we show you all of the different options you have available.

62. Category Menu Bar - Theory

Length: 8 minutesComplexity: Easy

In this tutorial we introduce you to the Category Menu Bar and look at the theory behind the customisation options that you have available to use.

63. Category Menu Bar - Practical

Length: 33 minutesComplexity: Easy

This is the tutorial where we get hands on and show you how to customise your Category Menu Bar using the Theory we covered in the last tutorial as our guide.

64. Category Menu Bar - Custom Content

Length: 16 minutesComplexity: Easy

In this tutorial we show you how to add your own custom content to your category menu bar and really make them stand out. The good news is, we can do this using the same processes we have used in earlier guides.

65. Category Menu Bar - Adding New & Hot Categories

Length: 11 minutesComplexity: Easy

In this tutorial we show you how to add both 'New' and 'Hot!' tags to your categories and how to get them to show in your category menu bar. This is a really cool feature where you can draw special attention to certain categories that you want your customers to navigate too on your Magento website.

66. Categories - Summary

Length: 2 minutesComplexity: Easy

There is nothing else for us to say other than Well Done! By going through this section of the course you will now have some amazing looking category pages on your Magento website, as well as some impressive category menu's.

67. The Key Pages in Magento

Length: 8 minutesComplexity: Easy

In this section we show you how to customise the different content pages that we think you will need. This section is going to be much shorter now than the others as you are now running with Magento and know all the basics which allows us to cut to the chase.

69. Creating a Customisable Contact Us Page

Length: 6 minutesComplexity: Easy

In this tutorial we show you how to customise the contact us page in Magento. This is a little different to the normal pages as Magento don't make the contact us page easily customisable like the other CMS pages.

70. Editing the 404 Page

Length: 7 minutesComplexity: Easy

In this tutorial we show you how to edit the 404 page for your website. This is often your last page you have to rescue lost customers so we need to make it as easy as possible for them to make their way back to your site.

71. Content Pages Summary

Length: 4 minutesComplexity: Easy

All we have to say is Well Done! You have learnt loads in this section and should now have some great Content pages set up in your system.

72. Checkout & Cart Introduction

Length: 8 minutesComplexity: Easy

Welcome to the Cart & Checkout section of the designing your Magento website course! This is the section where we show you how to edit and customise both your cart and checkout pages. These are really important pages to get right as these all base themselves around conversion.

73. Styling the Minicart

Length: 8 minutesComplexity: Easy

In this quick tutorial we show you how to style the mini-cart in Magento. This is the little cart which appears when a customer adds a product to their basket before they head over to the main checkout page.

74. Styling the Cart - Static Blocks

Length: 13 minutesComplexity: Easy

In this tutorial we show you how you can edit the static blocks that are available on the cart page in your Magento website. On the cart page there are two static blocks and we will be showing you how we would use them to help build further trust with your potential customers.

75. Styling the Cart - Buttons

Length: 13 minutesComplexity: Easy

In this tutorial we show you how to style the buttons that display on the cart page of your Magento website. Button confusion is rife on our cart page and that is the last thing we want for our customers. On the Cart and Checkout the primary action we want out customers to take is that which results in them completing the checkout and sending payment.

76. Cross Sell Items in Cart

Length: 11 minutesComplexity: Easy

In this tutorial we show you how you can add cross sell items to your cart on your Magento website. The purpose of doing this is simple. This is your last chance to possibly increase the basket spend of your customers and ultimately sell more products.

77. Styling The Checkout - Static Block

Length: 4 minutesComplexity: Easy

In this quick tutorial we show you the static block which is available on the checkout page. We have now done on the cart page, and now we move on to the next stage which is the Checkout. Over the next few tutorials we show you how you can style your checkout page in such a way to try and aid conversion.

78. Styling the Checkout - Colours

Length: 12 minutesComplexity: Easy

In this tutorial we show you how to edit some of the colours on your checkout pages. On the checkout pages we have some coloured banners which highlight to the customer where they are in the checkout process and it is these colours which we will be showing you how to edit.

79. Styling the Checkout - Removing Blocks

Length: 12 minutesComplexity: Easy

In this tutorial we show you how to remove some of the static blocks from your checkout page. As well as some other bits and pieces too. The reason why we think you would want to do this is simple....CONVERSION.

80. Checkout & Cart Summary

Length: 7 minutesComplexity: Easy

Well Done! You should now have a fully customised cart & checkout which looks amazing on your website, and you have learnt absolutely loads in this section.

81. Homepage Introduction

Length: 3 minutesComplexity: Easy

Welcome to the final section of the Designing a Magento Website course. This is now where we get your website homepage looking how you want it too! The good news is, because you have been through the earlier tutorials there is nothing new here, everything we do we have done before.

82. Header Static Blocks

Length: 13 minutesComplexity: Easy

In this tutorial we get straight to business and start showing you the static blocks in the header section, what they are called, how to edit them and also how to turn them on and off.

83. Styling the Header

Length: 11 minutesComplexity: Easy

In this tutorial we show you how to style the header. Now you have the static blocks how you want them on your site we show you how else you can style the header for your site.

84. Adding Homepage Sliders

Length: 22 minutesComplexity: Easy

In this tutorial we get on to the cool stuff and show you how you can add homepage sliders on to your website. In the above video for this tutorial we show you the 3 different slider types and also give you the psd files with all of the correct dimensions that you can use or pass on to a freelancer.

85. Images are Everything

Length: 21 minutesComplexity: Easy

In this tutorial we show you a handy secret to getting awesome images for your homepage. The power of great images is incredible and here we show you how to get them the easy way.

86. The Home Page Layout

Length: 41 minutesComplexity: Easy

In this tutorial we show you how to style your homepage layout and take a look at the different options available. As always we have the copy and paste code to make this super easy for you!

87. Introducing the Footer

Length: 20 minutesComplexity: Easy

In this video tutorial we introduce you to the footer section in Ultimo and take a look at some well known ecommerce site footers as well as the Ultimo demos to get some inspiration and see what could be possible.

88. Styling the Magento Footer Area

Length: 33 minutesComplexity: Easy

In this video tutorial we take you through the setup and styling of the footer area. To help you, we've got a download for you that includes the copy & paste HTML we show in the video tutorial and also several credit card and PayPal logos for you to use too.

89. Colouring the Magento Footer Area

Length: 12 minutesComplexity: Easy

In this video tutorial we show you how to edit the colours for the footer area on your Magento website. Just like the other parts of the site that we colour, the footer is no different!

90. Home Page Summary

Length: 8 minutesComplexity: Easy

There is nothing else to say but Well Done! If you have made it to this lesson after following through all the others then you should now have an awesome looking Magento Website! How cool is that!

91. The 'Go Live' Checklist

Length: 48 minutesComplexity: Easy

In this video tutorial we cover off with you our UnderstandingE 'Go Live' checklist. This is the list that we have created for you to do a sanity check of your site to ensure that everything is set and behaving as it should do.

92. BONUS: Adding a Favicon

Length: 13 minutesComplexity: Easy

In this video tutorial we show you how to add a Favicon to your Magento website. This will place your logo in the top of the browser window and make the site look much better to your customers.

93. BONUS: Adding a Twitter Feed

Length: 10 minutesComplexity: Easy

In this tutorial you will learn how to add a Twitter feed to your Magento websites homepage using copy and paste code in static blocks! Super easy to do!

94. Adding a Facebook 'Like' Box

Length: 12 minutesComplexity: Easy

In this video tutorial we show you how to add a Facebook 'like' box to your Magento website homepage. Showing customers you are a social business!

97. Exporting/Importing Settings for Ultimo

Length: 10 minutesComplexity: Easy

Exporting/Importing Settings for Ultimo

Ultimo comes with inbuilt export and import tools for all of its settings. In this bonus tutorial, you will learn where to access the export and import settings of Ultimo within your Magento system, as well as how to use them.

98. Exporting/Importing Pages & Static Blocks

Length: 17 minutesComplexity: Easy

Magento doesn’t come with built-in tools for exporting and importing static blocks, but it has a FREE extension that will allow you to do this. This tutorial shows you how to install that free extension in your system, and how to use it to export static blocks as well as import them into your Magento website.