When importing a product page into Shogun from Shopify, you have the option to use either a "Custom Layout" or an "Existing Layout."
This guide will cover the difference between the two layouts. For information on how to import and edit your product pages, please refer to the guide below.
The Custom Layout option does not use your theme's product page layout. This layout allows you to create a completely custom product page by presenting you with an empty Product Box to place elements within. This will make use of the
product.shogun.custom liquid template file in your theme.
You can use Shogun elements to build your product page from the ground up! By dragging Shogun's Product fields into the page, you can display the product's details anywhere within the page's content area.
- The Custom Layout page type starts with a Product Box already on the page. Because of this, dragging additional Product Boxes into the content area is unnecessary, unless you'd like to display additional products within the same page.
- The Custom Layout does not use the theme's default template nor contain the theme's product components. Third-party product applications (swatches, bundles, subscriptions, etc.) will not automatically appear in this layout type. In some cases, it is still possible to include third-party applications in the Custom Layout if an all HTML embed code is available for that app.
Tip: Once you've created a Custom Layout you like, you can save it as a Snippet to quickly & easily re-use that layout on other imported product pages.
The Existing Layout option leverages the theme's default product template, the
product.liquid template file. This allows the product page to retain its original layout upon importing. The existing layout option also retains any third-party app functions specific to Shopify product pages (swatches, bundles, subscriptions, etc.).
When choosing the existing product layout, Shogun adds a drop zone in the product description area and two custom drop zones above & below the main content area.
The "Main" dropzone is what's known as the theme's product description. The "Above" and "Below" dropzones are custom full-width regions that allow you to add extra dynamic content into your product page.
You can also view the contents of each dropzone using the Layout panel in the right sidebar. Please note that the "Above" and "Below" sections will only appear in the Layout panel when an element is placed in them.
Note: The location of the product description and drop zones may vary based on your theme's default product template. With the assistance of a developer, it is possible to change the locations of these drop zones by modifying your theme.