How to Add Custom Fonts and Fields to Shopify Invoice Templates

Struggling to make your Shopify invoices match your brand’s unique aesthetic? Whether you are a high-end boutique needing specific typography or a B2B wholesaler requiring custom data fields like VAT numbers or purchase order tags, standard templates often fall short.

This guide will show you how to break free from generic paperwork. We will walk through the process of injecting your brand’s personality and necessary business data directly into your billing documents to ensure every touchpoint with your customer is professional and complete.

Quick Answer

You add custom fonts and fields to Shopify invoices, and achieve full design control by using Order Printer Pro, which allows for HTML/Liquid customization. To add custom fonts, you link your web font (like Google Fonts) in the template code; for custom fields, you pull in Shopify Metafields or Order Tags. This unlocks a white-label experience that keeps your branding consistent and ensures all legal or logistical data is clearly communicated to your buyers.

What are Custom Fonts and Fields?

Custom fonts allow you to use your brand’s specific typography (like Montserrat or Playfair Display) instead of standard system fonts. Custom fields refer to specific data points, such as "Expected Delivery Date," "Customer VAT Number," or "Special Handling Instructions", that aren't included in Shopify's default invoice layout.

Who needs Custom Invoices?

• Luxury Brands: Who need typography to match their high-end web design.

• B2B & Wholesale Merchants: Who must display specific tax IDs or PO numbers.

• International Sellers: Who need to translate fields or add region-specific legal disclaimers.

• Manufacturers: Who require technical product specifications (via Metafields) on packing slips.

Why Customizing Invoices Matters for Shopify Merchants

• Brand Authority: A cohesive look from storefront to inbox builds massive trust.

• Reduced Support Tickets: Including specific order details (fields) answers customer questions before they are asked.

• Legal Compliance: Easily add tax-compliant fields required in certain countries.

• Improved Fulfillment: Custom fields on packing slips help warehouse staff identify specific requirements quickly.

• Higher Professionalism: Stand out from competitors using "out-of-the-box" templates.

How to Set Up Custom Fonts and Fields on Shopify

Step 1: Prepare your data and assets

Before editing, identify which fonts you want to use (ensure they are hosted on Google Fonts or your own server) and which Metafields you need to display. If you haven't created your Metafields in Shopify Admin yet, do that under Settings > Custom Data so the information is ready to be pulled into your invoice.

Step 2: Install Order Printer Pro

Standard Shopify templates are limited. Install Order Printer Pro to access the code editor. Once installed, select the template you wish to customize (e.g., Invoice or Packing Slip). The app comes with a 14-day free trial for paid plans, but a free version is available for stores with under 50 orders per month.

Step 3: Add Custom Fonts via CSS

In the template editor, you can add an @import rule at the top of the CSS section to bring in your brand fonts. For example, if using Google Fonts, you would paste the provided code snippet into the <style> block of your template. This ensures that when the PDF is generated, it renders with your chosen typography.

Step 4: Map Custom Fields using Liquid

To display custom info, you will use Liquid code. In Order Printer Pro, you can insert tags like {{ attributes["VAT Number"] }} or {{ line_item.product.metafields.custom.spec_sheet }}. This dynamically pulls the specific data for each order or product directly onto the printed page.

Step 5: Test the flow and print

Use the Preview function within Order Printer Pro to see how a real order looks with the new font and fields. Check for alignment and readability. Once satisfied, print a sample PDF to ensure the font renders correctly across different devices and browsers.

Order Printer Pro Real-Life Use Cases

The Custom Manufacturer Cornish Beds)

• Business: Cornish Beds (UK)

• Industry: Furniture / Manufacturing

• Problem: Needed highly personalized documents that reflected their unique brand and technical requirements.

• The Setup: Used Order Printer Pro to create templates that are highly personalized to their specific tech stack.

• Result: The app became irreplaceable, acting as an extension of their one-person team to maintain professional standards.

Best Practices for Invoice Printing

• Use Web-Safe or Hosted Fonts: Ensure your custom fonts are properly hosted so they don't default to Times New Roman.

• Keep Layout Simple: Don't let custom fields clutter the page; use bolding for headers to keep it scannable.

• Leverage Metafields: Use Product Metafields for technical specs and Order Metafields for shipping instructions.

• Include your Logo: Always pair custom fonts with a high-resolution logo for maximum brand impact.

• Test with Long Text: Make sure your layout doesn't break if a customer enters a very long note or address.

• Consult Support: If you aren't a coder, use the Order Printer Pro 24/7 support team to help with CSS/HTML tweaks.

Summary

Adding custom fonts and fields is the fastest way to transform your Shopify paperwork from a basic receipt into a professional brand asset. By using Order Printer Pro, you can easily integrate Google Fonts and pull in dynamic Metafields without needing to be a master developer.

The core steps are:

1. Install a flexible template app.

2. Link your brand fonts in the CSS.

3. Use Liquid tags to display your custom data fields.

If you want help setting this up or need a custom coding tweak for your fonts, you can try Order Printer Pro here.