Add social media icons to footer (Stiletto Theme)

Store Design
, , , , ,
1

Hi, I am making a new upgrade to my store, and just bought Stiletto Theme

I’m wondering if someone can help with some liquid coding, that adds these social media icons to the footer, on my new webshop. Same position and same icons if possible. It should only be Instagram and Facebook icons, just like the photo attached. Thank you very much! I really hope someone can help!

The icons are from my old site, you can see them in footer here:

https://www.melchiorjewelry.com/

350363990_150709641231624_7064568508414039560_n.jpg
350363990_150709641231624_7064568508414039560_n.jpg781×206 6.7 KB

My new site URL: https://sz3sfqt5yxf6q6v9-57068945600.shopifypreview.com/

(Preview only available in two days)

.

.

.

.

.

.

.

.

@GemPages_Agents

@KetanKumar

@hammadCodes

@PaulNewton

@Ninthony

@dmwwebartisan

@ExpertRookie

@MandasaTech

@GemPages

@Mike-Omega

@PageFly-Richard

@ZestardTech

2

Hi @stinem123

I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

To add social media icons to the footer of your Shopify Stiletto theme, you can follow these steps:

  1. Log in to your Shopify admin panel.
  2. Navigate to “Online Store” and then click on “Themes.”
  3. Locate the Stiletto theme and click on “Actions” beside it. From the drop-down menu, select “Edit code.”
  4. In the code editor, locate and click on “theme.liquid” in the “Layout” folder on the left-hand side.
  5. Scroll down until you find the <footer> section of the code. This is where you’ll add the social media icons.
  6. Add the following code within the <footer> section, right before the closing </div> tag:
<div class="social-icons">
<a href="[https://www.facebook.com/your-page-url](https://www.facebook.com/your-page-url)" target="_blank">
<i class="fab fa-facebook"></i>
</a>
<a href="[https://www.twitter.com/your-page-url](https://www.twitter.com/your-page-url)" target="_blank">
<i class="fab fa-twitter"></i>
</a>
<!-- Add more social media icons as needed -->
</div>

Note: In the above code, replace "[https://www.facebook.com/your-page-url](https://www.facebook.com/your-page-url)" and "[https://www.twitter.com/your-page-url](https://www.twitter.com/your-page-url)" with the actual URLs of your Facebook and Twitter pages, respectively. You can also add more social media icons by replicating the <a> tag for each platform and updating the URLs and icons accordingly.

  1. Save the changes by clicking on the “Save” button at the top right of the code editor.
  2. Preview your store to see the social media icons in the footer. If everything looks good, click on “Publish” to make the changes live on your Shopify store.

That’s it! You have now added social media icons to the footer of your Shopify Stiletto theme.

Regards,

San

1 Like
3

Hi @INA_MSWEB , thanks for your reply!

Unfortunately this does not work, I just tried, and replaced links etc. Any other suggestions?

I really hope someone can help!

4

Hi @stinem123

I’m sorry but this is out of my scope. You may try contacting Shopify support or finding another expert regarding this issue.

Best regards,
Richard | PageFly Team

1 Like
5

This is a basic feature in the theme if you just want to add the FB and IG icons mentioned in your post. Open your theme by going to ‘customize’ and then on the right side go to theme settings. Scroll down to social media and add your social URLs to the appropriate fields. Then to get them to show in the footer or header, go to either of those sections and check the box “Show social icons” in the left-hand menu. In the footer it will be in the “Text and Image” block.