When a new order is created in Shopify, many merchants want to automatically:
Generate a PDF invoice
Send a confirmation email
Store or archive the document
Trigger backend processes
But doing this manually β or building your own PDF generation engine β is complex and time-consuming.
In this article, Iβll show you how to integrate Shopify Webhooks with the TemplateMaster API to automatically send invoices and emails whenever a new order is created.
This works with any backend language (C#, Node.js, Python, PHPβ¦).
π§© What is TemplateMaster?
TemplateMaster is a SaaS designed for developers and businesses who need:
π HTML/CSS template editor
π PDF generation via API
βοΈ Email sending API
π API key protection
π§© JSON-based dynamic rendering
ποΈ Storage + versioning of templates
It is perfect for invoices, receipts, order confirmations, shipping docs, etc.
π Try it here: https://templatemaster.fr
π¦ Shopify Webhook + TemplateMaster Workflow
- Customer places an order β¬οΈ
- Shopify triggers the orders/create webhook β¬οΈ
- Your server receives the webhook β¬οΈ
- Your server calls TemplateMaster API to:
Generate a PDF invoice
Send an email to the customer (with PDF attached)
β¬οΈ
- Shopify customer receives your customized invoice
1. Configure the Shopify Webhook
In Shopify Admin:
Settings β Notifications β Webhooks β Create Webhook
Event: Order creation (orders/create)
Format: JSON
URL: Your API endpoint (e.g. https://your-server.com/webhooks/shopify/order-created)
Shopify will POST the full order JSON to your server.
2. Example of Webhook Receiver (Node.js)
This endpoint receives the Shopify order JSON and generates a PDF invoice through TemplateMaster.
import express from "express";
import axios from "axios";
const app = express();
app.use(express.json());
app.post("/webhooks/shopify/order-created", async (req, res) => {
const order = req.body;
try {
// Call TemplateMaster to generate a PDF + send email
await axios.post(
"https://api.templatemaster.fr/generate/pdf-email",
{
templateId: "your-invoice-template-id",
data: order, // You can remap fields if needed
email: {
to: order.email,
subject: `Invoice for Order #${order.name}`
}
},
{
headers: {
"X-API-KEY": process.env.TM_API_KEY
}
}
);
res.status(200).send("OK");
} catch (err) {
console.error(err);
res.status(500).send("Error");
}
});
app.listen(3000, () => console.log("Server running"));
3. Example in C# (.NET)
using System.Net.Http;
using System.Text;
var client = new HttpClient();
client.DefaultRequestHeaders.Add("X-API-KEY", "YOUR_API_KEY");
app.MapPost("/webhooks/shopify/order-created", async (Order order) =>
{
var requestBody = new
{
templateId = "your-invoice-template-id",
data = order,
email = new
{
to = order.email,
subject = $"Invoice for Order {order.name}"
}
};
var json = System.Text.Json.JsonSerializer.Serialize(requestBody);
var content = new StringContent(json, Encoding.UTF8, "application/json");
await client.PostAsync("https://api.templatemaster.fr/generate/pdf-email", content);
return Results.Ok();
});
4. Template Structure (Invoice Example)
Inside your TemplateMaster HTML template, simply use JSON placeholders:
<h1>Invoice β Order {{name}}</h1>
<p>Date: {{created_at}}</p>
<p>Customer: {{customer.first_name}} {{customer.last_name}}</p>
<table>
<tr>
<th>Item</th>
<th>Qty</th>
<th>Price</th>
</tr>
{{#each line_items}}
<tr>
<td>{{title}}</td>
<td>{{quantity}}</td>
<td>{{price}}</td>
</tr>
{{/each}}
</table>
<p>Total: {{total_price}} {{currency}}</p>
TemplateMaster automatically applies your CSS and returns a beautiful PDF.
5. Bonus Features You Can Add
βοΈ Send emails to the store owner
βοΈ Send packing slips to warehouse staff
βοΈ Add customer notes, discount codes, fulfillment info
βοΈ Save PDFs to your storage (S3, Azure, etc.)
βοΈ Use multiple templates depending on order type
π Conclusion
With just a few lines of code, you can fully automate:
PDF invoice generation
Order confirmation emails
Document storage
Multi-store workflows
Using Shopify Webhooks + TemplateMaster API is a powerful way to build scalable, automated document flows without maintaining your own rendering engine.
π Try it now: https://templatemaster.fr
Top comments (0)