Slideshow height adjustment for Crave theme

Shopify Discussion

Topic summary

Main issue: Reduce the Crave theme homepage slideshow height (targeting ~half its current size, similar to Petco’s site).

Actions and solutions:

  • Access requested to review the store; then a fix was provided via theme code edits.
  • Instructions: Online Store → Themes → Edit code → open theme.liquid and paste a custom snippet just before the closing tag. The snippet lets you set a specific slideshow height (adjustable). Note: The actual code is central to the fix but not visible in this transcript.
  • Result: The height adjustment worked as intended.

Follow-up issue: Large vertical gaps after the slideshow and between sections (collection list, blog, etc.).

  • Solution: Another code snippet was provided to reduce margins/spacing between sections (adjustable). The change worked.

Status and open questions:

  • The original poster’s issues (slideshow height and section spacing) were resolved with custom code in theme.liquid.
  • A later participant asked where to place the code. Based on earlier guidance, it should go in theme.liquid before , but no direct reply to that user appears in the thread.

Notes:

  • theme.liquid is the theme’s main layout file; is the HTML closing tag for page content; margins control spacing between sections.
Summarized with AI on December 26. AI used: gpt-5.
1

Hello, I have been trying to change the height of my actual slideshow for about 8 hours total. I haven’t found 1 solution that even remotely worked for the crave theme I am on right now. I want a thinner slide show so that it doesn’t take up as much space as it currently does. I want it at about half the current height. Petco’s website, slideshow is a good example for what I am looking for, https://www.petco.com/shop/en/petcostore.

2

Hi @I_Like_Turtles ,

Could you please share URL and your store password if it enabled? So that we can help you.
Thank you.

3

https://petsandmore-2277.myshopify.com/

Password is: sauffa

4

Hi @I_Like_Turtles ,

This is Victor from PageFly - Landing page builder, I’d like to suggest this idea for solution:

Step 1. Go to Online Store → Theme → Edit code
Step 2. Open your theme.liquid theme file
Step 3. Paste below code before :

Note: You can adjust height to fit your store

Hope my answer will help you.

Best regards,

Victor | PageFly

1 Like
5

That worked perfectly, thank you. Also while I am here, how would I make the blank gap between the bottom of the slideshow and the below collection list heading? And actually any collection list, blog, etc. gap smaller. They are all too far apart

6

You can try this code below:

Note: You can adjust the margin to fit your store

1 Like
7

That worked perfect. Thank you for your help!

8

where do I put this?