Horizon Theme: How to Display Separate Policy Links in Your Shopify Footer (No More Pop-Ups!)

Hey store owners! Ever found yourself scratching your head trying to get your Shopify Horizon theme to display individual policy links in the footer instead of that single "Terms & Policies" button that pops up a list? You're definitely not alone. It's a common question, and I recently saw a fantastic discussion in the Shopify community that tackled this head-on, offering some super practical solutions. Let's dive into what we learned from Geronim0 and the helpful folks like veed and MBilal.

The Horizon Theme's Default Policy Links: A Common Headache

Geronim0 kicked off the conversation, showing us exactly what many of you face: a single "Terms & Policies" link in the footer. When clicked, it reveals a pop-up with individual policy links. While functional, it's not always the clean, direct look many store owners prefer. We want those Privacy Policy, Refund Policy, and Terms of Service links right there, front and center!

The good news is, the community came through with a couple of excellent ways to fix this, catering to different comfort levels with code.

Solution 1: The No-Code (or Low-Code) Menu Block Approach

This is often the first place I'd recommend looking, especially if you're not keen on diving into theme code. It leverages Shopify's built-in navigation features. Here's how veed laid it out, and it's a solid strategy:

1. Create a New Menu: In your Shopify admin, go to Content > Menus > Add menu. Give it a clear name, like "Legal" or "Footer Policies".
2. Add Your Policy Links: Click Add menu item. In the link field, start typing the name of a policy (e.g., "Privacy policy", "Refund policy", "Shipping policy", "Terms of service"). Shopify will suggest the actual policy page. Select it and repeat for each policy you want to display. Don't forget to Save menu!
3. Add a Menu Block to Your Footer: Head to Online Store > Themes > Customize. In the editor, navigate to your Footer section. Click Add block > Menu.
4. Select Your New Menu: This is where Geronim0 initially ran into a little snag, thinking it only offered the "Main menu." But veed clarified: once you've added the "Menu" block, click on that new block in the footer panel. You'll see a Menu setting where you can pick your newly created "Legal" menu from the dropdown list.
5. Hide the Default Policy Links: Still in the Footer section, find the "Policies and links" section. Locate the Policy links block (this is the one creating the pop-up) and click the eye icon next to it to hide it.

A quick note: If you add a new policy page later, you'll need to manually add it to your "Legal" menu. It's a small trade-off for the no-code convenience.

Solution 2: The Code-Savvy Inline Policy List (My Favorite for Automation!)

If you're comfortable with a little code, veed's second option is fantastic because it automatically displays any new policies you create without needing to update a menu. Geronim0 actually got this one working perfectly for his store!

Before You Start: Duplicate Your Theme!

Always, always, always duplicate your theme before making code changes. Go to Themes > ... > Duplicate. Work on the copy, not your live theme!

The Code Changes:

1. Edit Code: From your duplicated theme, click Actions > Edit code.
2. Open blocks/footer-policy-list.liquid: This is the file that controls how your policies are displayed in the footer.
3. Replace the Pop-up Code: You'll keep the first line {% if shop.policies.size > 0 %} and its closing {% endif %}. Everything in between, from down to , needs to be replaced with this snippet. This code creates an unordered list (
   ) and loops through all your policies, making a link for each one:

   
     {%- for policy in shop.policies -%}
       {%- if policy != blank -%}
         
   
           {{- policy.title | escape -}}
         
       {%- endif -%}
     {%- endfor -%}
   
   

   • Add Styling (CSS): Immediately after the {% stylesheet %} line in the same file (blocks/footer-policy-list.liquid), add this CSS. It'll make your policy links display nicely in a row, wrapping on smaller screens:

     .policy-inline-list {
       display: flex;
       flex-wrap: wrap;
       justify-content: center;
       gap: 4px 16px;
       margin: 0;
       padding: 0;
       font-size: var(--font-size, 0.75rem);
       text-transform: var(--text-transform, none);
     
       @media screen and (min-width: 750px) {
         justify-content: flex-start;
       }
     }
     

   • Save and Preview: Save your changes, then preview your duplicated theme on both desktop and mobile to ensure everything looks good. Once you're happy, you can Publish the copy.

Fine-Tuning Your Policy Pages: Adjusting Heading Sizes

After successfully implementing the separate policy links, Geronim0 noticed another small but important detail: the headings on his actual policy pages were a bit too large, and the theme settings weren't affecting them. This is a super common scenario because Shopify's policy pages often pull their heading sizes from global theme styles, bypassing specific section settings.

MBilal had the perfect, precise solution for this:

1. Locate a Custom Liquid Block: If you have an existing Custom Liquid block in your theme (often found in the footer, or sometimes on specific pages), you can add this code there. If not, you might add a new "Custom Liquid" block to your footer or to a section that appears on all pages.
2. Add This CSS: Insert the following CSS, which specifically targets the policy page headings (.shopify-policy__title h1 and .shopify-policy__body h2), ensuring your changes only affect these pages and nowhere else:

3. Adjust Sizes: Feel free to change 32px and 22px to whatever sizes look best for your brand. The !important tag ensures these styles override any conflicting global styles.

So there you have it! Whether you prefer a no-code menu setup or a slightly more automated code-based solution, getting those separate policy links in your Horizon theme footer is totally achievable. And with that little CSS trick, you can even make sure your policy page headings look just right. It's all about making your store look professional and providing a smooth experience for your customers, and sometimes, those small details make all the difference. Always remember to test your changes thoroughly, especially on mobile, before pushing them live!