Shopify SEO tips

Make your website stand out - Ultimate SEO guide

What is SEO?

SEO stands for Search Engine Optimization which is the practice of increasing the quantity and quality of your traffic through organic search.

Organic search stands for actual searches on Google, Yahoo, Bing or other search engines, performed by actual persons. If your page pops up in the results and the person clicks on it, that translates to organic traffic. 

Although all the major search engines will understand the content of your webpage, SEO is giving them more and exact information about your website

Of course the easy way will be paying for a lot of ads on Google and social networks and traffic will pour in, but it can become quite expensive, and paid traffic is not always quality traffic and may not lead to a higher conversion rate.

Two types of SEO?

Yes, SEO can be split into two main types.

  • On-site SEO
  • Off-site SEO

On-site SEO is the practice of optimizing the content and the source code of your website in order to rank higher on search engines.

Off-site SEO represents all the actions taken outside of your website which impact your rankings on search engines.

Improving on-site SEO

Content

The most important part of your website is your content. It is not enough just having some content, it must be quality content in order to rank higher. Think of these search engines (mainly Google) as an actual person. If you have some poor written short content on your website, no-one will be interested in reading any of it, but if your content covers an actual topic of interest and is well enough written to gain one`s interest, then for sure search engines will understand there is some value in there and will rank you higher.

Your content has to be relevant to the user`s intent. All of your keywords and content should work together in such a manner that users and search engines know that by visiting your site will find out exactly what they are looking for.

For example stuffing your website with the word "apple" being out of context, expecting it to drive traffic being a high ranking keyword will not work. Neither Google and the user will not understand if it is Apple or apple (the fruit). Being ambiguous will more likely drag you down instead of going up.

Make sure you do research for your keywords before using them. The best free tool you can find out there is also provided by Google. Google trends.

Your keywords must be relevant to your niche, and blend naturally with your content.

For better results your keywords should be present, if possible, in your <title></title> tag or event your actual domain name.

Make sure to have only one <h1></h1> tag for every page of your site. Search engines get really confused if you are using more of them. Use h2,3,4 instead.

Make your content easy to read and check your grammar. Neither Google or any person out there would not like to read something that is not spelled right.

Include images and videos inside your content because everyone loves images and videos.

Markup and code

Humans love to read quality content, but search engines love to read quality code.

Search engines look for <meta> tags in your website to obtain information about it. Meta tags are snippets of text that describe the page content. Meta tags do not appear on the page, only in the source code. To check of your webpage has meta tags and how they look, just right-click anywhere on the page and select view source. They should be right in the top-part of your code.

Here is an example on how they look.

SEO meta tags

Essentially the most important are the title and description tags. Using them, Google generates the snippet that someone sees when your page pops up in their search results. Social networks also read these meta tags to generate beautiful snippets when sharing content on social media.

If you are using Shopify as a platform, then most likely these meta tags are already in place for almost any theme you chose. In most cases you can find and fiddle with them in a snippet called social-meta-tags.liquid.

Structured data

Structured data is code in a specific format, written in such a way that search engines understand it. Search engines read the code and use it to display search results in a specific and much richer way. You can easily put this piece of code on your website. It increases your chances of getting ranked higher in Google search results. It can display extra information on the search result, including reviews or steps for a tutorial, or the product price or breadcrumbs.

Breadcrumbs are used to help the user know exactly where they are at any time, and search engines also like to know where exactly that specific content is situated in you site. It is a form of navigation through your site.

For Shopify users I have a ready-to-use snippet that you can find at the end of this article. To use it go to your dashboard and select edit code for your theme, go to snippets and select add new snippet, name it "structured-data" or "breadcrumbs" or whatever you see fit, copy-paste the code and save. To use it just put this line of code inside your header.liquid file right before the </header> closing tag:

{% include 'YOUR-SNIPPET-NAME-HERE' %}

Now you have breadcrumb navigation and structured data for every page of your site. Google will love it, and hopefully you too.

Internal navigation

Best practices suggest that you have a well organized internal link structure for a smooth flow through you site. Users and search engines love to easily navigate from one page to another so make sure your navigation is easy to use, but also make sure you do not have to many internal links, because that may become confusing as well. Breadcrumbs are again your best friend.

