Search Over 30,000 FREE Plugins from the Official WordPress Plugin Directory Repository


This is a plugin directed primarily at type designers, foundries or resellers to showcase webfonts by embedding interactive specimens via shortcodes.

This is a plugin directed primarily at type designers, foundries or resellers using Wordpress to showcase their fonts.

The plugin allows you to embed interactive webfont specimens on your site via shortcodes. Users can preview, type with, and switch the webfonts in a preview, as well as use other interface options to manipulate the font sample.

After installing the plugin and creating a Fontsampler, you are able to showcase a set of webfonts by adding a simple [fontsampler id=123] shortcode to any page or post.

More information and clickable examples available on the plugin website.

Features include:

  • Interactive text field where users can type to preview the font
  • Controls for switching between fonts (if several are added to one Fontsampler)
  • Slider controls for manipulating font size, letter spacing & line height
  • Customizable dropdown with preset texts
  • Automatic detection and controls for testing Opentype features
  • Switches for alignment and inverting the text and background color
  • Support for any language script and script direction
  • Supports woff2, woff, eot and ttf files
  • Unlimited Fontsamplers per page
  • Customizable interface layout
  • Customizable interface styling (colors)
Author Johannes Neumeier
Contributors kontur
Tags fonts, preview, shortcode, typeface
  1. fontsampler screenshot 1

    The Fontsampler plugin comes with plenty of customizable options to tweak the appearance and interface of your webfont previews

  2. fontsampler screenshot 2

    You can go minimal on the UI, or even without any options at all

  3. fontsampler screenshot 3

    The main elements of the UI can be styled site-wide from the settings

  4. fontsampler screenshot 4

    Manage your typeface samples via the admin panel

  5. fontsampler screenshot 5

    Settings for many defaults can be tweaked to your site's needs

  6. fontsampler screenshot 6

    This is how you include a Fontsampler in a page or post: Simply add the shortcode for the created Fontsampler to your text

  1. Upload the plugin files to the /wp-content/plugins/fontsampler directory, or install the plugin through the WordPress plugins screen directly.
  2. Activate the plugin through the 'Plugins' screen in WordPress
  3. In the admin sidebar go to Fontsampler to upload font files and create your Fontsamplers


  • Updated to allow for more lenient italic detection (now also from Font name)
  • Fix small possible alignment interference from theme CSS


  • Fontsamplers now support families with different widths
  • Each fontsampler instance is now wrapped in a DOM element with the fontsampler's ID for custom styling
  • Fixed a small interface alignment issues


  • Added editable default setting for alignment
  • Fixed some alignment issues not properly respecting editable UI block height and underline


  • Fontsampler layout preview and manipulation improved, including options for column count and column span of individual user interface elements
  • Fontsampler layout preview now renders an actual mock Fontsampler in the admin interface to better visualise the layout
  • Added option to add links for Buying and viewing a Specimen to the interface
  • Added default label text and images for those two links to the settings
  • Added column and row gutter, as well as row height as customisable settings
  • Activating the "Invert" UI option will add "fontsampler-inverted" to the , so you can define styles for when it's active (e.g. inverting the overall page background color)
  • Improved under the hood generation of css files when customising Fontsampler styling
  • Improved under the hood admin javascript loading


  • Initial public release

Can I control which user interface elements are visible?

Absolutely. You can enable and arrange each interface element for every Fontsampler

Do I have to configure each Fontsampler if I have several?

There are defaults for the sliders as well as which interface elements are visible that get applied to all Fontsampler that are set to use the default values.

Version 0.1.4

Requires WordPress version: 4.0 or higher

Compatible up to: 4.7.2

Last Updated 06 Jan 2017

Date Added: 23 Nov 2016

Plugin Homepage


3.7 stars
3 ratings


Not Enough Data

Works: 0
Broken: 0