In this article, you will learn how to use Frequently Bought Together element.
In order to use this element, you will need to install Frequently Bought Together app from Shopify Store and go to PageFly to use the element.

Install Frequently Bought Together

Install PageFly

About Frequently Bought Together element

Frequently Bought Together enables you to offer customers some related products that customers can buy with one single click. You can use Frequently Bought Together element to create group product for your Shopify Product page with PageFly.

Before using this element, you have to install the Frequently Bought Together app to your store and configure all options in the app and then come back to PageFly to use the element(s) for the product(s) or page(s) you want.

Access the Frequently Bought Together element

Step 1: Create a section with Product Details Element.

Go to Add Shopify element in the left toolbar > Click on the Product Details element in the dropdown menu > Drag and drop the element into the page editor and then start editing it.
You can find more details of the Product details element here.

Step 2: Add Frequently Bought Together Element

First, go to Add third party element in the left toolbar > Click on the Edit your 3rd party elements button. In Integrations popup page, you can search “Frequently bought together” on the search bar.

After that, drag the Frequently bought together element onto the page.

Styling configuration

You can customize the styling of the Frequently bought together element in the Styling Tab.

You can check more information about the Styling tab here.

Frequently Bought Together Configuration

Step 1 : Set up Frequently Bought Together element by your Shopify Account.

 Go to your Shopify Admin > Apps > Choose Frequently Bought Together to set it up.

Step 2: Set up Product with its Bundle.

1. In the Home page of Frequently Bought Together, scroll down to choose Manual Bundles.
2. Choose Select a Product to check it bundle.
3. Scroll down to choose “Select products to add to this bundle”

After configuring, there will be completed status “The Products has been added to the manual recommendations”

Step 3: Set up Bundle Discount.

1. In the Manual Bundles, scroll down to Bundle Discount.
2. Tick for Add a discount for this bundle.
3. There are 4 Discount Type that are: Percentage, Fixed Amount, Cheapest Items for Free, Freeshiping. Choose 1 and continue to set up related information.
4. Choose Save.

Step 4: Set up widget location for “Frequently Bought Together” element.

1. In Manual Bundles, go to the breadcrumbs > Quick Navigation > choose Advance Preferences.
2. Choose Change Widget Location.

By default, Frequently Bought Together element will be automatically located in the end of your product page, but  if you prefer to select its location yourself, use this option to configure it.

3. In the Widget Location Seletor, add this code: [data-pf-type=FrequentlyBought]
4. Choose your Widget Placement > Save. 

Now, come to your PageFly, hit Save & Publish again your Product page to view in Live page.