Make your url`s look friendly. A page url that is full of symbols like ^%&& and meaningless letters will most certainly be left out by any search engine. Also try to keep your url`s short but at the same time long enough to have a meaning.

Images

Images are a key part of your website or shop. Especially shop. People tend to get their hands on products that are best represented visually, so the odds are your site will be full of images. Google and customers like that, but what they do not like are poorly optimized images. Too large images, or images served from unreliable sources, or poor quality images will penalize your SEO and your sales.

All of your images must be served from a reliable cdn. Do not use extra large images if not needed, and always make use of the "alt" attribute of these images. The "alt" attribute help search engines understand what the image is about and help you from a SEO perspective.

Optimization

When a user visits your site, all of the code is served and executed on the client-side, so smaller assets and efficient code will make the difference here. A faster loading website, means users will likely stay on the site, and the bounce rate should likely stay low. Especially for mobile users. 50% of mobile users bounce off websites that have a long loading time.

Plan ahead and do not use lots of javascript if not necessary and pay attention on media content optimization.

Essentially if you visit your website from any device and you like how it works, that means users and search engines will most likely like too.

Improving off-site SEO

Your site is now highly optimized and good-looking with high quality content and navigation, but in order to gain trust and authority, you have to improve your reach outside of your site.

This translates especially into backlinks. Other sites linking to your website. Some of this links will be followed by Google and transfer authority back to your site, some will not be followed, but will still drive traffic to your site.

Building backlinks is a tedious process and can be quite time-consuming. Some of the techniques used are:

  • Guest posting - Write articles on high-authority websites that offer this feature to link back to your website
  • Get mentioned on other websites with the same niche as yours
  • Personally ask for backlinks and mentions from websites with the same niche
  • Write quality content and others will surely mention you when writing related content
  • Answer questions on forums such as Quora

Having a lot of quality backlinks will help you increase your domain authority and trust, telling search engines that your information is trustworthy and high-quality.

Social media

Social media content-sharing is nowadays the primary mean of sharing content around the web. Even if sharing content offer no-follow backlinks to your website, so you will not gain authority from them it is still a great way of making yourself known around the web.

Create business-looking pages and profiles on all social media networks and link them to your site. Share content often and try to reach out to as many people as you can. They will further share your posts and thus one good article for example could reach to thousands or more persons with one single actions.

Ads

Advertising campaigns are indeed the only thing in the business that is quite costly, but if you do them right you only have to run campaigns for a short period of time. Just in a few months you can get enough traction to keep your site on a top position for a long time.

Try to run campaigns on social networks, to increase the number of followers, thus increasing your audience when sharing posts.

The effect of SEO is not immediate. Do not expect to crunch every aspect of Search Engine Optimization in a couple of days and find yourself overnight with millions of visitors and on the first position of Google search results.

It usually takes 3 to 6 months of constantly improving your website, posting new content, making adjustments until you start to gain traction and see some results. Do not give up after just a few days. Keep working, because SEO is free and you can only gain by doing it properly. 

Breadcrumbs and structured data for Shopify

This snippet of code is written specifically to be used with Shopify, but it may as well be used on any other platform. Just replace the {{ liquid code }} with your own content.

