Blog

Shopify District Theme: Deep-Dive Review and Tutorial (2020)

Shopify District Theme: Deep-Dive Review and Tutorial (2020)

London’s West End, Tokyo’s Shimokitazawa, The Hunger Game's District 7: there are plenty of intriguing, colourful districts in the world, but how many of them help you increase your conversion rate?

Just one, Shopify’s District Theme.

With over 9,000 downloads and a staggering 100% satisfaction rate on the Shopify Theme Store, it’s fair to say that Shopify District Theme is in a league of its own when it comes to districts. And themes, for that matter.

Here at PageFly, we’ve got a passion for professional layouts. Come with us as we take a deep-dive into Shopify District Theme; including what it does, who it’s for and if it’s worth it.  

Outline

I. What Is Shopify District Theme? 

District theme on Shopify theme store
Shopify District Theme on the Shopify Theme Store.

Shopify District Theme is one of the many full-website templates that Shopify features on its Shopify Theme Store. The template has been designed by third-party developers Style Hatch, Inc and is exclusive to Shopify.

Shopify District Theme features a professional layout of elements across homepage, collection pages, product pages, blog pages and many more. It uses a wealth of elements with pre-set parameters, meaning that all you have to do is fill in the content boxes with your own text and images.

Let’s break down the Shopify District Theme stats:

  • Price: $180 US
  • Downloads: 9,000+
  • Live websites using the theme: 6,000+
  • Reviews: ~ 600 (with 100% satisfaction)
  • Support: Live chat, email support and an online help database by Style Hatch.
  • Included styles: 3 

For more Shopify Paid and Free Theme Reviews, check out our series: 

II. What Are the Different Styles of Shopify District Theme?

The 3 styles of Shopify District Theme each have their own appeal. Though their central vibes are very similar, their actual layouts differ between colour, background, arrangement and spacing.

If you want to take a look at the key features present in all styles of the theme, skip down here.

01. District

District style

District Style

District’s eponymous, District style is simple but effective. It focuses on whitespace, smaller text and classic fonts to come across as a professional Shopify theme.

It has fantastic colour swatches, allowing store visitors to swap fluidly between product variants and see real pictures of how that product looks in different colours. It’s also got some pretty neat product zoom animations on its homepage that entice the viewer for a closer look.

02. Energy

Energy style of district theme

Energy Style

Bolder colours and an immediate collection gallery are the first things you’ll notice in the Energy theme. It has many of the same features as District, including image animations when hovering and similar font and button styles, but it lacks the attractive circular colour swatches, opting for word boxes instead.

One great thing about Energy is its inclusion of a map at the bottom of the homepage. If you have a brick-and-mortar store, then having a map of your location can be a great addition to your store. The map on Energy even offers directions to the store from the customer’s location, provided via a link to Google Maps that’s clickable on both desktop and phone.

03. Coast

Coast style of District theme

Coast Style

Lastly, we have Coast, which is a well-put-together combination of both District and Energy  styles. It’s back to placid tones and circular colour swatches on this one, but with some new features that work well in the fashion, jewellery or beauty niches.

The first such feature is a product page that’s built into the homepage, which is great for if you want to promote a featured product on your store. The next is a blog preview at the bottom of the page, which offers snippets of content from your most viewed blogs that can have great sway in the niches we mentioned above. 

III. Who Is Shopify District Theme for?

District Theme layout

The layout of Shopify District Theme suits beginners the best.

Like many of Shopify’s professionally developed themes, District is targeted at beginner store owners who are feeling a bit overwhelmed by the daunting prospect of building their own website.

The vast majority of the work that has been put into Shopify District Theme is simply in its element arrangement. There is nothing particularly fancy or technical about it; it acts mostly as a tool for new merchants who are short on time.

District Theme Preview

