Bullet Theme Reduce Empty Blocks

Store Design

Topic summary

A user is experiencing unwanted empty spaces/blocks on their product page and seeking help to remove them.

Initial Solutions Attempted:

  • First response suggested adding code to theme.liquid file above the </body> tag, but this didn’t work
  • Second responder provided CSS code targeting specific elements to hide empty paragraph blocks and adjust slider gallery heights for different screen sizes

Current Status:

  • The CSS solution partially worked, fixing empty space at the top of the page but not the bottom
  • The helper acknowledged the limitation, noting they adjusted code for desktop, tablet, and mobile views
  • Recommendation: Hire a developer for a more comprehensive, pixel-perfect solution across all screen sizes

Technical Approach:
Both solutions involve editing theme files (theme.liquid or main.css/base.css) through the Shopify admin’s “Edit Code” section, using CSS display properties and media queries to hide or resize problematic elements.

Summarized with AI on November 7. AI used: claude-sonnet-4-5-20250929.
2

Hey @ouani

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1722338954663.png
Moeed_0-1722338954663.png1897×874 220 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed