Getting Started: Building your Shopify web store

Time to bring your business to the digital era. In this article, we’re walking through the development of your web store using the Shopify platform. You may see a lot of the same features found in our previous writeup – developing a website on WordPress – so check that out if you haven’t already. Let’s get started!

Article Breakdown:

  1. Sign up & service options
  2. Domain options
    1. Connecting & Transferring a Domain
  3. Key Features
  4. Adding Inventory
  5. Home Page Development
    1. Header
    2. Custom Header
    3. Text Overlay
    4. Featured Items
    5. Slideshows
    6. Footer
  6. Creating Content
    1. Posts
    2. Menu Items
    3. Linking Analytics

Sign up and service options

Shopify Page

photo c. Mike Petrucci on Unsplash

Signing up for your Shopify page is as easy as adding an email, your company name, address, and industry. Once you’ve added the standard details about your brand, you’ll be brought to a home page with the option to select a service package.

Shopify Service Packages

There are 3 plans to choose from when signing up for Shopify. Select the one that works best for your team. As seen above, you receive better payment processing rates and shipping discounts as you bump up in packages. You also gain access to more staff accounts and locations to manage.

Each plan has access to the Shopify POS system which can be used in person at a retail location or on-the-go at events.

Domain options

Domains on Shopify

photo c. LinkedIn Sales Navigator on Unsplash

Shopify offers a few different ways to get the domain you want. You can purchase a domain with them (see more about picking a domain name here) or you can bring your own from another site.

Connecting or transferring a domain

Domains with Shopify

Connecting a domain keeps the DNS with your original domain provider. This means you’ll need to manage your site through both Shopify and the domain provider.

You can also Transfer your domain. If possible, this is the route you want to go. This moves everything to Shopify making it easier to manage your site. But not all domains are transferable. Shopify will tell you if your domain is able to be transferred when you enter it in the text field.

Read more about why you should Connect or Transfer your domain, here.

Key features in Shopify

Why use Shopify

Going back to our Shopify homepage we have a bunch of options on the left.

  • Orders: View open orders, fulfill them, print shipping or return labels, and communicate with customers.
  • Products: Manage our inventory, transfers, backorders.
  • Customers: A CRM that shows who has created an account with us, their order history, shopping habits, and contact details.
  • Analytics: Like Google Analytics but tailored for retail. Here we can see what items are popular, abandoned carts, conversion rates, sales by social platforms, and much more.
  • Marketing: Allows you to manage your Facebook ads from one page.
  • Discounts: Mark specific items or categories on sale
  • Apps: External plugins that enhance your website. Examples: marketing automation programs, Slack order updates, SMS marketing, and more.

Adding Inventory

Adding a new item to Shopify

From the Shopify home page, select Products in the left options menu. From here you’ll be able to add/import new items, transfer inventory to and from locations or distributors, manage inventory, create collections, and manage gift cards. To add a new item you’ll have to fill in specifications such as the item name, description, pricing, SKU and Barcode, shipping details (weight), variations (different colours and sizes), and lastly SEO options. Also, there are options on the far right to organize the item by distributors, collections, and searchable tags.

Importing Items

If you have a large inventory that is already organized on a CSV file you’re able to upload the items in one go. Still, there might be some work to be done getting everything formatted properly, but ultimately this will save you time compared to uploading individual items.

Developing your Homepage

Designing your homepage Shopify

photo c. Štefan Štefančík on Unsplash

There are loads of professional looking widgets you can add to the homepage. Shopify makes it easy to customize the page to match your brand identity.

Shopify Main Menu

Editing your theme Shopify

We’re going to start in the left options panel and clicking “Online Store”. From here we’re going to click “Theme” and “Customize”. This will bring us to the current homepage. Here is where all of the visual edits will happen.

Customizing the header

Customizing your homepage Shopify

In the left column, we can organize our homepage by dragging and dropping the items to the desired location. We can also turn off sections by clicking the eyeball icon. This is a quick fix for removing sections without completely deleting them.

Action link Shopify

Under the header menu, we can add our logo and an announcement bar. The bar pops up at the top of the page and offers visitors quick access to important pages. It’s a great place to put a sale announcement, an upcoming event, or news.

Changing your title image

Homepage Shopify

Going back to the Sections menu, we can add an image with a text overlay. This is the perfect place to add the name of your brand and an optional subtitle. All of the widget settings are on the left.

Creating featured items

Featured Items Shopify

Showing items on your home page can be done in the “Featured Items” widget. In the left panel, you can add a title that represents the category of items being shown, control how many items are in each row, add or remove rows, and more.

Creating a homepage slideshow

Editing Slideshow Shopify

Slideshow Shopify

Slideshows are a great way to highlight item categories from your store. They’re ideal for large images that describe item uses, collections, and brand news. But don’t overdo it with 10 slides, try to have no more than 5. On the left panel, we can edit headings and add clickable links to each slide. We can also adjust the text size and placement in addition to the scrolling speed and slide order.

Populating the footer

Footer Shopify

In the Footer options menu, we can add quick links to specific pages, text about our business, and newsletter subscriptions. Add additional items by clicking “Add Content” in the Content section on the left. Also, add your social media pages under “Theme Settings”.

Fine-tuning your web store

Fine-tuning Shopify

Under “Theme Settings” we can change our site’s colour palette, fonts, social platforms, and checkout page.

Creating Content

Creating Content Shopify

photo c. Kaitlyn Baker on Unsplash

Just like our informative website, our web store should have pages that discuss what your business does, why your brand exists, and who makes your team succeed. Above all, set yourself apart by discussing what it is that you offer that your competitors can’t. Access these edits by returning to your Shopify homepage and clicking Blog Posts.

Adding blog posts and pages

Shopify Blog Post

There aren’t as many editing options as we saw in our WordPress development post, but we do have a few key SEO tools available. At the bottom of the page, there’s the Search engine listing preview. Here we can see what our page will look like when previewed on a search engine. We can optimize our posts so they appear higher on search engines by using keywords in our Page title and Handle. Tags are also a great way to improve SEO for any given page.

Adding menu options

Adding menu options Shopify

To add a new page to your Main Menu we first select Navigation in the left options panel. From here we can add a new menu or select an existing menu to add to. We selected Main menu and added the About Us option. Be sure to link this new menu item to a page or blog post and save. Now when you open your site’s homepage, you’ll see About Us at the top.

Linking Google Analytics and Facebook Pixel

Google Analytics Facebook Pixel Shopify

Under the Preferences option on the left, we have access to our site’s title and meta description (shown on Google searches). Below this, we have our Google Analytics code field, and Facebook Pixel ID option. These codes are copied and pasted from Google and Facebook to create a connection between your site and their platforms. This way, Facebook can report where users went after clicking an ad, and Google can provide more in depth site traffic reports

Hope this helped simplify the development of your web store!

Stay tuned for our next article discussing why you should use analytical tools.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.