Boost Your Brand: How to Add & Style Custom Text Under Your Shopify Header Logo

Hey there, fellow store owners! Ever found yourself scrolling through the Shopify community forums, looking for that one little tweak that could elevate your brand? I was just doing that the other day, and a super common question popped up that I think many of you might relate to: how do you add a custom bit of text right underneath your header logo?

It's a fantastic idea for branding, isn't it? Whether it's a tagline, your business name in a specific font, or a little artist's signature like our community member, atmos-art, wanted (they were looking to add "Atmos Art" or "Art by Atmos" under their signature logo), that extra line of text can really tie your header together and add a touch of professionalism. It’s those subtle details that often make the biggest difference in how customers perceive your store.

The Community's Smart Solution: Custom Liquid

Thankfully, our sharp community expert, Ploqo, jumped in with a brilliant and surprisingly straightforward solution using Shopify's Custom Liquid section. This method lets you inject a little bit of HTML and CSS directly into your theme without diving deep into the theme code files, making it accessible even if you're not a seasoned developer. It's a prime example of the kind of clever workarounds the Shopify community often shares!

Ploqo even provided some great visuals to show the 'before' and 'after' – a clear logo, then the same logo with the new text underneath. It really highlights the impact a small change can have.

Before: logo only

After: text under the logo

Step-by-Step Guide: Adding Your Custom Header Text

Ready to give it a try? Here's how you can add that custom text and get it looking just right. This approach works great with themes like Dawn, which is the default and a solid choice for many stores.

  1. Log in to your Shopify admin.
  2. Navigate to Online Store > Themes.
  3. Find your live theme (usually Dawn) and click the Customize button. This opens the theme editor.

Online Store and Edit theme

  1. In the theme editor, look for the Header group on the left sidebar. It's usually at the very top of your sections list.
  2. Under the Header group, click its Add section link and choose Custom Liquid from the list that opens.

Add section, then Custom Liquid

  1. Now, for the magic code! Copy and paste this exact code into the Liquid code box:

Code pasted, text shows under the logo

  1. Crucial Step: Remember to change "Your Custom Text Here" to whatever you want your text to say! Atmos-art, for instance, used "Art by Atmos".
  2. Finally, click the Save button in the top right corner of the theme editor.

Save

Voila! You should now see your custom text perfectly positioned under your logo. This text will appear on every page of your store, and as Ploqo noted, it automatically centers nicely on both desktop and mobile views.

Customizing Your Text – Making It Truly Yours

Once you've got the text appearing, you'll want to fine-tune its look to match your brand's aesthetic. The beauty of this Custom Liquid approach is that all the styling is right there in that same code block. You can easily adjust these lines:

  • content: This is where you put the actual words you want to display, e.g., "Atmos Art".
  • color: Change the text color using any hex code (e.g., #121212 for a dark grey/nearly black).
  • font-size: Control the size of your text in pixels (e.g., 14px).
  • font-weight: Adjust how bold your text is. Common values are 400 for regular, 600 for semi-bold, and 700 for bold.
  • line-height: If your text wraps to multiple lines, this will adjust the spacing between them.
  • margin-top: Control the vertical space between your logo and the new text.
  • text-align: As atmos-art quickly realized and Ploqo confirmed, text-align: center; is your friend for perfect alignment!

Feel free to play around with these values until the text perfectly complements your existing logo and overall store design. It's all about making your store feel cohesive and professional.

A Quick Note on the Code

You might be wondering about that .shopify-section:has(#logo-text) { display: none; } line in the code. That's a clever little trick to ensure that the Custom Liquid section itself doesn't create any extra, unwanted space or elements on your page. It simply applies the CSS rules and then hides its own container. Super neat, right?

Why These Small Customizations Matter for Your Store

Personalizing your Shopify store like this is a fantastic way to reinforce your brand identity. It's these small, thoughtful touches that make a huge difference in how customers perceive your business. A well-branded header, for example, can instantly communicate professionalism and attention to detail. If you're just starting out or thinking about moving your business online, remember that Shopify offers incredible flexibility for customization, allowing you to create a truly unique online presence that stands out from the crowd.

So there you have it – a simple yet powerful way to add that extra layer of branding to your Shopify header, straight from a helpful community discussion. It's a testament to the power of the Shopify community, where store owners and experts share these kinds of practical tips daily. Don't be afraid to experiment with the styling until it perfectly matches your brand vibe. Happy customizing!

Share:

Start with the tools

Explore migration tools

See options, compare methods, and pick the path that fits your store.

Explore migration tools