Google just released a big update to their icon database – Google Material Symbols is now available! You can use their open-source database to have HUNDREDS of free icons on your Squarespace site, and this tutorial will teach you how.
—
This is just the start of all the cool things you can do with custom CSS! Learn the basics in my free class: https://insidethesquare.co/learn
—
In this tutorial, you’ll learn how to use Google Material Symbols (formerly Google Material Icons) on any Squarespace site. I am using version 7.1 in this tutorial, but it works for older versions too. Here are the steps we are going to take:
1 – we’ll customize the style of the icons
2 – we’ll add the stylesheet link to the code injection of your site
3- using some CSS, we’ll customize the color and size of the icon
4 – we’ll place the icon on your site in a markdown block AND in a code block.
If you’re using a Squarespace business or commerce plan, you can follow this step by step. If you are using a personal subscription plan, you’ll need to add the whole thing in a code block on the specific page you want the icons on.
Here is a link to the material symbols page: https://fonts.google.com/icons
– – –
Here is the code from this tutorial that changes the font size and color:
font-size: 5rem!important;
color: blue!important
– – –
💸 GET 10% OFF YOUR FIRST YEAR OF SQUARESPACE 💸
Use my affiliate link and code PARTNER10 – You’ll save 10% off your first annual subscription & Squarespace will give me a little commission for sending you their way 😎
🔗 PARTNER10 → https://insidethesquare.co/partner10
– – –
🤩 Download over 60+ pages of custom codes and pro tips for customizing Squarespace in one awesome PDF. Order the Squarespace CSS Cheat Sheet, available now at 👉 https://insidethesquare.co/css
—
🙋 Need some help? Visit https://insidethesquare.co/code-help to see my current support options.
—
🥰 SUPPORT MY CHANNEL → https://paypal.me/insidethesquare
💻 WEBSITE → https://insidethesquare.co
📧 NEWSLETTER → https://insidethesquare.co/email
🤳 INSTAGRAM → https://www.instagram.com/thinkinsidethesquare
👍 FACEBOOK → https://business.facebook.com/insidethesquare
📌 PINTEREST → https://www.pinterest.com/insidethesquare
—
The term “Squarespace” is a trademark of Squarespace, Inc. This video was not approved or endorsed by Squarespace, Inc. I just really love their platform ♥ The term Google is a trademark of Alphabet, Inc. This video was not approved or endorsed by Alphabet, Inc.