Mastering Your BigCommerce Homepage: A Guide to Hiding Unwanted Section Titles

In the competitive world of e-commerce, a polished and intuitive storefront is paramount. BigCommerce, a leading platform, offers immense flexibility, but sometimes, achieving that perfect look requires a little customization. One common request from merchants is to streamline their homepage by removing or hiding default section titles like "New products," "Featured products," or "Bestselling products." These titles, while functional, might not always align with a brand's specific aesthetic or marketing strategy.

At Big Migration, we understand the nuances of BigCommerce customization, from complex platform migrations to subtle theme tweaks. This guide, inspired by a real-world BigCommerce forum discussion, delves into practical methods for controlling these homepage elements, ensuring your storefront truly reflects your vision.

The Quest for a Cleaner Homepage: Hiding Default Titles

The journey often begins with a simple desire: a cleaner, more focused homepage. As seen in a recent BigCommerce forum thread, merchant Michelle Helgeland sought to remove the "New products" title from her homepage. Despite using a customized Cornerstone theme, she was looking for a straightforward solution that didn't involve a deep dive into complex theme files—a sentiment many merchants share.

Default section titles can sometimes feel redundant, especially if you're using custom banners or visual cues. Removing them can create a more minimalist design, improve visual flow, or simply make room for more impactful content. The challenge lies in finding the right method that is both effective and sustainable, especially when considering future theme updates.

Method 1: The Quick & Clean CSS Injection via Footer Scripts

For minor visual adjustments, injecting custom CSS is often the most efficient and non-invasive approach. It allows you to override existing styles without altering core theme files, which is a significant advantage when theme updates roll out. This method was successfully demonstrated by Avinash Jeswal in the forum thread and confirmed by Michelle Helgeland as exactly what she needed.

How to Implement CSS via Footer Scripts:

1. Access Your Control Panel: Log in to your BigCommerce store's admin panel.
2. Navigate to Footer Scripts: Go to Storefront > Footer Scripts.
3. Add the CSS Code: In the "Footer Scripts" text area, paste the following code snippet. This specific code targets the "New products" heading on many BigCommerce Stencil themes, particularly Cornerstone.

Explanation of the Code: This CSS targets the

element with the class .page-heading that immediately follows a

with the attribute data-content-region="home_below_top_products". By setting display: none;, it completely hides this specific heading from your homepage.

After adding the code, save your changes. Clear your store's cache if necessary, and then check your homepage. The "New products" title should now be gone.

Important Note: While effective for "New products" on many Stencil themes (like Cornerstone), the exact selector might vary for other section titles or different themes. Use your browser's developer tools to inspect the specific heading you wish to hide and identify its unique selector.

Method 2: Leveraging BigCommerce Page Builder (No Code Required)

BigCommerce's Page Builder is a powerful tool designed to give merchants more control over their storefront layout without needing to touch code. For some themes and specific sections, you might be able to hide or edit titles directly through this interface.

How to Check Page Builder Options:

1. Access Page Builder: Go to Storefront > Page Builder.
2. Navigate to Homepage: Ensure you are viewing your homepage.
3. Inspect Sections: Click on different sections. If a section title is editable or toggleable via Page Builder, you will usually see options appear in the left-hand panel. Look for settings related to "Heading," "Title," or "Visibility."

If your theme supports it, this is the easiest and safest method. However, not all section titles are controllable this way, especially those hardcoded into older theme templates.

Method 3: Direct Theme File Modification (Advanced)

For ultimate control or when the above methods aren't sufficient, direct modification of your theme's template files is an option. This is a more advanced approach, typically recommended for developers or those comfortable with HTML/Handlebars code.

Understanding Theme Files:

BigCommerce Stencil themes use Handlebars.js templates. Homepage sections are often defined in files like home.html or within partials (e.g., templates/components/home/new-products.html). The title you want to remove might be hardcoded as an

or

tag within these files.

Steps for Direct Modification:

1. Backup Your Theme: Crucially, always download a copy of your current theme before making any modifications.
2. Download the Theme: From Storefront > My Themes, click the three dots next to your active theme and select "Download."
3. Set Up Stencil CLI (Recommended): For developers, using the Stencil CLI provides a local development environment.
4. Locate and Edit the File: Unzip your theme, use a code editor to search for the specific title text (e.g., "New products") within the theme files. You can then delete the HTML tag or, safer still, comment it out using Handlebars comments: {{!--

   New products

   --}}.
5. Re-upload the Theme: After testing, re-upload the modified theme and apply it as your active theme.

Caution: Direct theme file modification carries the highest risk. Incorrect edits can break your store's layout or functionality. Theme updates can also overwrite your changes. Consider creating a child theme for extensive modifications.

Choosing the Right Method for Your Store

Select the method that best fits your technical comfort and the scope of your desired change:

• CSS via Footer Scripts: Ideal for quick, non-destructive visual tweaks. Easy to implement and generally safe for non-developers.
• BigCommerce Page Builder: The safest, no-code option if your theme supports editing or toggling the specific title directly. Always check here first.
• Direct Theme File Modification: Offers ultimate control but requires technical expertise. Best for developers or when other methods are insufficient. Always back up and consider a staging environment.

Best Practices for BigCommerce Customization

To ensure smooth and sustainable customizations:

• Always Backup: Before any major change, download a copy of your theme.
• Test Thoroughly: Verify changes across different browsers and devices.
• Document Changes: Keep a record of your custom code for future reference.
• Plan for Updates: Be aware that theme updates can affect customizations.

Empower Your BigCommerce Storefront

A clean, well-designed homepage is crucial for engaging customers and driving conversions. By understanding how to effectively manage and hide unwanted section titles, you can create a more streamlined and branded experience for your shoppers.

At Big Migration, we specialize in helping businesses optimize their BigCommerce stores, from seamless migrations to intricate customizations. If you're looking to refine your storefront, enhance functionality, or explore advanced integrations, our team of experts is here to guide you. Reach out to us for tailored solutions that elevate your e-commerce presence.