{% unless template == 'index' or template == 'cart' or template == 'list-collections' or template == '404' %}
{% assign t = template | split: '.' | first %}
<nav class="breadcrumbs" role="navigation" aria-label="breadcrumbs">
   <ol>
      <li>
         <a href="/" title="{{ shop.name }}">Home</a>
      </li>
      {% case t %}
      {% when 'page' %}
      <li>
         <a href="{{ page.url }}" aria-current="page">{{ page.title }}</a>
      </li>
      <script type="application/ld+json">
         {  
         "@context":"http://schema.org",
         "@type":"BreadcrumbList",
         "itemListElement":[  
            {  
               "@type":"ListItem",
               "position":1,
               "item":{
                  "@type":"Organization",
                  "@id":"{{ shop.url }}",
                  "name":"{{ shop.name }}",
                  "image":"{{ 'logo.png' | asset_url }}"
               }
            },
            {  
               "@type":"ListItem",
               "position":2,
               "item":{  
                  "@context":"http://schema.org/",
                  "@id":"{{ page.title }}",
                  "name":"{{ page.title }}",
                  "description":"{{ page.description }}"
               }
            }
         ]
         }
      </script>
      {% when 'product' %}
     	{% assign current_variant = product.selected_or_first_available_variant %}
       {% if collection.url %}
       <li><a href="{{ collection.url }}">{{ collection.title | split: "-" | first }}</a></li>
       {% endif %}
      <li>
         <a href="{{ product.url }}" aria-current="page">{{ product.title | split: "-" | first }}</a>
      </li>
      <script type="application/ld+json">
         {  
         "@context":"http://schema.org",
         "@type":"BreadcrumbList",
         "itemListElement":[  
            {  
               "@type":"ListItem",
               "position":1,
               "item":{  
               	  "@type":"Organization",
                  "@id":"{{ shop.url }}",
                  "name":"{{ shop.name }}",
                  "image":"{{ 'logo.png' | asset_url }}"
               }
            }, {% if collection.url %} 
            {  
               "@type":"ListItem",
               "position":2,
               "item":{  
               	  "@type":"Collection",
                  "@id":"{{ collection.url }}",
                  "name":"{{ collection.title }}",
                  "image":"{{ collection.image }}"
               }
            },{% endif %}
            {  
               "@type":"ListItem",
               "position":{% if collection.url %}3{% else %}2{% endif %},
               "item":{  
                  "@context":"http://schema.org/",
                  "@type":"Product",
                  "@id":"{{ product.id }}",
                  "name":"{{ product.title | split: '-' | first }}",
                  "image":"{{ product.featured_image.src | img_url: 'master' }}",
                  "description":"{{ short_description[1] | split: '<br />' | first | strip_html | escape |truncatewords: 35 }}",
                  "brand":{  
                     "@type":"Organization",
                     "name":"{{ product.vendor }}"
                  }
               }
            }
         ]
         }
     </script>
     <script type="application/ld+json">
         {
         	"@context": "http://schema.org",
         	"@type": "Product",
         	"brand": {
         		"@type": "Brand",
         		"name": {{ product.vendor | json }}
         	},
         	"sku": {{ product.selected_or_first_available_variant.sku | json }},
            "gtin13": {{ current_variant.barcode | json }},
         	"description": {{ short_description[1] | split: '<br />' | first | strip_html | escape |truncatewords: 35 | json }},
         	"url": "{{ product.url | within: collection | prepend: shop.url }}",
         	"name": {{ product.title | json }},
         	"image": "https:{{ product.featured_image | product_img_url: 'x100' }}",
         	"offers": {
         		"@type": "Offer",
                "@id":"{{ product.id }}",
         		"price": "{{ product.selected_or_first_available_variant.price | money_without_currency | replace: ",", "." }}",
         		"priceCurrency": "{{ shop.currency }}",
         		"availability": "{%- if product.selected_or_first_available_variant.available -%}InStock{%- else -%}OutOfStock{%- endif -%}",
         		"itemCondition": "http://schema.org/NewCondition",
         		"url": "{{ product.url | within: collection | prepend: shop.url }}"
         	}
         }
      </script>
      {% when 'collection' and collection.handle %}
      <li>
         <a href="{{ collection.url }}" aria-current="page">{{ collection.title | split: "-" | first }}</a>
      </li>
      <script type="application/ld+json">
         {  
         "@context":"http://schema.org",
         "@type":"BreadcrumbList",
         "itemListElement":[  
            {  
               "@type":"ListItem",
               "position":1,
               "item":{
                  "@type":"Organization",
                  "@id":"{{ shop.url }}",
                  "name":"{{ shop.name }}",
                  "image":"{{ 'logo.png' | asset_url }}"
               }
            },
            {  
               "@type":"ListItem",
               "position":2,
               "item":{  
                  "@context":"http://schema.org/",
                  "@type":"Collection",
                  "@id":"{{ collection.title }}",
                  "name":"{{ collection.title }}",
                  "description":"{{ collection.description | strip_html | escape |truncatewords: 35 }}"
               }
            }
         ]
         }
      </script>
      {% when 'blog' %}
      <li>
         <a href="{{ blog.url }}" aria-current="page">{{ blog.title }}</a>
      </li>
      <script type="application/ld+json">
         {  
         "@context":"http://schema.org",
         "@type":"BreadcrumbList",
         "itemListElement":[  
            {  
               "@type":"ListItem",
               "position":1,
               "item":{  
                  "@type":"Organization",
                  "@id":"{{ shop.url }}",
                  "name":"{{ shop.name }}",
                  "image":"{{ 'logo.png' | asset_url }}"
               }
            },
            {  
               "@type":"ListItem",
               "position":2,
               "item":{  
                  "@context":"http://schema.org/",
                  "@type":"Blog",
                  "@id":"{{ blog.title }}",
                  "name":"{{ blog.title }}",
                  "description":"{{ blog.title }}"
               }
            }
         ]
         }
      </script>
      {% when 'article' %}
      <li>{{ blog.title | link_to: blog.url }}</li>
      <li>
         <a href="{{ article.url }}" aria-current="page">{{ article.title }}</a>
      </li>
      <script type="application/ld+json">
         {
         	"@context": "http://schema.org",
         	"@type": "BlogPosting",
         	"mainEntityOfPage": {{ canonical_url | json }},
         	"headline": {{ article.title | json }},
         	"author": {
            	"@type": "Person",
            	"name": {{ article.author | json }}
         	},
         	"publisher": {
         			"@type": "Organization",
         			"name": {{ shop.name | json }},
                        "logo": {
                                  "@type": "ImageObject",
                                  "name": "Logo",
                                  "height": "60",
                                  "url": "{{ 'logo.png' | asset_url }}"
                              }
         	},
         	"image": {
         		"@type": "ImageObject",
         		{%- if article.image -%}
         			"url": "https:{{ article | img_url: '1024x1024' }}",
         {%- else -%} {%- assign ZFWSKEEWXF = article.content | escape -%} {%- if ZFWSKEEWXF contains '&lt;img' -%} {%- assign ZFWSKEEWXF = ZFWSKEEWXF | split: 'src=&quot;' -%} {%- assign ZFWSKEEWXF = ZFWSKEEWXF[1] | split: '&quot;' -%} {%- assign ZFWSKEEWXF = ZFWSKEEWXF[0] | remove: '//cdn' -%} {%- assign ZFWSKEEWXF = ZFWSKEEWXF | remove: 'http:http://' -%} {%- assign ZFWSKEEWXF = ZFWSKEEWXF | remove: 'https:' -%} {%- assign ZFWSKEEWXF = ZFWSKEEWXF | prepend: 'https://cdn' -%} {%- capture QSGMYKOWFQ -%}_1024x1024.{%- endcapture -%} {%- assign QUGEOYMPTW = 'pico icon thumb small compact medium large grande 1024x1024 2048x2048' | split:' ' -%} {%- for EMWIDMOYQI in QUGEOYMPTW -%} {%- capture GFDHKYYEOT -%}_{{ EMWIDMOYQI }}.{%- endcapture -%} {%- assign ZFWSKEEWXF = ZFWSKEEWXF | replace:search,replacement -%} {%- endfor -%}
         				"url": "{{ ZFWSKEEWXF }}",
         			{%- else -%}
         				"url": "https://cdn.shopify.com/s/images/admin/no-image-grande.gif",
         			{%- endif -%}
         		{%- endif -%}
         		"height": "1024",
         		"width": "1024"
         	},
         	"datePublished": "{{ article.created_at }}",
         	"dateModified": "{{ article.published_at }}",
         	"description": {{ article.excerpt_or_content | strip_html | json }},
         	"articleBody": {{ article.content | strip_html | json }}
         }
      </script>
      <script type="application/ld+json">
         {  
         "@context":"http://schema.org",
         "@type":"BreadcrumbList",
         "itemListElement":[  
            {  
               "@type":"ListItem",
               "position":1,
               "item":{  
                  "@type":"Organization",
                  "@id":"{{ shop.url }}",
                  "name":"{{ shop.name }}",
                  "image":"{{ 'logo.png' | asset_url }}"
               }
            },
            {  
               "@type":"ListItem",
               "position":2,
               "item":{  
                  "@context":"http://schema.org/",
                  "@type":"Blog",
                  "@id":"{{ blog.title }}",
                  "name":"{{ blog.title }}",
                  "description":"{{ blog.title }}"
               }
            },
            {  
               "@type":"ListItem",
               "position":3,
               "item":{  
                  "@context":"http://schema.org/",
                  "@type":"Article",
                  "@id":"{{ artile.title }}",
                  "name":"{{ article.title }}",
                  "headline": {{ article.title | json }},
                  "author": {
                  "@type": "Person",
                  "name": {{ article.author | json }}
                  },
                  "publisher": {
                          "@type": "Organization",
                          "name": {{ shop.name | json }},
                          "logo": {
                                    "@type": "ImageObject",
                                    "name": "Logo",
                                    "height": "60",
                                    "url": "{{ 'logo.png' | asset_url }}"
                                }
                  },
                  "image": {
                      "@type": "ImageObject",
                      {%- if article.image -%}
                          "url": "https:{{ article | img_url: '1024x1024' }}",
          {%- else -%} {%- assign ZFWSKEEWXF = article.content | escape -%} {%- if ZFWSKEEWXF contains '&lt;img' -%} {%- assign ZFWSKEEWXF = ZFWSKEEWXF | split: 'src=&quot;' -%} {%- assign ZFWSKEEWXF = ZFWSKEEWXF[1] | split: '&quot;' -%} {%- assign ZFWSKEEWXF = ZFWSKEEWXF[0] | remove: '//cdn' -%} {%- assign ZFWSKEEWXF = ZFWSKEEWXF | remove: 'http:http://' -%} {%- assign ZFWSKEEWXF = ZFWSKEEWXF | remove: 'https:' -%} {%- assign ZFWSKEEWXF = ZFWSKEEWXF | prepend: 'https://cdn' -%} {%- capture QSGMYKOWFQ -%}_1024x1024.{%- endcapture -%} {%- assign QUGEOYMPTW = 'pico icon thumb small compact medium large grande 1024x1024 2048x2048' | split:' ' -%} {%- for EMWIDMOYQI in QUGEOYMPTW -%} {%- capture GFDHKYYEOT -%}_{{ EMWIDMOYQI }}.{%- endcapture -%} {%- assign ZFWSKEEWXF = ZFWSKEEWXF | replace:search,replacement -%} {%- endfor -%}
                              "url": "{{ ZFWSKEEWXF }}",
                          {%- else -%}
                              "url": "https://cdn.shopify.com/s/images/admin/no-image-grande.gif",
                          {%- endif -%}
                      {%- endif -%}
                      "height": "1024",
                      "width": "1024"
                  },
                  "datePublished": "{{ article.created_at }}",
                  "dateModified": "{{ article.published_at }}",
                  "description": {{ article.excerpt_or_content | strip_html | json }},
                  "articleBody": {{ article.content | strip_html | json }}
               }
            }
         ]
         }
      </script>
      {% else %}
      <li aria-current="page">
         <a href="{{ request.path }}" aria-current="page">{{ page_title }}</a>
      </li>
      {% endcase %}
   </ol>
