Is the widget layout customizable?

We have two available layouts for Frequently Bought Together. You can change them directly from the preferences pages, inside Visual styles -> Layout. Those two layouts are:

  • Default: Our flagship layout, improving the stores' conversion since 2017

  • Add to cart button at the bottom: The total price and the Add to Cart button are located below the recommendations

Apart from that, mostly all the widget styles are fully configurable so things such as colors, fonts, sizes, or borders can be tuned.

This can be accomplished through these settings from the preferences page within Visual styles section.

Select the widget in the visual selector and click on the 'Advanced Options for the widget' link at the bottom of the section and all the configurations options are displayed.

Top and bottom separation:

The 'Top and bottom separation' option is used to create an empty space/margin on the top and bottom of the app. The value can be adjusted according to the required amount of space

With Padding:

Without Padding:

There will not be any space on the top and bottom of the app.


Background Colour:

As the name implies this option is used to change the background color of the app.

The required colour can be chosen in 3 ways.

  • Leaving it transparent: Clicking on the none button in the color selector will leave the background colour of the app transparent which will help to match the app style with the background colour of the store page.

  • Using the Colour slider: Clicking on the text box will open a colour slider from which you can choose the required colour.

  • Entering the Colour code: If you know the Hex Colour Code # you can enter it in the text box directly. (Example: #FFFFFF for white colour and #000000 for Black)

Maximum Width:

The 'Maximum Width' option is useful for controlling the width of the app widget. These values are in pixel number format.

So according to the entered value, the app's width will be auto-adjusted. 

Border & Border Colour:

Border & Border Colour are used to enable a border for the app and its colour.

In a similar way to Background colour selection, the colour can be selected as well.