King Linked Options
  • Getting Started
  • Video Instruction
  • How to add King Linked Options app block to a theme
  • How to add King Linked Options app embed block to a theme
  • How to change the position of app block
  • How to enable app block in the theme
  • How to customize app block appearance?
  • How to create a multi-option product group
  • How to Duplicate Product Groups in King Linked Options
  • How to display as Image swatch in product page but color swatch in collection page
  • How to create product group
  • 👥FAQ
    • Does it support multi-color swatch
    • Can it temporarily hide app block
  • How to display the option correctly in the product details page generated by Pagefly
  • How to display the option correctly in the product details page generated by Gempages
  • How to display the option correctly in the product details page generated by Ecomposer
  • Can option styles be customized?
  • How to import the products into the existing group
  • Description of the contents of the single option group CSV import file
  • Show linked options on the Collection page:
  • Hide specific multi-options
  • Customize Linked Option Styles on the Collection Page
  • How to configure automatic page scroll positioning
Powered by GitBook
On this page

How to display the option correctly in the product details page generated by Pagefly

PreviousCan it temporarily hide app blockNextHow to display the option correctly in the product details page generated by Gempages

Last updated 1 year ago

If you use Pagefly to generate product pages, you may find that our option is in the top left corner of the page, which is not what we want.

To display the option in the correct position, we need to follow these steps:

Step 1: Open the PageFly app and navigate to the template editor.

Step 2: Find the Product Detail Section and select it, then click the Add Element button to add an HTML/Liquid element.

Step 3: Click the Open code editor button on the right panel and copy the following code snippets into the code editor.

<div class="linked-option-variants-container"></div>
option's default position in pagefly
Add a HTML/Liquid element
Open code editor
Copy code snippets to code editor
Save and publish