</nav>
{% endunless %}
<style>
   .breadcrumbs {
   font-size: 13px;
   margin: 0 2em 2em;
   text-align: center;
   text-transform: uppercase;
   color: #989898;
   letter-spacing: 1px;
   }
   .breadcrumbs ol {
   list-style-type: none;
   margin: 0;
   padding: 0;
   }
   .breadcrumbs li {
   display: inline-block;
   }
   .breadcrumbs a {
   position: relative;
   text-decoration: none;
   transition: 0.3s;
   padding: 10px 0;
   }
   .breadcrumbs a:before {
    content: "";
    position: absolute;
    width: 0;
    height: 2px;
    bottom: 5px;
    left: 0;
    background-color: #989898;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
   }
   .breadcrumbs a:hover{
   color:#C0C0C0;
   }
  .breadcrumbs a:hover:before{
   background-color: #C0C0C0;
   visibility: visible;
   width: 100%;
   }
   .breadcrumbs ol li:last-of-type {
   pointer-events: none;
   }
   .breadcrumbs ol li:not(:last-of-type):after {
   content: "›\00a0";
   display: inline-block;
   padding-left: .25ch;
   speak: none;
   font-size: 20px;
   margin-right: -0.5ch;
   }
   .breadcrumbs [aria-current="page"] {
   color: inherit;
   font-weight: normal;
   text-decoration: none;
   }
   .breadcrumbs [aria-current="page"]:hover,
   .breadcrumbs [aria-current="page"]:focus {
   text-decoration: underline;
   }
</style>

Leave a comment

Please note, comments need to be approved before they are published.