Shopify themes, liquid, logos, and UX
Hello, I am trying to adjust the size of the social media icons on my site, yearsbeer.com. I would like to make them bigger. Please see attached for photo of current size. Thank you!
Solved! Go to the solution
This is an accepted solution.
Hey @PCBCW,
Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.
Change 30px to any value you want. Make sure to match both width and height to the same number.
<style>
body footer ul#sm-icons li svg {
height: 30px !important;
width: 30px !important;
}
</style>
Screenshot is for reference only, the correct code to paste is the one shown above.
This is Noah from PageFly - Shopify Page Builder App
Please add code here to fix it:
Step 1: Online Stores > Themes > Edit code
Step 2: Choose file theme.liquid
Step 3: Add code above the tag </head>
<style>
#sm-icons li a svg{
width: 40px !important; //you can change 40 to params you want
height: 40px !important;
}
</style>
Hope my solution will help you resolve the issue.
Best regards,
Noah | PageFly
Please let me know if it works by giving it a Like or marking it as a solution!
PageFly - #1 Page Builder for Shopify merchants.
All features are available from Free plan. Live Chat Support is available 24/7.
Hey Noah,
Tried this, it did not work.
Hi @PCBCW please add code here again.
<style>
.footer-main #sm-icons li svg{
width: 40px !important; //you can change param you want
height: 40px !important;
}
</style>
Please let me know if it works by giving it a Like or marking it as a solution!
PageFly - #1 Page Builder for Shopify merchants.
All features are available from Free plan. Live Chat Support is available 24/7.
This is an accepted solution.
Hey @PCBCW,
Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.
Change 30px to any value you want. Make sure to match both width and height to the same number.
<style>
body footer ul#sm-icons li svg {
height: 30px !important;
width: 30px !important;
}
</style>
Screenshot is for reference only, the correct code to paste is the one shown above.
That worked, thank you so much!
Find Global Growth Opportunities For Your Business with Shopify AcademyLearn how to exp...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025Expand into selling wholesale with Shopify Academy’s learning path, B2B on Shopify: Lau...
By Shopify Jan 28, 2025