Jump to content

Google Material Icons font - Can't figure out how to insert muultiple fonts

Recommended Posts

Posted

Site URL: https://uniquepool.squarespace.com/swimming-pools-gallery/breedon-priory-pool

https://uniquepool.squarespace.com/swimming-pools-gallery/breedon-priory-pool 

The password is: Parkerlane

Hi folks, I am trying to insert 4 google material icons on the page linked above. I can only get one to load properly using the info from here https://laz-i.com/blog/use-google-icons#method-3:-inside-a-text-block

The code I have played with is as follows:

<link rel="stylesheet"href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=design_services"

href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=work" 
      
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=square_foot"
            
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=calendar_month"/>

 

I have tried various iterations of the code but I can only get the "design_services" icon to load... can anyone help with where I am going wrong? Many thanks

  • Replies 3
  • Views 95
  • Created
  • Last Reply

Top Posters In This Topic

Posted

If I add this code

<link rel="stylesheet"href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=design_services"/>

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=work" />

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=square_foot" />

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=calendar_month" />

 

Only the last one shows up...? I presume there is something wrong with my code

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.