Despite its predominantly novice audience, there are some benefits to Shopify District Theme that everyone can profit from:

  • Optimised for mobile - It’s well known at this point that the future is mobile. A store needs to be great-looking on mobile, but it’s an aspect that many new store owners tend to overlook. Shopify District Theme is just as well-designed on mobile as it is on desktop, meaning you don’t need to fiddle around with the parameters to make sure everything fits.
  • Free updates - Any updates that are introduced by Style Hatch are immediately applied for free to all users of Shopify District Theme. Not only does that mean that you don’t have to chase down updates to ensure your store works properly, but it also means that SEO and usability is kept at a consistently high level.
  • Multi-level support - This one is especially valuable for new store developers in inevitable need of a helping hand. Style Hatch provide a comprehensive database of articles to answer general queries and also offer live chat and email support to all users. Reviews from their users have rated the customer service very, very highly.

IV. How To Build Your Online Store With Shopify District Theme

Check out our video below as we explore the elements of the Shopify District Theme homepage. This will give you a better idea of what each element does and how it can be used on your store.

V. 06 Key Features of Shopify District Theme

06 key features of District theme

The 6 key features listed on the Shopify Theme Store.


The Shopify Theme Store names 6 key features for District Theme, present across all 3 of its styles. Let’s take a look at these six features across 6 real-world examples of Shopify District Theme in action.

01. Promotional Banner

Promotional banner in District theme

Courtesy of A Gift Personalized

The promotional banner allows you to make a big announcement right at the top of your store’s homepage. Usually you’d use this to promote a sale or a new product, along with an attractive shipping policy and a big call-to-action button.

Promotional banners are easier to make than a standalone landing page, and less invasive than a pop-up. Big text and big images are the way to go with these.

02. Slideshow

Slideshow element of District theme

Courtesy of Merriam Books

When you’ve got multiple things happening on your store, a slideshow is a good way to have multiple title elements at once. You can add however many slides you want, set up automatic scrolling, change the scrolling speed and much more.

Slideshows are great additions to any homepage, but they’re not complicated to set up without the help of Shopify District Theme. Shopify has tools to make setting up this kind of element simple.

03. Marketing Popup

Marketing Popup for Shopify store

Courtesy of Elevated Vaping

Marketing popups are those little boxes that show up after a certain amount of time a visitor has spent on a page, or after a certain amount of scrolling that they have done. They encourage a visitor to take an action, whether it's clicking through to a discount page, checking out a limited collection or signing up for email offers.

Shopify District Theme includes this surprisingly effective element on your page, but it’s up to you to maximise its conversion potential by adding countdown timers, bold text, attractive images, trust badges, etc.

04. Collection Gallery

Collection Gallery of district theme

Courtesy of Momentary Ink

A collection gallery is an element that draws attention to the collections of products you have in your store. Usually they’re heavy on the images, with some interesting fonts and clear call-to-action buttons.

Again, this is another element that can be added with just the click of a button. It’s pretty much a feature of every Shopify store, and to be honest, it would be very strange to find a store without one.


05. Homepage Video

 homepage video

Courtesy of AbsoluteXtracts

Nowadays, 71% of consumers prefer video marketing over any other type. Shopify District Theme taps into that by providing a video element that can help immediately grab the attention of visitors to any page.


Like this example from AbsoluteXtracts, you can use the video as a captivating and concise ‘about us’ section for your store. Alternatively, you could use it on your product page to offer another sales angle for your product, be it an entertaining ad, product review or a simple ‘how to use it’ video.


06. Colour Swatches

color swatches element in District theme

Courtesy of the District demo store

Colour swatches are little visual buttons that let you see the different colour variations of a product. They’re one of a number of high-converting features that some of the best product pages use to give visitors a sense of choice in their purchase, which can lead to better conversion rates.

The swatches featured on Shopify District Theme are clear and compact, meaning that visitors can quickly see a different colour variant of the same product. If any of the variables, such as name, price, available sizes etc., are different between different coloured variants, the swatch will make sure that these variables are shown on the screen without loading a new page.


VI. 3 Great Examples of Stores Using Shopify District Theme

