Why use the Google font library?
Of course, you can use other fonts with your Infusionoft shopping cart theme. But experienced web designers who use CSS style sheets frequently choose their fonts from the Google font library because the option is:
- a hosted service (so you just need to link to the font library)
- compatible with multiple devices, browsers and operating systems
- conveniently provides the coding you’ll need to change your Infusionsoft shopping cart theme
To do that, you’ll need to:
- Choose a Google font from the Google font library
- Make a change in the CSS style sheet that controls the font styles for your shopping cart
To Choose Your Google font:
Go to the google fonts site at: https://www.google.com/fonts The choice (at 675 font styles to date, as of December 2014), is a little dizzying. To make it easier, I recommend filtering down your choices to using Sans Serif fonts and a Latin script (see screenshot): For this tutorial, I’ll select the Lato font. To do that, I click on the quick-use button (in yellow in screenshot below) below the example Lato font:
Depending on the font, you can have multiple options with the styles — usually variations of thin, bold, italic. I usually try to select the bold and italic options if possible (see below):
You can then copy the coding you’ll need to change your Infusionsoft shopping cart theme below:
Go to your Infusionsoft shopping cart theme to make the changes you need. To get there, go to:
Ecommerce tab > Ecommerce setup > Shopping Cart Theme
To edit your theme — click on the EDIT link at the bottom right corner of your active theme image:
Then, go to the tab entitled: EDIT CSS
You will then cut and paste the new code into this style sheet in the yellow areas in the screenshot below:
Cut and paste the URL provided by the Google font library code generator.
And, then change the first font into the body code to match your choice. It will look like this:
Don’t forget to hit the SAVE button! And then … you are done.