Carousel for Recommended products section in Craft Theme not appearing

[backertg]

We are using the craft theme v9.0  On our product page we have a Recommended Product section and a number of products selected as recommended.  There is an option to add the casoudel slide function which we have checked to include.  The problem is that the arrows at the side of that section don't appear on the page.

Is there an issue with that theme?  how do we add the arrows?

Thank you!

Todd

[Erin]

Hi, @backertg. I'm happy to look into this with you! I just have a few questions to make sure I'm giving you helpful advice going forward.

• What is the name of the section with the carousel you're trying to edit? For example, is this the Related products section or the Complementary products block?
• Can you walk me through the steps you took to add the carousel slide function to this section or block?
• Are you using the Shopify Search & Discovery app to manage your product recommendations?

I took a look at your version of Craft (9.0.0) and the most recent version of Craft (11.0.0), and I'm having trouble finding a "Recommended Product" section. Also, when I view the settings for the Related products section and the Complementary products block, I don't see a setting to turn this into a carousel. From what I can see, this isn't meant to be a carousel with arrows, but if you tell me more about what you see on your end I may be able to review this further.

Please let me know if you have any questions! The following guides may be able to help in the meantime:

• Shopify Search & Discovery
• Customize product recommendations

[backertg]

Hello Erin,

Thank you for getting back to me on our question.

First I need to correct my earlier statement - the section I am referring to
is the "Featured Product" section on our Product Page.

I have attached a picture of the theme page that show the click select
option to add the enable the carousel. Selecting that does not cause the
arrows to appear so a customer can move between all of the products included
in the featured collection - it only shows the first 4 product which is what
we have selected to appear across a desktop page.

Please let us know what we should be doing differently.

Thank you,

Todd

[Erin]

Hi, @backertg. Thanks for getting back to me! I'm not seeing the image you attached. Are you able to try sending that again so I can see the settings you're speaking about? I also have a few more clarifying questions.

You mention that you are using the Featured product section, but then you refer to it as a "featured collection". These are two different types of sections with different purposes and settings. Are you able to clarify which one you're using and the steps you took to add it to your theme? Also, are you using the Shopify Search & Discovery app to manage your product recommendations?

Once I have more information I can continue looking into this with you!

[backertg]

Hello Erin,

I'll try again to clarify my answer to your questions and get the terminology correct.  We are using a "Featured Collection" section on our "default product" page near the bottom of the page.  We have created a collection also title "featured collection" that at the moment contains 9 products we added using the shopify/product/collection store setup function.  We are not using the Shopify Search & Discovery app as that is not necessary to achieve what we want.  

Please refer to the attached photo to see the enable carousel function radio button selection that should produce the arrows to move within the carousel.

Please let us know what else we should do to enable that function.

Thank you,

Todd

[Erin]

I appreciate that context, @backertg! 

If you've checked the Enable carousel on desktop setting and you're not seeing the carousel arrows, it's likely caused by the Maximum products to show setting. At the moment you have it set to 4, which means only 4 products will appear in this section. If you increase that amount, the carousel arrows should appear. I've included some screenshots below to help explain what happens when this number is increased.

Before increasing the Maximum products to show setting:

After increasing the Maximum products to show setting:

One thing to keep in mind is that if you're adding a Default collection section to your Default product template, this collection will be added to all of your product pages by default. If you'd like product suggestions that dynamically change based on the product being viewed, I recommend trying out the Search & Discovery app instead.

Please let me know if you have any questions after trying that out!

[backertg]

Hello Erin,

Thank you!  That solves at least part of the problem.  We would like to have 4 products shown on the screen at one time so we have that set to 4.  I put a larger number (25) into the max shown entry as in the screen shot.  Now the page shows 5 products at the bottom rather than 4 which doesn't make sense.  Also the arrows are at the bottom of the section rather than on the sides of the carousel as in other sections - we'd prefer them on the sides to match.  Also puzzling is that the numbers in between the arrows don't seem to relate to anything at all - the first number is not the number of the first product showing  in the carousel nor is the second number the total number of products that would be the last showing.  They seem to be arbitrary.  Any thoughts on what is happening?

BTW, at this point we don't need to have the dynamic selection of products function available.  That might be a better fit in the future.

Best,

Todd

[Erin]

Hi, @backertg. Thanks for your reply!

I took a closer look into this and I see what you're saying. In this case I recommend changing the Number of columns on desktop setting to "3" and making the Maximum products to show setting anything larger than 3. This will cause the section to highlight 3 products, but you would still be able to see 4th product. You will also have the arrows to see more products in the collection. It doesn't do exactly what you're descibing, but I believe it's the best way to achieve something similar within the limitations of the theme and the section you're using. You can see a screenshot of this below as an example.

The numbering for the carousel seems to represent the number of "clicks" to get to the end of the products displayed in the section. Also, the placement of the arrows is expected for the theme you're using. There aren't any settings to change this, but if you speak with our support team here we could review this with you in more detail. 

Let me know if I can help with any other questions!