How to Generate Dynamic PDF E-commerce Invoice using PDF.co Web API

In this tutorial, we will show you how to generate a dynamic PDF e-commerce invoice using PDF.co Web API.

Step 1: Open PDF.co Account

  • To begin. Let’s start by logging into your PDF.co account and clicking on the Request Tester menu.
Request Tester

Step 2: Request Tester Page

  • For the Choose PDF.co API endpoint, search and select /pdf/convert/from/html(json input). This endpoint scale and automates PDF generation using an HTML template.
  • In the templateId param, enter the ID of your HTML template. You can create a custom HTML template.
  • In the name param, type in your desired PDF file name.
  • For the templateData param, input the JSON data.
Request Tester Page
Request Tester Page

Template Data

{\"company_address\": \"1234 Market St\\nSan Francisco, California 94102\\nUSA\",\"order_id\": \"1122455\",\"order_date\": \"15 Jan 2022\",\"customer_id\": \"T8001\",\"shipped_date\": \"20 Jan 2022\",\"shipped_via\": \"UPS\",\"bill_to_name\": \"John Doe\",\"bill_to_address\": \"435 South La Fayette Park Place, \\nLos Angeles, CA 90057\\nUSA\",\"ship_to_name\": \"Jean Doe\",\"ship_to_address\": \"18144 El Camino Real\\nSunnyvale, California\\nUSA\",\"freight\": 19.95,\"notes\": \"Thank you for your purchase.\",\"items\": [ { \"name\": \"T-800 Product 1\", \"price\": 50.0, \"quantity\": 2 }, { \"name\": \"T-800 Product 2\", \"price\": 150.0, \"quantity\": 3 }, { \"name\": \"T-800 Product 3\", \"price\": 20.0, \"quantity\": 1 }, { \"name\": \"T-800 Product 4\", \"price\": 24.99, \"quantity\": 5 }, { \"name\": \"T-800 Product 5\", \"price\": 199.0, \"quantity\": 1 }, { \"name\": \"T-800 Product 6\", \"price\": 19.0, \"quantity\": 5 }, { \"name\": \"T-800 Product 7\", \"price\": 20.0, \"quantity\": 1 }, { \"name\": \"T-800 Product 8\", \"price\": 49.0, \"quantity\": 5 }, { \"name\": \"T-800 Product 9\", \"price\": 1000.0, \"quantity\": 1 }, { \"name\": \"T-800 Product 10\", \"price\": 30.0, \"quantity\": 5 }, { \"name\": \"T-800 Product 11\", \"price\": 10.0, \"quantity\": 1 }, { \"name\": \"T-800 Product 12\", \"price\": 30.0, \"quantity\": 5 }, { \"name\": \"T-800 Product 1\", \"price\": 12.0, \"quantity\": 1 }, { \"name\": \"T-800 Product 14\", \"price\": 25.0, \"quantity\": 5 }, { \"name\": \"T-800 Product 15\", \"price\": 24.99, \"quantity\": 1 }, { \"name\": \"T-800 Product 16\", \"price\": 30.0, \"quantity\": 5 }, { \"name\": \"T-800 Product 17\", \"price\": 12.0, \"quantity\": 1 }, { \"name\": \"T-800 Product 18\", \"price\": 25.0, \"quantity\": 5 }, { \"name\": \"T-800 Product 19\", \"price\": 24.99, \"quantity\": 1 }, { \"name\": \"T-800 Product 20\", \"price\": 30.0, \"quantity\": 5 }]\r\n}

Once you are done adding the JSON data, click on the Run Request button to see the result.

Step 3: Run Request Result

  • Great! The request runs successfully, click the resulting URL to view the output or directly download the output file.
Run Request Result

Step 4: Generated Dynamic PDF

  • Here’s what the generated Dynamic PDF e-commerce invoice looks like
Generated Dynamic PDF E-commerce Invoice
Generated Dynamic PDF E-commerce Invoice

In this tutorial, you learned how to generate dynamic PDF e-commerce invoices using PDF.co Web API. You also learned how to create an HTML template ID.