Social media - Add social media icons via Assets

Store Design

Topic summary

This thread provides guidance on adding social media icons to Shopify stores, offering two approaches: using an app from the Shopify App Store or manually coding the buttons (advanced, unsupported by Shopify).

Main Implementation Method:

  • Upload social media icon images to the Assets folder
  • Insert Liquid/HTML code into theme files (typically theme.liquid or footer.liquid)
  • Link icons to social media profiles using asset_url and link_to tags

Common Issues & Solutions:

  • Oversized icons: Users frequently encounter huge icon displays. The recommended fix involves resizing SVG files to 20x20px in a vector editor, then copying SVG data into snippet files (e.g., icon-linkedin.liquid)
  • Icons not displaying: Some report icons showing as placeholder images instead of actual icons, particularly when using PNG/JPG instead of SVG format
  • Code placement confusion: Multiple users struggle with where to paste the code for proper positioning

Alternative Solutions Mentioned:

  • Using PNG files uploaded to Assets with direct image links (simpler than SVG method)
  • Checking if the theme already has built-in social media settings under Theme Settings > Social Media
  • Using apps like IzyIcons for code-free implementation

Status: Discussion remains open with ongoing troubleshooting questions about icon sizing, file formats, and code placement.

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

Hi, had you managed to resolve this?