Advanced Guide to Shopify: How to Sell Online in 2020

If you’ve laid hands on Shopify — if you haven’t, read our Shopify beginner’s guide — you’ve probably encountered some bug or problem that the usual channels can’t help you with. It could be an app that’s acting funny, or some kind of functionality that nobody has ever thought of before. Getting Shopify to work right in these cases can be a real pain.

Those scenarios are frustrating, but sadly, they’re the sore truth if you’re working in the Shopify environment. Don’t worry, though, CommQueR.com is here to help.

In this advanced guide to Shopify, we’re going to run you through more advanced things about Shopify. We’ll explain how to pick the right theme and how to customize its structure and design. On top of that, we’ll show you how to handle products the right way and which apps you should consider installing. Let’s get started.

How to Pick the Right Theme for Shopify

First, we’re going to explain to you what a theme is. Think of it as the facade of your store. You won’t decide what your shop will look like based on your theme, but you’ll guide it in a certain direction.

It’s important that you think about the theme you’ll be using before you start building your shop because doing so will save you time and money later. For example, if a theme comes with a built-in sidebar functionality, you don’t need to customize that later because you can add it to your store with no effort.

At CommQueR.com, we’ve created a handy checklist that makes it easy for you to choose the right theme.

Theme Criterion 1: Business Requirements

As banal as it sounds, your business’s requirements are important when choosing a theme. As we said in our article on how to build a website from scratch, everything starts with a draft.

Think about your requirements first and make a list of things you think are necessary for your shop. Here’s a short list of questions we suggest asking when considering Shopify themes:

• How do you want your customers to navigate through your store
• Should there be a search function
• Would you like to have a sidebar with navigation
• Do you need a mega menu
• How large is your product portfolio
• How would you like to promote your shop later
• Do you need a top-page slider
• Should the shop be equipped with a blog

The product portfolio point is especially important. Depending on how many products you want to display in your store, your theme should support you and not block or hinder you. Basically, there are three portfolio sizes in the Shopify world: single-product, small catalog and large catalog.

You can find themes in the Shopify Theme Store, and if you look, you can find their respective features, including the product portfolio size, in the description of each theme.

If you like a theme that doesn’t cover all your requirements, prioritize. It’s unlikely that one theme will meet all your needs.

Theme Criterion 2: Search Engine Optimization

Because you may not want to place paid ads all the time, you should also think long-term about organic marketing. It makes sense to check some of the most important technical search engine optimization criteria in advance, such as:

• First-view loading time
• Page speed mobile
• Page speed desktop
• Cross-browser compatibility

You can test the page speed with PageSpeedInsights from Google. That said, because this is time-consuming and may not be possible for all themes — you have to buy some of them — you can do research on the internet in advance.

Theme Criterion 3: Price

Unfortunately, money doesn’t grow on trees, and as an entrepreneur, you have to keep an eye on your costs. That’s why the old question arises: free or buy?

We could advise you to work with paid themes, but that’d only be half the truth. Most paid themes are better in terms of functionality. Period. You’ll have to decide for yourself whether it’s worth purchasing a paid theme based on what you plan to do with your store.

If you’re leaning toward a free design, that’s fine, too. That said, you should ask yourself how many apps, which are similar to plugins in WordPress, you’ll have to install afterward because most cost money and worsen the loading time of your store. Maybe it makes more sense to start with a paid theme than with a free one that you have to equip with apps.

A best practice, especially for beginners, is to stick with free themes because it’s easier to get support from Shopify than from third-parties. We’ll explain what that means ahead.

Theme Criterion 4: Support

Support and documentation are an important criterion for choosing the optimal Shopify theme. Shopify offers support for the following themes:

• Boundless
• Minimal
• Jumpstart
• Supply
• Pop
• Debut
• Simple
• Venture
• Brooklyn
• Narrative

If you choose a theme other than the ones listed, you’ll be dependent on third-party developers. That means Shopify can’t provide much support when it comes to the details of the theme.

That said, you need to check how much support Shopify provides in general. Usually, when it comes to technical issues and profound customizing, which is quickly the case with Shopify, the service, like third-party providers, will charge you or forward you to a third-party provider, which, again, will let you pay for its work.

Documentation is also important. Have a look at how documented the themes are. You’ll be surprised how diverse the quality of theme documentation is. Especially with paid themes, quality varies a lot. You can find the link to each theme’s documentation in the Shopify Theme Store.

Theme Criterion 5: Reviews

