Skip to main content

​
Embedding the template builder in your application

The Embedding feature allows you to integrate pdf noodle’s white-label template builder directly into your own application, so your customers can edit and customize specific templates without leaving your app. Perfect for SaaS businesses that want to offer personalized PDF templates to their users.

​
How to Activate Embedding

To start embedding templates, you first need to activate embedding for each specific template you want to share.
  1. Go to the “Embeds” menu on the sidebar.
  2. Click “Embed new template”.
  3. Select the template you want to enable for embedding.
Once you activate embedding, you’ll see detailed instructions on how to integrate it into your app.

​
Generating the JWT Token

The embedding process uses a JWT token to securely identify which template and customer are being customized. You just need to follow the instructions on the embedding page. You’ll need to generate this token using the following payload structure: 
{
  "companyId": "your pdf noodle workspace UUID",
  "templateId": "the ID of the template being embedded",
  "externalId": "your customer’s unique ID in your app",
  "exp": "timestamp when token expires"
}

​
🔐 Secret Key

You’ll find your workspace secret key on the Embeds page. You’ll need this to sign the JWT token.
Hint: You can regenerate your Secret Key anytime you want, but that will make the previous secret key invalid.

​
Embedding the Builder

After generating the token, create an iframe in your application using this format: 
<iframe 
  src="https://app.pdfnoodle.com/embed/template-builder?token=YOUR_JWT_TOKEN" 
  width="100%" 
  height="100%">
</iframe>
Your customer will now see a white-label version of the pdf noodle builder, so they can freely customize their version of the template. Customers can always revert to the default version of the template at any time.

​
Understanding the Data Dictionary

Each template is powered by a data schema that defines the variables you send in your API payload. The data dictionary ensures customers only use variables that exist in your schema — maintaining consistency between your API and their edits.

​
Key Points:

  • Customers can only use existing variables (they’ll see them listed by their label in the text editor).
  • They cannot create new variables not defined in the schema.
  • This is why they also can’t add new columns to tables, new metrics to the Metrics component, or new series to Chart components.
Tip: Keep your data dictionary updated whenever your API schema changes. It ensures smooth synchronization between your system and the embedded editor.

​
Generating PDFs with Customer Customizations

Once your customer customizes a template, generating a PDF with their version is easy, just include their externalId in your API payload. If pdf noodle detects a customization for that customer, it’ll automatically generate their version. If not, it will fallback to the default template.

​
Example API Call

curl --location 'https://api.pdfnoodle.com/v1/pdf/sync' \
--header 'Authorization: Bearer pdfnoodle_api_123456789' \
--header 'Content-Type: application/json' \
--data '{
    "templateId": "check",
    "externalId": "customer-uuid",
    "data":{...}
}
'
📘 Documentation: Check out the full API Reference for details on how to send custom data and handle customer versions.
If you still have questions or feedback about the embedding feature, contact us at [email protected] — we’ll be happy to help!