How to open a social media icon in a new tab using the Studio theme?

Store Design

Topic summary

A user running Studio theme (v4.0.1) needs help making social media icons in the footer open in new tabs.

Solution provided:

  • Add the target="_blank" attribute to all social media <a> tags
  • Multiple respondents confirmed this approach with code examples

Implementation steps:

  1. Navigate to: Store Admin > Sales Channel > Online Store > Themes > Edit Code
  2. Locate the social icons file (identified as social-icons.liquid snippet or within footer.liquid)
  3. Find all <a> tags associated with social media links
  4. Add target="_blank" attribute to each tag
  5. Save the file

Example code structure:

<a href="{{ social_media_link }}" class="social-icon" target="_blank">

Screenshots were shared showing the exact file location and code placement. The user confirmed finding the code in the footer.liquid file.

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

Hi, Can someone please help us open the social media icon in a new tab? We are using the Studio (4.0.1) theme. Thanks

2

@arg99 please put this attribute to all social A tag:

target=“_blank”

it will open a link in new tab.

3

Hello @arg99

Here is an Example:

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

4

where do i put the tag?

Captura.JPG
Captura.JPG870×842 43.7 KB

5

Hi @arg99

You can do that from store admin > Sale channel > Online store > Themes > Edit code, open social-icons.liquid file, add this type of code

target="__blank"

Right after all code like this


![Screenshot 2024-08-14 at 14.53.26.png|1053x603](upload://oVF2k4hbaD3XjBm9VFzg160yNQQ.png)

Save your file
6

@arg99

[email removed] please search social in you theme file , it is a snippet the check tags and put (target=“_blank”) to all a tags. like this:

ProtoMan44_0-1723629476049.png
7

it was on “footer.liquid” file