Last but not least: trust the crowd. You’re not the first to open a Shopify store. Take your time and read the reviews.

Don’t let bad reviews discourage you too much from using a certain theme, though. In many cases, users’ comments are ignorant or an expression of frustration that’s dropped in the review section, as we can see in the screenshot below.

“Swagger Boutique” complains about the Debut theme. The statement that the pictures don’t adapt on the phone is nonsense. All Shopify themes are responsive to current standards. That’s why you should follow our advice and take a closer look at the reviews before you make your decision.

Customization: Pushing Pixels with Liquid

Now that you’ve chosen the theme you want, we’re going to tell you how you can use Liquid to customize it to suit your needs. It’s important to note that if you start customizing, you should stick with your theme because any changes, customization and design work you’ve done will be lost when you switch themes.

Simply put, you’d have to do the development work again. Try to only use one theme from the beginning and make it password-protected.

Important advice: be sure to make multiple copies of your theme. Ideally, you should make regular backups and name them accordingly, especially if you install apps.

To save you from a potential disaster, we’re going to show you how to develop in Shopify using Liquid. In the next few sections, we’ll take a closer look at the most important components of the Shopify development environment.

If you need more information on Liquid coding, take a look at the official Liquid reference or contact a developer.

The Basics of Customizing

Let’s kick it off with some basics.

To access the customizing menu of your store, click “online store.” A menu should appear with the following items: “themes,” “blog posts,” “pages,” “navigation,” “domains” and “preferences.” Click “themes” to proceed.

On the right side of the screen, you’ll see two large areas: “current theme” and “more themes.” In the “current theme” area, you’ll find, well, the currently active theme. The other area shows the themes you’ve downloaded from the theme store.

To the right of the theme is “customize.” Click it to access the customizing menu.

You’re now in the customizing menu, where you can make the desired changes to your theme. On the left side, you’ll see your control panel, with which you can edit the individual sections of the active page.

Next to “sections,” you;ll find the “theme settings” area, where you can adjust the general settings for the theme, such as font, colors and icons.

That’s also where you’ll find the documentation for your theme and the contact details for support.

You can also dive into the theme’s Liquid code under “theme actions” > “edit code” for deeper customizing. We’ll talk more about that later.

In the top bar, you can see the name of the theme you’re editing. You’ll see a menu where you can jump between the pages you want to customize.

Next to that menu, you can choose between the desktop version and the mobile version.

It’s important to note that if you’re in the process of customizing, digging through the documentation and realizing you did everything right, but the feature still doesn’t work, that may be because some features in Shopify, especially apps, only work if the theme is published.

Sections: Piece by Piece to a Beautiful Shop

“Sections” are reusable building blocks that you can use to build and design your Shopify homepage. There’s no way to use them on pages other than the landing page, though. To learn how important a landing page is, read our guide on how to use Instapage.

Basically, Shopify distinguishes between static and dynamic sections. Static sections are, as the name suggests, statically built into the theme. The header and footer are good examples of static sections. They can’t be added in the customizing menu. You can only insert them through programming.

Dynamic sections, on the other hand, are the building blocks that you can dynamically add in the customizing editor. You do so by selecting “add section.”

After that, you should see a list of the available sections for your theme.

Don’t be surprised if your list looks different than ours. There are sections that most themes have in common, but many also have their own special sections.

Choose the right section and select it. An “add” button should appear next to the name. The section is also displayed in the preview function.

If you want to insert the section, hit the “add” button.

The question is why Shopify differentiates between static and dynamic sections if we can only use sections on the homepage. We suspect that Shopify is working on using the section functionality on other pages, as well.

Theme.scss.liquid: The Heart of Your Look and Feel

Now that you know how to change the structure of your landing page, we’re going to show you how to modify its appearance. To do so, click “theme actions,” then select “edit code.”

After that, you should see the following interface:

There, you can see a lot of files divided into seven large folders:

• Layout
• Templates
• Sections
• Snippets
• Assets
• Config
• Locales

The “assets” folder is especially interesting for us.

Open the “theme.scss.liquid” file.

In most cases, the file is several thousand lines of code long. In our example, there are 7,098 lines of code. That’s because all the styling is done in it. If you want to make CSS changes, do yourself a favor and do it there.

Shopify Products: Handling Products Like a Pro

Now that you know how to change the look of your shop, we’re going to talk about what’s inside of it: products. We explained how to create products in our beginner’s guide. Now, we’re going to go deeper and talk about variants and options.

