Edit Collection Section (Effortless theme)

Topic summary

A user wants to remove the header section (including the collection title box) from the collection display on their homepage, keeping only the product grid visible. They’re using the Effortless theme version 3.2.0.

Solution provided:

  • Add specific CSS code to the end of the base.css file
  • The CSS targets .template--index .featured-collection elements and hides the collection image wrapper using display: none and visibility: hidden with !important flags

Outcome:

  • The solution successfully removed the unwanted header section
  • A follow-up question was asked about making product images appear smaller, which remains unanswered
Summarized with AI on November 19. AI used: claude-sonnet-4-5-20250929.

Hi everybody :grin:

I am looking to remove the header part of the collection section on the front page. I have attached a screenshot of the part I am looking to remove. I want the collection section to only display the products without the whole box with the heading on the left side on desktop/above on mobile. Please feel free to check out the website:

Theme: Effortless version 3.2.0

Store link: https://golfofeurope.myshopify.com/
Password: rtoble

This is how it looks now (desktop) - I am looking to remove the whole box and part where it says “golf gadgets”:

This is an example of what I am trying to achieve:

Thanks in advance for any help.

@Onlinetrap - please add this css to the very end of your base.css file and check

.template--index .featured-collection .featured-collection-grid-wrapper .featured-collection-image-wrapper{display:none !important; visibility:hidden !important;}

1 Like

Awesome, it worked! Thank you very much :slightly_smiling_face: Do you know how I can make the product pictures appear smaller?