How to Run Shopify on a Subfolder

If you’re already familiar with why you might want to acheive this you can jump straight to the server setup.

Running Shopify from a subdirectory can be useful

Do you run your main website on a platform like WordPress but would like to run Shopify in a subfolder (subdirectory)?

You might be in a position where you would like to leverage the fantastic capabilities of the Shopify platform for your e-commerce needs and also harness the flexibility and power which WordPress offers for other aspects of the site.

For example, we’re currently working on a very large platform build for a partner who’s main site has to offer forums, member registration, live member to member chat, automatically updating world rankings, over 100k+ venue listings and more….plus e-commerce.

WooCommerce has its place but not for a platform of this scale as they plan on selling upwards of 50k+ products which require a platform like Shopify to manage it.

Running Shopify on a subdomain isn’t an option we’re willing to work with due to the continued benefits of keeping key parts of the site on the same domain for SEO benefits that Google extends to that setup.

Of folks who’ve written to me about it:
Switch from blog.subdomain.tld to subdomain.tld/blog immediately improved rankings: 7
The reverse: 0

— Rand Fishkin (@purpleimp.comrandfish) January 10, 2017

How to use Shopify on a WordPress subfolder / subdirectory setup:

Below is a server configuration which will show you how to ‘install’ Shopify in a subfolder of WordPress in minutes.

As Shopify is a self-hosted platform you can’t actually install it in a subfolder but you can allow users to access your Shopify e-commerce store on www.yourdomain.com/shop/ (even if you have WordPress hosted on your main domain) by using a reverse proxy.

Our standard servers are Apache servers used on a Linux system with cPanel installed on them.

Please note before we jump into the setup:

• If you are running a managed server you will need to get your hosting company or server administrator to set the reverse proxies up for you. Typically if you are on a VPS (Vitrual Private Server) or shared hosting this will be the case as you will not have root access to the server
  [break]
• If you are running an unmanaged or dedicated server and have root access then you will have permissions to set up the reverse proxies yourself though some technical knowledge of server configuration is required which is detailed below
  [break]
• You will need a Secure Certificate (SSL) for your domain

You can leave your Shopify url as the default staging name (for example https://test-ecom-build.myshopify.com) but you more likely want to set up a subdomain to make it tidier (for example: https://shopify.yoursite.com)

How to use Shopify on a WordPress subfolder / subdirectory server setup:

Follow the 7 steps below to run Shopify from a subfolder:

1. Make sure that mod_proxy is installed:
   [break]

   httpd -M | grep -i 'proxy'

   [break]

2. As this is a cPanel server we had to add the changes to a custom Vhost include at:
   [break]

   /usr/local/apache/conf/userdata/ssl/2_4/YourcPanelName/yourdomain.com/proxy_pass.conf

   and

   /usr/local/apache/conf/userdata/std/2_4/YourcPanelName/yourdomain.com/proxy_pass.conf

   [break]

3. In order to enable this custom Vhost we have to run:
   [break]

   /scripts/ensure_vhost_includes --user=cPanel-User

   [break]Note: change ‘cPanel-User’ to the actual cPanel username’
   [break]

4. After that we could then add the custom rules in the file:
   [break]

   /usr/local/apache/conf/userdata/std/2_4/YourcPanelName/yourdomain.com/proxy_pass.conf

   [break]

5. The rules that we use are straightforward:
   [break]

   SSLProxyEngine onProxyPass "/store/" "https://shopify.yoursite.com/"
   ProxyPassReverse "/store/" "https://shopify.yoursite.com/"

   [break]

6. Then test for any syntax errors:
   [break]

   service httpd configtest

   [break]

7. If you get ‘Syntax OK’:
   [break]Then it is alright to restart apache so it can pick up the new changes at the custom include.

[break]That’s pretty much it regarding the technical server work.

Sidenote: If you are looking for a great hosting company who’ll do this for you anytime you need it (for free) then we can strongly recommend TSO Host for their first class customer service.

You will also want to set up a 301 redirect on the subdomain you chose (https://shopify.yoursite.com) so that if a user visits it directly they are taken to the new reverse proxy version you’ve set up on your subdirectory (https://yoursite.com/store/)

In our next article, we will document how to configure Google Search Console to avoid crawling and indexation of the e-commerce subdomain cannibalising your crawl budget and rankings.

We’ll also document the server setup if you’re running your site from a Nginx server.

If you have any questions or comments please submit them in the comments below