SHOPIFY THEME PREVIEW
Last updated
Last updated
In the context of making modifications and previewing your new theme on Shopify, it's important to note that Shopify only permits you to display the current pages. When you are within the theme editor and crafting templates, these templates are dedicated solely to that particular theme and only able to be visable in the theme editor of that theme to view and edit.
It's only when you publish your theme that you can visually experience the design when you assign the template. This is a standard operation that applies to all Shopify stores. It's a unique aspect of Shopify's design functionality that facilitates a smoother, more controlled approach to theme customization and implementation.
If you're on the brink of launching your online store or considering a fresh new look for it by introducing a new theme, you have the opportunity to gather valuable input from others by offering them a preview of your upcoming design. Creating a preview link for your theme in Shopify enables you to share it with others, even before it's officially published. This means you can collaborate and gather feedback without needing to make the theme live.
The beauty of a preview link lies in its ability to grant others access to explore your online store's new look, while ensuring that they cannot proceed to the checkout stage. Each preview link remains active for a duration of 48 hours, providing a window of time for others to review and provide feedback. Importantly, the creation of new preview links as needed does not interfere with the functionality of previously generated links.
At the heart of this process is the desire to refine and enhance your store's appearance, and sharing a preview link is a powerful tool in achieving this goal. By involving others in the preview stage, you can benefit from fresh perspectives and valuable insights to ensure that your new theme truly resonates with your audience.
If your Shopify theme is in draft mode and you want to view a specific page from that draft, you can easily do so by following these steps:
Go to the Theme Editor:
In your Shopify admin, go to Online Store > Themes.
Find the drafted theme you want to preview. It will be listed under "Theme library."
Click on Actions next to the drafted theme and select Preview.
Preview the Theme:
Once in the preview mode, you can navigate through the site as if the theme were live.
If you want to view a specific page, you can manually navigate to it through the menu or enter the URL path directly after the preview link in your browser’s address bar.
Direct Page Preview:
If you know the exact URL of the page you want to preview (like a product page or collection), you can add it to the preview link. For example, if your store's URL is https://yourstore.myshopify.com
, the preview link might look something like this: https://yourstore.myshopify.com/?preview_theme_id=THEMEID
.
You can append the page path to this link to view specific pages, like: https://yourstore.myshopify.com/collections/all?preview_theme_id=THEMEID
.
This way, you can fully explore how your drafted theme will look and function, ensuring everything is just right before you publish it.
Locate the Custom Page:
If the custom page is not linked in the navigation, you’ll need to manually enter the URL in the browser's address bar while you are in the theme preview mode.
The URL structure will typically be something like this: https://yourstore.myshopify.com/pages/custom-page-name?preview_theme_id=THEMEID
.
Replace custom-page-name
with the actual handle of your custom page. The handle is usually the last part of the URL when you create the page in the Shopify admin.
Get the Page Handle:
To find the handle of the custom page, go to Online Store > Pages in your Shopify admin.
Click on the page you want to preview. The handle is the part after /pages/
in the URL bar when you are editing the page. For example, if the URL is https://yourstore.myshopify.com/admin/pages/1234567890
, the handle is 1234567890
.
Combine the Preview URL:
Combine the preview theme URL with the page handle to view the custom page
Replace custom-page-handle
with the actual handle of your custom page.
By following these steps, you can preview any custom page that’s not live on your store, as long as it’s part of your drafted theme. This allows you to see exactly how your custom pages will look and function before making them live.
It's important to note that you won't have visibility into templates that haven't been assigned unless the theme is live and subsequently linked to specific page templates.