Web Design & Development

Convert Type File Into Webkit & Install Webkit

Looking for instructions in how to convert Font File to a Webkit AND install that Webkit?

Look no further — we’ve got you covered.

Converting the File to a Webkit

  1. Download a font to get the OTF or TTF file.
  2. Visit – transfonter.org
  3. Click Add font(s).
  4. Leave “Family support” checked on and other 3 options off.
  5. Select TTF, WOFF, EOT and WOFF2 formats.
  6. Click “Covert.”

Installation of Webkit

  1. Open up FileZilla.
  2. Create a new site or log into the existing site you want to add the webkit to.
  3. Navigate to /wp-content.
  4. Inside /wp-content, create a new folder called “fonts.”
  5. Place the webkit file (extracted file, not compressed/zip file) into the “fonts” folder.
    Should look something like: /wp-content/fonts/fontnamehere.eot
  6. In the backend of your site, copy the CSS code from the .css file in your webkit, paste the CSS into the theme editor.
  7. Add the proper filename path in front of the src url and url links. Example: src: url(‘/wp-content/fonts/fontnamehere.eot’);
  8. Create your class/classes to pull in the font-family.

Finally, add the class that you created to the elements you want to be the specific font :)

Need help?

Tell us about your project!

This field is for validation purposes and should be left unchanged.

Related articles