How do I add an embed sign up form to footer in Streamline theme

Topic summary

A user is attempting to integrate a Klaviyo email signup form into the footer of their Shopify store using the Streamline theme version 4.4.3, which doesn’t support adding sections to the footer through the theme editor.

Initial Solution:

  • User added Klaviyo embed code directly to line 1 of footer.liquid
  • This resulted in awkward placement above social media icons

Recommended Fix:

  • Place the Klaviyo code just above the closing </footer> tag but below social icons
  • Wrap code in a <div class="footer-signup"> container
  • Apply CSS styling for proper formatting (centered, max-width 400px)

Current Issue:

  • CSS styling code is displaying as visible text on the website when added beneath the Klaviyo code
  • This suggests the CSS needs to be placed in the theme’s stylesheet rather than inline in the footer.liquid file

Status: The form has been repositioned but styling implementation remains unresolved. User plans to upgrade to Streamline 6.6 after completing customizations.

Summarized with AI on October 30. AI used: claude-sonnet-4-5-20250929.

Hi, I’m trying to add a Klaviyo embed sign up form to my store footer. I have Streamline - however it is version 4.4.3 and I cannot add a section to the Footer. Would I add it to the theme code and if so where in the code (like what line in footer.liquid, etc) and what is the code? thank you.

UPDATE: I found footer.liquid and added the Klaviyo embed code to Line 1 – so the embed form is sandwiched awkwardly right above my social media icons. Where would I move the code in the footer so it looks less klunky? thank you

P.S. I plan to migrate to Streamline 6.6 after I finish adding the customizations – I added the form following these instructions: https://help.klaviyo.com/hc/en-us/articles/32004602396443 but the updated theme is not published yet so I don’t know if it worked.

Hi,

Hope this will help

  • At editr code Scroll through footer.liquid and locate section that renders social media icons.
  • Place Klaviyo embed code just above closing tag but below the social icons.
    Code

  • Add the Klaviyo code
  • Use css for styling
    CSS code example
.footer-signup {
  text-align: center;
  margin-top: 20px;
}

.klaviyo-form {
  max-width: 400px;
  margin: 0 auto;
}

Thank you, was able to move the form. However,

The CSS for styling code is visible on website when I enter it underneath the Klaviyo code. Any suggestions? thanks