Watermark Image Guide

Develop your own solution to protect images and photos with custom watermarks by integrating with iLoveIMG’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 add a watermark

You can add a watermark to your PDF files as shown in this code:

Start task

// Create a new task
$myTaskConvert = $iloveimg->newTask('convert');

// Add files to task for upload
$file1 = $myTaskConvert->addFile('path/to/file1_name.jpg');

$myTaskConvert->setTo('gif');

// Execute the task
$myTaskConvert->execute();

// Download the package files
$myTaskConvert->download();

The Watermark tool is composed of 2 different elements that can be configured throught the property type: text type adds text watermarks and image type adds image-based watermarks. The image type is limited to PNG and JPG format files no bigger than 1Mb.

There is a list of default settings which can be customized, as you will see later.

Advanced add watermarks

Setting watermark opacity

// Select watermark parameters
$myTaskWatermark->setText('iLovePDF');
$myTaskWatermark->setOpacity(50);
// Execute the task
$myTaskWatermark->execute();

// Select watermark parameters
var parameters = new WatermarkParams(
                new WatermarkModeText("watermark text"))
            {
                Transparency = 50
            };
// Execute the task
taskWatermark.Process(parameters);

# Select watermark parameters
my_task_watermark.transparency = 50
# Execute the task
my_task_watermark.execute();

const task = ilovepdf.newTask('watermark') as WatermarkTask;

task.start()
.then(() => {
    return task.addFile('path/to/file1_name.pdf');
})
.then(() => {
    return task.process({ text: 'myWatermarkText', transparency: 50 });
})
.then(() => {
    return task.download();
})
.then((data) => {
    fs.writeFileSync('path/to/local/file_name.pdf', data);
});

With transparency you can set the opacity intensity of a watermark for both the text (as shown on the code example) and image files.

Setting watermark position

Setting watermark layer depth

// Select watermark parameters
$myTaskWatermark->setText(‘iLovePDF’);
$myTaskWatermark->setLayer('below');
// Execute the task
$myTaskWatermark->execute();

// Select watermark parameters
var parameters = new WatermarkParams(
                new WatermarkModeText("iLovePDF"))
            {
                Layer = Layer.below
            };
// Execute the task
taskWatermark.Process(parameters);

# Select watermark parameters
my_task_watermark.text  = 'iLovePDF'
my_task_watermark.layer = 'below'
# Execute the task
my_task_watermark.execute

const task = ilovepdf.newTask('watermark') as WatermarkTask;

task.start()
.then(() => {
    return task.addFile('path/to/file1_name.pdf');
})
.then(() => {
    return task.process({ text: 'myWatermarkText', layer: 'above' });
})
.then(() => {
    return task.download();
})
.then((data) => {
    fs.writeFileSync('path/to/local/file_name.pdf', data);
});

With gravity will place your watermark according different document locations. Accepted values are: North, NorthEast, NorthWest, Center, CenterEast, CenterWest, East, West, South, SouthEast, SouthWest

Also, you can define vertical_adjustment_percent and horizontal_adjustment_percent in order to move the element vertically or horizontally having as an origin the selected gravity origin.

Watermark mosaic

// Select watermark parameters
$myTaskWatermark->setText('iLovePDF');
$myTaskWatermark->setMosaic(true);
// Execute the task
$myTaskWatermark->execute();

// Select watermark parameters
var parameters = new WatermarkParams(
                new WatermarkModeText("iLovePDF"))
            {
                Mosaic = true
            };
// Execute the task
taskWatermark.Process(parameters);

# Select watermark parameters
my_task_watermark.text = 'iLovePDF'
my_task_watermark.mosaic = true
# Execute the task
my_task_watermark.execute

const task = ilovepdf.newTask('watermark') as WatermarkTask;

task.start()
.then(() => {
    return task.addFile('path/to/file1_name.pdf');
})
.then(() => {
    return task.process({ text: 'myWatermarkText', mosaic: true });
})
.then(() => {
    return task.download();
})
.then((data) => {
    fs.writeFileSync('path/to/local/file_name.pdf', data);
});

If mosaic is set to true, will stamp a 3x3 matrix mosaic of your watermark.

Watermark rotation

// Select watermark parameters
$myTaskWatermark->setText('iLovePDF');
$myTaskWatermark->setRotation(30);
// Execute the task
$myTaskWatermark->execute();

// Select watermark parameters
var parameters = new WatermarkParams(
                new WatermarkModeText("iLovePDF"))
            {
                Rotation = 30
            };
// Execute the task
taskWatermark.Process(parameters);

# Select watermark parameters
my_task_watermark.text = 'iLovePDF'
my_task_watermark.rotate = 30
# Execute the task
my_task_watermark.execute

const task = ilovepdf.newTask('watermark') as WatermarkTask;

task.start()
.then(() => {
    return task.addFile('path/to/file1_name.pdf');
})
.then(() => {
    return task.process({ text: 'myWatermarkText', rotation: 30 });
})
.then(() => {
    return task.download();
})
.then((data) => {
    fs.writeFileSync('path/to/local/file_name.pdf', data);
});

rotation will stamp your watermark rotated by the specified degrees amount.

Set a watermark font format

Note that this function only works with the text based watermarks. Trying to customize a font with an image will give an error.

Set a watermark font format

// Select watermark parameters
$myTaskWatermark->setText('iLovePDF');
$myTaskWatermark->setFontFamily('courier');
$myTaskWatermark->setFontSize(18);
$myTaskWatermark->setFontColor('#ffffff');
// Execute the task
$myTaskPageNumbers->execute();

// Select watermark parameters
var parameters = new WatermarkParams(
                new WatermarkModeText("iLovePDF"))
            {
                FontFamily = "Arial",
                FontStyle = FontStyles.Italic,
                FontSize = 12,
                FontColor = "#ff0000",
            };
// Execute the task
taskWatermark.Process(parameters);

# Select watermark parameters
my_task_watermark.text = 'iLovePDF'
my_task_watermark.font_family = 'courier'
my_task_watermark.font_size = 18
my_task_watermark.font_color = '#ffffff'
# Execute the task
my_task_watermark.execute

const task = ilovepdf.newTask('watermark') as WatermarkTask;

task.start()
.then(() => {
    return task.addFile('path/to/file1_name.pdf');
})
.then(() => {
    return task.process({
        font_family: 'Verdana',
        font_style: 'Bold',
        font_size: 20,
        font_color: '#FFFFFF',
    });
})
.then(() => {
    return task.download();
})
.then((data) => {
    fs.writeFileSync('path/to/local/file_name.pdf', data);
});

font_family, font_style, font_size and font_color are properties to customize text font format. The font_family property changes which font will be used, the font_style property changes the text style such as bold or italic, the font_size property changes the font size, and the font_color property changes the color of the watermark text.