Beyond 'New Customer Message': Revolutionizing Your Shopify Contact Forms & Page Layout

Hey store owners!

Ever feel like your inbox is a chaotic mess of 'New customer message' subject lines? You're not alone. It's a common pain point, especially when you have multiple contact forms for different purposes, like a general 'Contact Us' and a specific 'Exchange Request'. You want to quickly identify what an email is about without even opening it, right?

That's exactly what our friend @offroadjim was grappling with in a recent community thread. He was using a 'Flexi - Contact Form' block and seeing generic subjects like "New customer message on May 6, 2026 at 12:13 pm." And honestly, who has time to sort through those?

But the discussion didn't stop there! offroadjim also had a great idea for improving the contact page itself: a clean, two-column layout with instructional text on one side and the form on the other. It's all about making things easier for both you and your customers. Let's dive into the community's brilliant insights and solutions!

Taming Those Generic Subject Lines

The first big takeaway from the thread, echoed by experts like @tim_1 and @liquidshop.co, is that Shopify's default contact form notifications are pretty rigid. You can't directly change that subject line from your theme code. It's a Shopify-controlled notification.

Option 1: The Power Duo - Shopify Forms App + Shopify Flow (Recommended!)

This is by far the most flexible and powerful solution recommended by the community. Both tim_1 and liquidshop.co highlighted the free Shopify Forms app. Here's why it's a game-changer:

  • Custom Forms: It gives you more control over form fields and presentation.
  • Automation with Flow: The real magic happens when you connect it with Shopify Flow. Instead of relying on Shopify's default email notification, you can set up a Flow automation that triggers when a form is submitted.

How to Set It Up:

  1. Install Shopify Forms: Get the free app from the Shopify App Store.
  2. Create Your Forms: Build separate forms for 'Contact Us' and 'Exchange Request' within the Shopify Forms app.
  3. Build a Flow: In Shopify Flow, create a new workflow.
    • Trigger: Set the trigger to "Form submitted" (from the Shopify Forms app).
    • Condition: Add a condition to check which form was submitted (e.g., "Form Name is 'Contact Us'").
    • Action: Add an action to "Send internal email" (or any other action you need, like creating a Trello card, adding a customer tag, etc.).
    • Customize Subject: In the "Send internal email" action, you can now set your custom subject line (e.g., "NEW CONTACT US INQUIRY"). Repeat this for your 'Exchange Request' form with its own unique subject.

This way, you get perfectly tailored subject lines and can even format the message body as you like, making your inbox much more organized.

Option 2: The Hidden Field & Email Filter Workaround

If for some reason the Shopify Forms app isn't an option, @Sajini-Annie from Identixweb offered a clever workaround for the default forms. While it doesn't change the subject line itself, it adds crucial information to the email body that you can then use to filter your inbox.

How to Implement:

  1. Edit Your Form Code: Go into your theme code (usually in a file like contact-form.liquid or the page template where your form resides).
  2. Add a Hidden Field: Inside your
    tags, add a hidden input field like this:
  3. For your 'Exchange Request' form, you'd use:

    When the form is submitted, the email body will include something like "Form Type: Exchange Request". You can then set up an email filter in your Gmail, Outlook, or other email client to automatically sort these messages into different folders or label them based on that specific text.

    Crafting a Sleek Two-Column Contact Page Layout

    offroadjim's other excellent question was about making the contact page more visually appealing and functional with a two-column layout. Imagine clear instructions on one side and the form neatly presented on the other, like this:

    image

    It's certainly possible, and the community offered a couple of ways to achieve it!

    Option 1: No-Code for Horizon Family Themes

    If your theme is part of the Horizon family (like Dawn, Refresh, Sense, etc.), @tim_1 pointed out you might not need any code at all! You can use the theme editor's built-in blocks:

    1. Add a "Group" Block: In your page template, add a new "Group" block.
    2. Set Direction: Configure the Group block to have a "Horizontal" direction on desktop.
    3. Add Content: Drag your existing text content block and the Forms app block (or your default contact form section) into this new Group block.

    This should automatically arrange them side-by-side on larger screens.

    Option 2: Custom CSS for Broader Compatibility

    For themes outside the Horizon family, or if you want more granular control, custom CSS is your friend. @tim_1 provided a fantastic snippet to achieve this.

    How to Implement the CSS:

    1. Add a Text Content Section: Start by adding a regular text content section to your page template for your instructions.
    2. Add a "Custom Liquid" Section: At the very bottom of your page's template area, add a "Custom Liquid" (or "Custom HTML" / "Custom code") section. This placement is key, as tim_1 noted that the code converts the entire content of the template area into two columns, so you want your visible content at the top. Also, make sure to remove any placeholder text like "Your title" from this Custom Liquid section itself.
    3. Paste the CSS Code: Insert the following code into your Custom Liquid section:

    This CSS snippet targets the main content area and uses Flexbox to arrange its direct children (your sections, including the text and form) into two columns on desktop screens (min-width: 990px). On mobile, they'll stack naturally, which is great for responsiveness!

    The result should look something like this on desktop:

    Screenshot 2026-05-08 at 1.06.44 PM

    Remember, if you try the CSS and something looks off, like offroadjim initially experienced (showing images of a broken layout), double-check the placement of your Custom Liquid section and ensure no other content is unintentionally wrapped in the main content area that shouldn't be part of the two-column structure. Keeping the Custom Liquid section at the bottom and clean helps prevent unexpected layout issues.

    So there you have it! From ditching those bland "New customer message" subject lines to creating a professional, organized contact page, the Shopify community has some fantastic, actionable advice. Whether you opt for the robust Shopify Forms + Flow combo or a simple hidden field, and whether you use a theme's built-in blocks or a bit of CSS, you can significantly improve how you manage customer inquiries and how your customers interact with your store. Happy customizing!

Share:

Use cases

Explore use cases

Agencies, store owners, enterprise — find the migration path that fits.

Explore use cases