I want to increase the size of my social media Icon in footer

[salomon2000]

I need help with increasing the size of my social media icon at the footer

[prakashVt]

What's your website URL? 
If it is password protected please share that as well. 
@salomon2000 

[salomon2000]

Here is my website link https://trendyvendyla.com/

[Umardeveloper1]

To increase the size of social media icons in the footer:

1. Go to Shopify Admin > Online Store > Themes > Edit Code.
2. Open footer.liquid in the Sections folder.
3. Add the following CSS in theme css (under Assets😞

css

.social-icons a { font-size: 30px; /* Adjust size */ margin: 0 10px; /* Adjust spacing */ }

1. Save and preview your store.

Let me know if you need more help!

[ZestardTech]

Hello @salomon2000 

Please share your store URL and password.
So that I will check and let you know the exact solution here.

[salomon2000]

https://trendyvendyla.com/

[WizzCommerce_Co]

Hi @salomon2000 , thankyou for posting here!

To increase the size of your social media icons in the footer of your Shopify store, you need to modify the CSS in your theme. Here’s how you can do it:

1. Log in to Shopify Admin
   Go to your Shopify admin and navigate to Online Store > Themes.

2. Access Theme Editor
   Find your active theme and click Actions > Edit code.

3. Locate the CSS File
   In the left-hand menu, locate your CSS file. This might be named something like:

   • component-list-social.css

4. Add Custom CSS

   

   Replace 120px with the size you prefer. The values for width and height can be adjusted proportionally.

5. Save and Preview
   Click Save and then preview your store to check the changes.

Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[Tech_Coding · Accepted solution]

Hello @salomon2000 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
  .footer ul li.social__item.inline-flex svg {
      width: 4rem !important;
      height: 4rem !important;
  }
</style>

Result:

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

[Moeed]

Hey @salomon2000 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
.social__link svg {
    width: 4rem !important;
    height: 4rem !important;
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[DaisyVo]

Hi @salomon2000 

I hope you are well. You can follow our instructions below:

Step 1: Shopify admin > Online store > Customize: https://prnt.sc/XQ6IDB99kUCd
Step 2: From the left menu > Theme settings > Open Custom CSS: https://prnt.sc/iDxwa8zBQ4Z-
Step 3: Copy the code below and paste it there

Here is the code for Step 3:

footer.footer ul.list-unstyled.list-social.footer__list-social li.list-social__item span.svg-wrapper {
    width: 40px !important;
    height: 40px !important;
}
footer.footer ul.list-unstyled.list-social.footer__list-social li.list-social__item span.svg-wrapper svg.icon {
    width: 40px !important;
    height: 40px !important;
}

 

Please let me know if it works. Thank you!

Best,
Daisy - Avada Support Team.

[ZestardTech]

Hello @salomon2000 

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > theme.css and paste this at the bottom of the file:

.footer ul li.social__item.inline-flex svg {
width: 3rem !important;
height: 3rem !important;
}