All Collections
Zipify Pages - Tutorials & Documentation
Mini-Guides
How to Redirect a Product page to a Landing page [Zipify Pages]
How to Redirect a Product page to a Landing page [Zipify Pages]

Learn how to redirect a Product page to a Zipify Page's Landing page without un-publishing your product page.

Jeff Maxfield avatar
Written by Jeff Maxfield
Updated over a week ago

Overview

If you're setting up a redirect from a Product page in the Online Store > Navigation > URL Redirects section of the Shopify admin panel, you need to keep in mind that URL redirects can only be used on URLs that would otherwise lead to a 404 Not Found page. There's no way to redirect valid URLs. 

Typically, this would require the Product to be deleted from the store so the redirect could be setup, but we obviously don't want that to happen. So we came up with a workaround method to accomplish this instead. 

If you'd like your Shopify Product page (/products) to redirect to a Zipify Page (/pages) without setting up a Redirect in your Shopify admin, follow the steps below. 

Note: Use at your own discretion. Adding this workaround is an unsupported customization that is outside the scope of our support service. This means that we're not able to help you if you run into problems. We do not take responsibility for how implementing this change on your store will affect your conversion tracking or SEO. 

Redirect Product page

1) Within your Shopify admin, go to Online Store > Themes > Actions > Edit code

2) Under the Templates section, click the "Add a new template" link to add a new template file. 

3) Add a new Product template and name it accordingly I.e. redirect.product or whatever you'd like to name it.

4) Add this redirect code to the very top of the new template file, above all other code listed there:

{% if product.handle == "product-handle" %}
<script>// <![CDATA[
window.location.replace("Zipify Page URL");
// ]]></script>
{% endif %}

Where product-handle is listed in the script above, enter your default product page handle. For example, if your product page URL is https://www.boombycindyjoseph.com/products/boomstick-glo then the product-handle is boomstick-glo

Where Zipify Page URL is listed in the script above, enter the URL of the published Zipify Page that you want to redirect to. For example, https://www.boombycindyjoseph.com/pages/boomstick-glo123

Given the two URLs above, the final code to use for this redirect would be:

{% if product.handle == "boomstick-glo" %}
<script>// <![CDATA[
window.location.replace("https://www.boombycindyjoseph.com/pages/boomstick-glo123");
// ]]></script>
{% endif %}

Make sure to include the quotation marks around the product-handle and URL within the script, just as it's shown above. Then Save the new product template file. 

Note: If you want to set this up for multiple products, then you can add multiple entries of the code above to the new product template file you create. You just need to ensure that the product-handle and Zipify Pages URL for each entry added is correct. 

5) Go to the Products section of your Shopify admin and open the product that you want to be redirected to the ZP page. Assign the new Template file you just created to the product in the Theme templates section and Save

6) Test out the redirect by viewing your product page as you normally would to ensure it redirects properly. 

When someone goes to the default Product page, the script replaces the current source URL with the new one specified in the script I.e. your Zipify Pages page URL. This way no initial URL is stored and so the customer can't click the Back button in a web browser and get to the default product page.

Redirect Collection page

To redirect a published Collection page (collections/all for example), the idea and code is very similar to the steps described about for redirecting a Product page to a Landing page.

1. Open the Collections template file that the collection you want to redirect away from is currently using. In most cases, this will be the default collection.liquid file in the Templates folder of your Theme.

2. At the very top of this file (above all other code included) add the following code:

{% if collection.handle == "collection-handle" %}
<script>// <![CDATA[
window.location.replace("Zipify Page URL");
// ]]></script>
{% endif %}

Where collection-handle is listed in the script above, enter your collection page handle that you want to redirect away from I.e. if your collection page URL is https://www.boombycindyjoseph.com/collections/all then the collection-handle is all

Where Zipify Page URL is listed in the script above, enter the URL of the published Zipify Page that you want to redirect to I.e. https://www.boombycindyjoseph.com/pages/shop

Given the two URLs above, the final code to use for this redirect would be:

{% if collection.handle == "all" %}
<script>// <![CDATA[
window.location.replace("https://www.boombycindyjoseph.com/pages/shop");
// ]]></script>
{% endif %}

3. Make sure to include the quotation marks around the collection-handle and URL within the script, just as it's shown above. Then Save the collection template file.

As you can see, the idea is the same as before, but dealing with the Collection page instead of a Product page.

Did this answer your question?