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 :)

See our featured website design work

Check out some of the beautiful websites we’ve built for over 2,000 clients.

We offer WordPress support & maintenance

Shake the stress of ongoing maintenance with plans supported by our team of WordPress experts.

Related articles