Position your Product Recommendations
To configure the location of your recommendation carousel, the following methods are available:
Preferred Method: Adoric's Position Selector
Alternative Method: Manually designate the position
Product Page Position
Our selector maps all your page types. It includes arrows to show the exact position.
To choose a position on the page:
Click on the desired block.
Click on an arrow to add a block before or after the chosen spot.
as seen in the gif below:

For this method, paste your desired CSS selector and select from these four options:
Add Inside at the Top
Add Inside at the Bottom
Add Before the Block
Add After the Block
as seen in the gif below:
Additionally, on product pages, you have the option to click on any of the following choices:
(Or you can click the "Set Custom Position" button to manually choose a location, explained above)
Below Product Information: This inserts the block below the product details, spanning the full width.
Below Buy Buttons: This places the block below buttons like “Add to Cart” or “Buy It Now.”
Below Product Description: This positions the block below the product description.
At the End of the Page: This adds the block at the bottom of the page, just above the page footer.
as seen in the gif below:

Preferred Method: Adoric's Position Selector
Alternative Method: Manually designate the position
Product Page Position
1. Preferred Method: Adoric's Position Selector
Our selector maps all your page types. It includes arrows to show the exact position.
To choose a position on the page:
Click on the desired block.
Click on an arrow to add a block before or after the chosen spot.
as seen in the gif below:

2. Alternative Method: Manually designate the position
For this method, paste your desired CSS selector and select from these four options:
Add Inside at the Top
Add Inside at the Bottom
Add Before the Block
Add After the Block
as seen in the gif below:

3.Product Page Position
Additionally, on product pages, you have the option to click on any of the following choices:
(Or you can click the "Set Custom Position" button to manually choose a location, explained above)
Below Product Information: This inserts the block below the product details, spanning the full width.
Below Buy Buttons: This places the block below buttons like “Add to Cart” or “Buy It Now.”
Below Product Description: This positions the block below the product description.
At the End of the Page: This adds the block at the bottom of the page, just above the page footer.
as seen in the gif below:

Updated on: 25/06/2024
Thank you!