What if I told you that you could build an entire website from your phone?

We’re all operating in a world of tight budgets, no sector more so than charities and not-for-profits. So what if I told you that you could build an entire website from your phone? And what if I told you it was perfect on mobile and desktop? And what if I also told you it would cost you exactly zero dollars? And that I, with no technical expertise at all, did all of this in the car, on my phone, as my husband was driving us 10 hours from Melbourne to Adelaide? Let me explain how I did it and how you can too.

I am the chief executive of St Kilda Mums, a Melbourne-based charity that recycles donated baby and kids gear and gives them to families in need, through social workers and other support agencies. Being a small but rapidly growing charity, we have no dedicated IT, graphic design or digital marketing staff, let alone a web developer. 

All things IT are overseen by me and my part-time information coordinator Paula. Between us we manage the websites of St Kilda Mums and our branches, Eureka Mums and Geelong Mums.

In 2016 Paula and I got some quotes to rebuild our sites from scratch, after the realisation they were not working the way we wanted them to, leading to high levels frustration for donors, volunteers and other users.

The lowest quote for a new website was $25,000 and the highest $60,000. We would need to secure a grant to cover the cost and until we could do that, we decided to try and improve the website we had.

Our CMS was Expression Engine. Because it wasn’t widely used, it wasn’t easy to find web developers who knew it, and the only one we could find was in Sydney. Based on our wishlist, they priced it up in stages and we took a piecemeal approach, starting with the biggest pain points. And the challenges were huge. 

One of the key issues we set out to fix was that site wasn’t just unresponsive on mobile, it was barely mobile friendly. Our first step was to upgrade our CMS to the latest version of the software. We discovered that the new version of the software was not much of an improvement on the older version.

It seemed that every time the developers fixed one problem, they would break something else. It’s one of the most common issues faced when you decide on a rebuild, when you should be starting from scratch, from the ground up.

We even did independent user testing and while it was money well spent, it became another catalyst for extreme frustration, because the limitations of the CMS meant we couldn’t implement the changes we knew we needed.

Cut to back to the car and my husband is driving down the Western Freeway with the kids in the back relishing some unlimited device time.

I made a list and prioritised our website needs into two categories – needs and wants. My number one priority was mobile responsiveness. We knew from Google Analytics that 85% of our website visitors were mobile.

At this point I started to wonder if I should just go back out to tender and take our pick of Drupal or Wordpress… Then I had an idea.

If I could find a website CMS that was easy to control and use on my mobile, I would have much more confidence in its ability to build for mobile first.

St Kilda Mums already had a basic ecommerce platform in Big Cartel - which we used to sell merchandise (greeting cards and tea-towels) as well as event tickets to our annual Mother’s Day lunch.

I would be happy to recommend Big Cartel. It’s simple and easy to use and costs just $9.99 a month for less than 25 products. But the themes are limited, the back end is not mobile friendly, and for these reasons I discounted building our entire site on this platform.

I knew about an ecommerce platform called Shopify from some work I had done 5 years ago on a website for our winemaker friends - the very same we were spending the week with in McLaren Vale.

Could Shopify provide all the features I desired for our sites like the ability to embed video, sticky navigation, and mobile first? It’s not too much to ask in 2018 right?

So I spent the next hour of the drive reviewing the many Shopify themes on my mobile phone, reading reviews and verifying the developers and support behind each.

Shopify has a really neat filter function that allows you to search for themes by features.

Shopify theme filter

After a quick break for lunch in Horsham I chose the Ira theme and set about testing it.

These are my notes from the day about the Ira theme:

By Florescent Design Co (UK)

Feature either a slide-out sidebar menu or a large horizontal menu. (Sticky)

Mobile first

Video

Wide

Editorial

Slideshow with video

Above the fold socials

Not multilevel or multiple column navigation.

43 positive reviews

I set up a trial account (14 days free) and started to load content. I could easily find all my assets - logos and photos - on Google Drive.

I was able to test video content - super quick and easy to upload from our YouTube channel.

