Custom Font

🖋️ How to Use Custom Font in Topper Pack (Step-by-Step Guide)

The Custom Font feature in the Topper Pack plugin allows you to upload and manage your own font files, giving you complete control over typography in your Elementor designs.

🔹 Step 1: Enable Custom Font Feature

• Go to Topper Pack → Extra Settings.
• Locate the Custom Font option.
• Toggle the switch to enable it.

Once enabled, a new Custom Fonts menu will appear on the left WordPress admin sidebar.

🔹 Step 2: Access Custom Fonts Panel

• In your WordPress dashboard, click on Topper Pack → Custom Fonts.
• You’ll be directed to the font list screen, where you can manage or add fonts.

🔹 Step 3: Add New Font

• Click on the Add New Font button at the top.
• You’ll be redirected to a form to input font details.

🔹 Step 4: Configure Font Details

• Add Font Name: This is the label that will appear in Elementor’s typography settings.
• Select Font Weight and Font Style: Choose Normal, Bold, Italic, etc.
• Upload Font Files:
  • Upload at least one of the following formats for compatibility:
    • WOFF (best for modern browsers)
    • WOFF2 (smaller size, latest browsers)
    • TTF / OTF (wider support across platforms)
    • SVG / EOT (for legacy browser support)
• You can upload multiple variations (like bold, italic) by clicking Add Variation.

🔹 Step 5: Publish the Font

• After uploading your font files and filling in details, click the Publish button on the right.
• Your custom font is now ready to use!

🔹 Step 6: Use the Font in Elementor

• Open any page in Elementor.
• Select a text widget → Go to Style tab → Typography → Font Family.
• Your uploaded font will appear in the list under the Topper Pack group.