WPD Fonts
Posted at 

September 10, 2019

 | 
By 

Olypme QUENUM

 | 

What is the font feature?

Fonts are one of the most critical yet basic features when doing design and our product designer plugin is built to prioritize this for you. Ouidah, our WooCommerce Product Designer plugin does not only allow you to use Google fonts in your designs but also to add custom TTF fonts which you can use directly on the canvas and in the output PDF files.

The Fonts interface allows you to define which fonts you would like your clients to use when adding text to their designs. If you don’t define any font, the system default fonts will be used. See how to manage fonts in the plugin below:

To manage the fonts, go to WPD > Fonts to access the fonts list.

How to add Google Fonts?

Google Fonts are one of the most popular and free web fonts libraries in the world. To add a Google font:

    1. Click on the fonts dropdown in order to select the one you want.

    1. You’ll need to define the TTF fonts which will be needed to be used in the output files. We will talk about it in the third section of this tutorial.
    2. Click on the Add Font button to save your newly selected font into the product designer.

 

How to add custom web fonts?

  1. Enter the font name in the name field.
  2. Enter the font css file URL in the URL field.
  3. You’ll need to define the TTF fonts that will need to be used in the output files but we’ll get back to it in the third section of this tutorial.
  4. Click on the Add Font button to save your newly selected font into the product designer.

 

How to add TTF fonts in Ouidah WooCommerce Product Designer?

Custom TTF fonts are also supported by our Ouidah WooCommerce product designer. In order to add a TTF file take the following steps:

  1. Visit https://transfonter.org/ to convert your TTF file to a web ready file. This will make sure your file can be read by any browser.
  2. Enter the font name in the name field.
  3. Leave the URL field empty.
  4. Click on the Add font file button to select the converted TTF file from the step 1 related to the font you’re trying to add using wordpress’s default media uploader.
  5. Each TTF file contains one or multiple font styles such as italic, bold and other. You need to make sure the TTF font file you just set has all it’s styles properly checked. For example, the ALEO font comes in multiple files such as:
    • Regular
    • Regular Italic
    • Bold
    • Bold Italic

While defining the font files, you’ll need to make sure that the “regular” ttf file has only the regular style checked. Then the “Regular Italic” will have both styles checked and so on.

Click on the Add Font button to save your newly selected font into the product designer.

That’s it. Still having issues adding fonts? Reach out to us via the comment section below.

 

 

4 comments

  1. Vannessa Pouncey

    how do I adjust the letter spacing of the text when I’m making templates?

    September 22, 2020 at 9:52 pm
    Reply
    • Bellarmin

      Hi Vannessa,
      The letter-spacing feature is only available for curved text currently in the plugin.Thanks

      November 2, 2020 at 8:40 pm
      Reply
  2. christian

    Hello good day 🙂
    I get the fonts to be seen..
    I can’t change its design,
    I can’t solve the problem, can you help me?
    Would I have to buy a paid version for it to work?
    Thank you very much

    October 23, 2020 at 10:30 am
    Reply
    • Bellarmin

      Hi Christian,
      You should normally be able to add and see the fonts on the design page without having the paid version. Please submit a ticket to our support just by clicking the chat button on our site and we will help you resolve your issue, it may be a setting issue.

      November 2, 2020 at 5:01 pm
      Reply

Leave a comment

Your email address will not be published. Required fields are marked *