how can i make the footer looks like this on mobile only

Store Design

Topic summary

A user wants to customize their Shopify store footer to display a specific design on mobile devices only. The desired layout includes an email input box with social media icons underneath, bordered by a 2-3px black border.

A suggested solution involves:

  • Adding a custom liquid section to the footer
  • Using ChatGPT to generate code for the email box and social icons with the specified border styling
  • Creating collapsible information sections with rounded borders

The original poster clarified they need this design to appear exclusively on mobile devices, not desktop. The discussion remains open regarding how to implement mobile-only CSS or conditional rendering for this footer design.

Summarized with AI on November 7. AI used: claude-sonnet-4-5-20250929.
1

how can i make the footer looks like this on mobile only

5873001829342758615.jpg
5873001829342758615.jpg1170×1260 51.3 KB

2

hii.. go to footer and add custom liquid then tell chatgpt to make email box with social icons under and border 2-3px black rounded border then to make information and then a ^ to open information etc.. then paste that code into custom liquid voila.

3

i want it only on mobilie
how can i do that