In addition to the 6 examples we’ve just shown you, here are 3 more full-website examples from users of Shopify District Theme. Take a look at how you can adapt any of District’s styles to make a fully functioning, fully professional store.

01. Mexicali Blues


District theme homepage examples

Mexicali Blues took the District Style and gave it a bit of a Coast style twist. Blue colour and plenty of whitespace gives them a great Mediteranean vibe, which suits the custom font with which they’ve replaced the title font (we recommend that you replace the title font, too!)

Further down the homepage they’ve replaced the ‘lookbook preview’ section with a featured customer review, as well as the ‘shop the look’ section with an integrated social feed from customer uploads to their Instagram account. Both of these are great for boosting social proof.

Instagram feed example

On their customer page, they’ve kept much of it from the original Shopify District Theme - same selection boxes, same swatches, same image zoom and same social sharing buttons. However, they’ve made a bolder call-to-action button (the huge yellow ‘add to cart’ button) and added a product review section, again, in the interests of social proof.

District theme product page example

02. Snarky Tea

Snarky Tea made some killer adjustments to the Shopify District Theme, using the ‘featured grid’ section to promote their featured products on the homepage. They also personalised the marketing popup so that it scrolls in from the side after a certain amount of exploration on the homepage.

homepage example of district theme

Further down, you’ll find their best-selling teas in the ‘featured collection’ section, as well as the blog (aligned vertically rather than horizontally), just underneath. Above these sections there’s a full ‘featured product’ section, a la Coast style, which promotes the product they most want to sell.

collection page example District theme

There’s a lot of personalising that’s gone into the product page and it doesn’t bear much resemblance to the one from the original theme. The selection boxes, image layouts and ‘similar products’ section are the same, but there’s a different font, colour, set of icons and review section below. It’s a great example of how you can personalise Shopify District Theme to your needs!

Read more: How To Customize Your Shopify Product Page: Step-by-step Tutorial

District theme product page example

03. Smack Apparel

Homepage example of District theme

If Snarky Tea is a great example of how to personalise Shopify District Theme, Smack Apparel is a great example of how to have a great store without a huge amount of customisation. Their homepage is essentially a mixture between District and Energy styles, with all of the main elements rearranged, but largely left the same.

collection page example district theme

The ‘shop the look’ and the ‘featured collection with text’ are very much the same, as are the blog, video and ‘featured grid’ sections. The adaptations they’ve made are in the image animations and, most notably, in the cute sports icons that accompany the header menu items.

District theme product page example

Like the homepage, Smack Apparel’s product pages are very similar to the template. The selector boxes, social buttons, colour swatches, quantity counter and alternative image library are the same. Still, they’ve added a review counter below the title and altered the ‘add to cart’ and ‘buy it now’ buttons, along with a full review section below.

VII. Shopify District Theme - Is it Worth it?

There’s no doubt that Shopify District Theme can be the foundation for a great-looking, high converting store. Its well-curated collection of elements, including slideshow, featured grid and ‘shop the look’ sections work well together to promote a range of products straight from the homepage.

And if you think $180 for a professionally designed store sounds to be good to be true, well, you’d be right.

Though the real-life examples we’ve shown you are indeed beautifully crafted stores, the reality is that quite a lot of work had to go into turning them from theme template to finished store, despite the $180 investment.

Our verdict?

If you’re a beginner store owner and/or pushed for time and/or have a high startup budget, Shopify District Theme can be a great way to get your store off the ground. However, if none of these stipulations apply to you, you’re probably better off making your own.

Regardless of whether or not you choose to invest in Shopify District Theme, you’ll need a page builder to take your store to the next level. PageFly is Shopify’s most trusted page building app. PageFly containing all the elements, page templates and 24/7 assistance you need to build your ideal page - all through drag-and-drop, with no coding necessary - this is why we have over 60.000 active Shopify merchants using PageFly and rank #2 among over 4600 apps on Shopify app store. 

Try PageFly out  for free trial by clicking below.

Try PageFly for FREE

Older Post Newer Post