All products can have variants, though they don’t have to. Each variant has different options, otherwise the variants wouldn’t make sense. A common example is the color variant:

As you can see in the screenshot above, you can equip the same product with different colors without having to create a new product for each one, which is handy.

How to Import Products in Shopify

If you have a store with a large number of products, you may not want to add each product individually to your shop. That’s why Shopify offers a bulk import feature.

In the main menu of Shopify, click the “products” tab on the left to enter the product menu.

Hit “import.”

You should see a window where you can download a .csv file template for the import. Fill it with your products and upload it again. Because the fields in the template are confusing, we recommend that you use the official Shopify explanation while filling it out.

Here are more expert tips to make your import work easier:

• If you import a lot of products, first upload the product images to Shopify. That’ll ensure that the images already have a Shopify URL, which you’ll need to write in to the upload file. Otherwise, you’ll have to manually assign all images to the products and variants.

• For products with variants, you have to leave certain fields empty so that Shopify will create them as variants and not as standalone products.

• Beware of the Excel trap. Excel uses semicolons as separators for .csv files by default, but Shopify doesn’t. Make sure that the upload file is separated by commas and not by semicolons.

• It’s also important that you put lists and enumerations in quotation marks and that you use periods rather than commas to indicate sizes and prices.

Apps: Useful Enhancements for Shopify

Like plugins in WordPress, apps in Shopify are functional extensions that you have to install separately. Some are free, and some aren’t. If WordPress is all Greek to you, we’ve prepared a few WordPress guides:

1. Beginner’s Guide to Using WordPress
2. Intermediate Guide to Using WordPress
3. Advanced Guide to Using WordPress

Here are our top Shopify apps:

Kit: Run Better Facebook Ads

Kit is an app that was developed by Shopify to help you improve your Facebook marketing. Not only is it free to use, but it also acts as a virtual assistant and makes regular Facebook Messenger suggestions for getting more traffic to your online shop. It’s a must for anyone who does Facebook marketing for their store.

Oberlo: Find Products to Sell on Shopify

Oberlo is the perfect companion for those who want to do dropshipping with their online store. The app is connected to several dropshipping marketplaces, such as AliExpress, and allows for an easy product import into your Shopify store.

All you have to do is install the app to browse thousands and thousands of products and import them into your online store with a single click. After customers place an order at your online store, you only have to place an order in Oberlo to send the products to the customer directly from the supplier.

Hotjar: Truly Understand How Your Visitors Interact on Your Site

Hotjar is a useful tool that you can use to create heat maps for your online store. It also gives you the ability to view recordings of your visitors navigating your shop.

The app makes a lot of sense because it enables you to identify the parts of the website that work well and those that are ignored by most visitors. That’s especially important for your online store because you want to find out which products are viewed but not bought, for example. That makes Hotjar one of the best lead generation tools on the market.

You can learn how it works in detail and how you can integrate it into your store on the Hotjar website.

Bold Custom Pricing: Sales and Conversion Optimization

Bold Custom Pricing was developed by Bold Commerce, which is a big player in the Shopify environment and has developed many useful apps. We’re especially interested in Bold Custom Pricing because it allows you to enable volume discounts and other pricing gimmicks. Above all, you can create customer groups and reward loyal customers with the appropriate discounts.

One big downside of the app is that Bold Commerce changes a lot of your theme to make Bold Custom Pricing work smoothly. Many .liquid files, such as product-template.liquid, will look different and be difficult to maintain. You’ll be dependent on Bold Commerce support.

More Hints on Apps

Each app changes the code of your theme. Be sure to make a backup before installing any app. If you don’t know where to look for a good backup service, read our online backup services.

If you have several apps installed in your store, it may face problems installing additional ones. In most cases, that’s because the themes and possibly the apps already installed differ from store to store and change the code in such a way that there’s no standardized way of installing additional apps.

That’s also the reason you shouldn’t try to install multiple apps at once. You’ll lose track of the changes quickly. Take your time and install one app at a time.

You should avoid giving support teams immediate access to your store, too. Otherwise, you won’t know which app is installed and integrated and which isn’t.

Final Thoughts

We hope we gave you useful tips and tricks with this in-depth Shopify guide. Shopify is a useful and good platform for starting an online store in the blink of an eye, especially if you don’t know how to code.

That said, if you have advanced tech skills, Shopify becomes a powerful and customizable ally that can be designed for almost any online business.

If you have more basic questions, our beginner’s guide, which is linked at the top of this article, is best for you. If you have further questions, feel free to ask them in the comments. Thank you for reading.