Easy Font Previewer

Minimal font preview plugin for font product pages. Automatic font detection with shortcode integration.

Credits

Easy Font Previewer is based on the Font Type Tester plugin.

Original Author: mitradranirban Original Plugin URL: https://github.com/mitradranirban/font-type-tester License: GPL v2 or later

Description

Easy Font Previewer is a lightweight, secure, and minimal plugin designed for type foundries and font stores. It allows you to create elegant, responsive font testing areas on your WordPress site.

Upload your font files (WOFF2/WOFF) directly to a custom "Font Product" post type, and automatically generate a preview area where users can type their own text, adjust size, line height, letter spacing, and test different variants (e.g. Regular, Bold).

Key Features:

• Easy Font Upload - Upload WOFF2 and WOFF files via WordPress Media Library
• Shortcode Integration - Embed font previews in any page, post, or product template using [easy_font_preview]
• Multi-Variant Support - Add multiple weights/styles (e.g. Regular, Bold) for a single font
• Full Typography Controls - Size, Line Height, Letter Spacing, Alignment, Transform
• UI Customization - Customize button colors, borders, and fonts to match your theme via Admin Appearance settings
• Glyph Map Preview - View the complete character set (Uppercase, Lowercase, Numbers, Symbols)
• Clean Minimal UI - Fixed black text on white background for optimal font readability
• Secure & Performant - Strict file validation, scoped styles, and vanilla JavaScript (no jQuery dependency on frontend)
• WooCommerce Integration - Seamlessly link fonts to products via the "Font Preview Settings" meta box.
• Auto-Link Support - Automatically displays the correct font on product pages without manual IDs.
• Global & Scoped Usage - Use globally via shortcode or strictly scoped to a specific product.

Installation

1. Upload the plugin files to the /wp-content/plugins/font-type-tester directory (or search for "Easy Font Previewer" in plugin directory).
2. Activate the plugin through the 'Plugins' screen in WordPress.
3. Use the Easy Font Previewer menu to add a new font.
4. Upload your WOFF2 and WOFF files.
5. Use the shortcode [easy_font_preview] on any page to display the preview.
6. WooCommerce Users: Edit a Product, find "Font Preview Settings" in the sidebar, and select your font. The preview will automatically appear on the product page.

Usage

1. Go to Easy Font Previewer.
2. Enter the font name.
3. In the "Font Files" box, click "Add Variant".
4. Enter a Label (e.g. "Bold") and Weight (e.g. 700).
5. Upload your WOFF2 file (required) and WOFF (optional).
6. Publish the post.
7. Copy the shortcode from the sidebar and paste it into your content area (or use a page builder).
8. Go to Easy Font Previewer > Appearance to customize the UI colors and fonts.

WooCommerce Integration

1. Ensure WooCommerce is active.
2. Edit a Product.
3. Locate the Font Preview Settings meta box (sidebar).
4. Select a published Font Product from the list.
5. Save the product. The preview will automatically appear on the frontend product page.

Screenshots

1. Font Preview Interface - The frontend tester with real-time controls.
2. Admin Interface - Easy upload and management of font variants.

Changelog

1.0.0

• Initial Release as Easy Font Previewer.
• Rebrand and Refactor of Font Type Tester.
• New Feature: WooCommerce Product Integration (Link fonts to products via Admin UI).
• Improved: Shortcode [easy_font_preview] now automatically detects linked fonts on product pages.
• Refactor: Modularized integration logic.
• Improved security and codebase cleanup.
• Multi-variant support standard.
• Added Appearance Settings for UI customization.