HTML to PDF Guide

How to integrate the HTML to PDF Converter to save web pages as PDF using iLovePDF’s REST API.

Remember that in order to use our Tool Guides, you need to have previous knowledge about the basics to processing a PDF with our REST API. We strongly recommend that you read the Processing a PDF guide before starting this one.

Basic HTML to PDF

The following are the four basic lines to work with HTML to PDF:

Basic HTML to PDF

// Create a new task
$myTaskHtmlpdf = $ilovepdf->newTask('htmlpdf');
// Add url to task for process
$file = $myTaskHtmlpdf->addUrl('https://ilovepdf.com');
// Execute the task
$myTaskHtmlpdf->execute();
// Download the pdf file
$myTaskHtmlpdf->download();

// Under construction

# Under construction

const task = ilovepdf.newTask('htmlpdf') as HtmlPdfTask;

task.start()
.then(() => {
    return task.addFile('https://ilovepdf.com');
})
.then(() => {
    return task.process();
})
.then(() => {
    return task.download();
})
.then((data) => {
    fs.writeFileSync('path/to/local/file_name.pdf', data);
});

You can add as many urls as you want to convert after creating a task for the HTML to PDF tool to process.

Advanced HTML to PDF

You can customize some options of your HTML conversion to PDF with the following functions:

Change PDF orientation

// Choose your processing tool
$myTaskHtmlpdf = $ilovepdf->newTask('htmlpdf');
// Set your tool options
$myTaskHtmlpdf->setPageOrientation('landscape');

// Under construction

# Under construction

const task = ilovepdf.newTask('htmlpdf') as HtmlPdfTask;

task.start()
.then(() => {
    return task.addFile('https://ilovepdf.com');
})
.then(() => {
    return task.process({ page_orientation: 'landscape' });
})
.then(() => {
    return task.download();
})
.then((data) => {
    fs.writeFileSync('path/to/local/file_name.pdf', data);
});

With orientation you can change your final PDF file from portrait to landscape.

Set page margin

// Choose your processing tool
$myTaskHtmlpdf = $ilovepdf->newTask('htmlpdf');
// Set your tool options
$myTaskHtmlpdf->setPageMargin(20);

// Under construction

# Under construction

const task = ilovepdf.newTask('htmlpdf') as HtmlPdfTask;

task.start()
.then(() => {
    return task.addFile('https://ilovepdf.com');
})
.then(() => {
    return task.process({ page_margin: 20 });
})
.then(() => {
    return task.download();
})
.then((data) => {
    fs.writeFileSync('path/to/local/file_name.pdf', data);
});

page-margin allows you to set a margin between the PDF page and its content. If you don’t set any margin, your final PDF will have no margin.

Set page size

// Choose your processing tool
$myTaskHtmlpdf = $ilovepdf->newTask('htmlpdf');
// Set your tool options
$myTaskHtmlpdf->setPageSize('A4');

// Under construction

# Under construction

const task = ilovepdf.newTask('htmlpdf') as HtmlPdfTask;

task.start()
.then(() => {
    return task.addFile('https://ilovepdf.com');
})
.then(() => {
    return task.process({ page_size: 'A4' });
})
.then(() => {
    return task.download();
})
.then((data) => {
    fs.writeFileSync('path/to/local/file_name.pdf', data);
});

One way to ensure that your final PDF has a document size is to force it with page-size. The API provides several standard sizes to choose from:

A3, A4, A5, A6. Your final document will have an AX standard size and your web page will fit in that size.
Letter. Your final document will have Letter standard size and your web page will fit in that size.
Fit, Auto. Your final document will have the same size as the original web page.

Viewer Width

// Choose your processing tool
$myTaskHtmlpdf = $ilovepdf->newTask('htmlpdf');
// Set your tool options
$myTaskHtmlpdf->setViewWidth(850);

// Under construction

# Under construction

const task = ilovepdf.newTask('htmlpdf') as HtmlPdfTask;

task.start()
.then(() => {
    return task.addFile('https://ilovepdf.com');
})
.then(() => {
    return task.process({ view_width: 850 });
})
.then(() => {
    return task.download();
})
.then((data) => {
    fs.writeFileSync('path/to/local/file_name.pdf', data);
});

With view-width option you can set how the size of the device screen where the website would be rendered. You can choose these screen sizes by width in pixels. Default value is 1980.

Make a single output page

// Choose your processing tool
$myTaskHtmlpdf = $ilovepdf->newTask('htmlpdf');
// Set your tool options
$myTaskHtmlpdf->setSinglePage(true);

// Under construction

# Under construction

const task = ilovepdf.newTask('htmlpdf') as HtmlPdfTask;

task.start()
.then(() => {
    return task.addFile('https://ilovepdf.com');
})
.then(() => {
    return task.process({ single_page: true });
})
.then(() => {
    return task.download();
})
.then((data) => {
    fs.writeFileSync('path/to/local/file_name.pdf', data);
});

When single-page is true, the web page will be converted into a single PDF page document as long as the website, instead of being separated by PDF pages. That is all you can do with HTML to PDF converting.