In this short article, I will show you how you can import Google fonts for the EmbedSocial widget embedded on your website.

Before we start, please go to Google Fonts and select the desired font.

Choose the font styling you want to have and click on +Select this style

On the right hand side menu

  •  Go to Embed
  • Click on @import
  • Copy the import code without the <style> tags
  • Copy the CSS rules

Once you have the code copied, go back to your EmbedSocial account and open up one of your widgets.

In the settings on the right hand side, go to Layouts and paste the code in the Custom CSS field.

First, paste the code:

@import url('https://fonts.googleapis.com/css2?family=Comic+Neue:wght@300&display=swap');

The CSS rules code should be inside the body section.

Paste the CSS rules after the code adding body { at the beginning of the CSS rules and } at the end:

body {font-family: 'Comic Neue', cursive; }

This is the example of how the code should appear in the CSS field:

@import url('https://fonts.googleapis.com/css2?family=Comic+Neue:wght@300&display=swap');
body {font-family: 'Comic Neue', cursive; }

Make sure to click on Save Changes once you're done.

That's it!

If you are not using Google Fonts and you have your own custom fonts, please send the font files to support@embedsocial.com and we will import them for you.

For any questions or additional assistance feel free to reach out and chat with us.

We're happy to help.

Did this answer your question?