How to minimize blank space on product pages?

Store Design

Topic summary

Main issue: Excessive blank space above the FAQ section on product pages in the Shopify “Refresh” theme.

Suggested approach: Edit theme CSS to reduce padding. Guidance provided to navigate Shopify Admin > Online Store > Themes > Edit code, locate the product page section (product-template.liquid or the FAQ’s section file), and decrease the padding-top value (CSS controls spacing).

Backup concern: The requester asked how to back up the theme before editing; a concrete backup method was not yet provided.

Latest development: The requester found relevant code in collapsible-content.liquid showing Liquid-generated CSS:
.section-{{ section.id }}-padding { padding-top: {{ section.settings.padding_top | times: 0.75 | round: 0 }}px; padding-bottom: {{ section.settings.padding_bottom | times: 0.75 | round: 0 }}px;
They asked how to edit these values. Liquid is Shopify’s templating language; these variables come from theme settings.

Key points:

  • The code snippet is central to understanding the spacing issue.
  • No specific edit instructions for collapsible-content.liquid or theme backup steps were given yet.

Status: Unresolved/ongoing. Open questions: How to properly back up the theme; whether to change the Liquid calculation or adjust the corresponding theme settings to reduce padding.

Summarized with AI on February 1. AI used: gpt-5.
4

This is what I see in file collapsible-content.liquid

{%- style -%}
.section-{{ section.id }}-padding {
padding-top: {{ section.settings.padding_top | times: 0.75 | round: 0 }}px;
padding-bottom: {{ section.settings.padding_bottom | times: 0.75 | round: 0 }}px;

How do I edit that?