Learn how to add a custom font to your Walls.io social wall so it matches your brand, campaign, or event design more closely. In this example, we use Google Fonts because it is quick to set up, but you can also use other embeddable web fonts. In the steps below, we will show you how to copy the font import code and add it to your wall's custom CSS.
How to choose a font in Google Fonts
Pick the font you want to use and open its details page in Google Fonts.
On the next page click on “Get embed code”:👇
Click "import" and copy the import URL:
How to add the font to your wall's custom CSS
In Walls.io, go to Design > Custom CSS and paste the @import line there. Then add the font-family value provided by Google Fonts inside a body { ... } rule so the font is applied across your wall.
A working example should look like this:
@import url('https://fonts.googleapis.com/css2?family=Anta&display=swap');
body {
font-family: "Anta", sans-serif;
font-weight: 400;
font-style: normal;
}
Each post will use the font you imported (in our case it's the Anta font) 👇
In case you have further questions, don't hesitate to contact the support team via chat or support@walls.io!