By the time we drove across the border into South Australia I had established that our Salesforce web-to-lead and web-to-case forms could be easily embedded on the page templates on Shopify with HTML coding. This was so simple that I did a test myself and it worked perfectly!

I loved playing with the various sections in the home page of the theme. I loaded up testimonials, gallery elements, call to action buttons, and tested how the blog posts would look.

Everything was quick and simple to do in the back-end, and rendered perfectly. The Ira fonts and graphic design elements are striking.

Next I built a prototype page, using content from the current website. I literally copied and pasted the content from one into the other and all the hyperlinks worked. Bonus!

There is a stretch of road after Keith where the network is only 3G, so I had a break, rested my eyes, and did a spot of driving to give my husband a break from behind the wheel.

From Murray Bridge to Port Willunga - our final destination - I created samples of merchandise products and event tickets, and customised the Shopify checkout. I chose Shopify payments - simple to set up and cheap to use.  

I then tested it, adjusted the copy for the order notification email that the customer would receive when buying an event ticket, and it all worked perfectly. Job done, proof of concept, sample site built, on my phone in one day in the car.

Follow Up

On my return to work on the 24 of January I contacted Shopify Experts in Melbourne called Elkfox.

I asked them to quote to add our proprietary font to the test website and to replace the cart symbol with a $ symbol - this would link to our donation landing page. Amazingly, they agreed to do both for free to support our work.

We ended up changing our theme from Ira to Debut Light. Elkfox recommended it thanks to its speed and we love the Google Map feature, which makes it very easy to find us when using your phone as your GPS. The header was not sticky (meaning that it disappeared when you scrolled down), but Elkfox tailored the theme to make it stay at the top.

In the meantime, we engaged three of our Salesforce volunteers to copy all the old content from our previous website over onto Shopify, which took three days. Paula and I then spent some time making it all sparkle. HTML gun Paula set about making the forms embedded in the site more readable, customising the contact form, redirecting old URLs to the right place (using an app called Easy Redirects) and integrating Facebook Messenger and Campaign Monitor with the websites.

Another customisation designed by Elkfox was a Donate Now button to add to the sticky header, with the ability for us to redirect that link to any donation landing page we wanted to. (The theme of my next blog will be the heart wrenching drama of the Salesforce Integrated Donation Landing Page, but thankfully it has a happy ending.)

Our volunteer graphic designer created the Donate Now button, then all we had left to do was to point the domains to Shopify and switch the domains on in the Shopify dashboard.

We found a really simple app called Campaign Monitor Email Marketing to connect website newsletter sign ups with our e-marketing platform. This also supports pop-ups if that is something you want to have on your website.  

18 work days: that’s how long it took us to go live with three new websites.

One of the things we like the most about the new sites is the site-wide search. Not only does it make it easier for our site visitors, but it's also super helpful for maintenance for us.

Since launch we have done some more customisations with the help of the team at Elkfox. You can see these special pages here – Our People, Donate Baby Things.

Our People

As planned, we integrated Shopify with Salesforce, using Zapier, and sold our Mother’s Day Lunch tickets using Shopify payments; each ticket commission costing 1.4% + 30¢ (versus 5% + 99¢ for Eventbrite). Transactions and contacts were created or added in live time, with no manual uploading of data. Of course a few duplicates were created where people have more than one email address, but a duplicate alert based on matching mobile phone numbers and first and last name combinations helped identify these quickly.

Here’s the case study summary.

Cost of development

$0. 

Ongoing hosting costs

Shopify currently offers a 15% discount for NFP and if you sign up for the 5 user ($79 per month) plan they will give you access to all the benefits of the plan tier above the $79 plan which usually costs $299/month.

We have three plans, so our annual hosting cost is $2417.  

Less than 1/10 of the cheapest quote from 2 years ago.

Shopify offers a 14-day trial, and you can pay by the month so there is no initial outlay. There are dozens of beautiful free themes (templates) to choose from.  

Key Lesson

Here’s the most important lesson I learned: The true test of a platform’s mobile responsiveness is the back end. If I can build a website on a mobile phone, anyone can!

My contact information: Jessica Macpherson jessica@stkildamums.org