How to exclude specific content from API output

This article outlines methods for excluding specific content from generated documents, enabling you to remove elements from the output, such as cookie consent pop-ups, sidebars, floating elements, and similar.

1. CSS class-based content exclusion

Assign either pdfcrowd-remove or pdfcrowd-hide classes to the element:

<div id="sidebar" class="pdfcrowd-remove">Will be removed</div>
<div id="sidebar" class="pdfcrowd-hide">Will be hidden</div>

Alternatively, use the pdfcrowd-convert-only-this class to specify elements that should be exclusively converted; other content will be excluded.

<div id="main-content" class="pdfcrowd-convert-only-this">Only this element will be converted.</div>

2. Custom CSS for content exclusion

If you prefer not to modify the HTML or CSS directly, you can inject custom CSS rules into the conversion process to remove specific elements:

.sidebar, .cookies-box {
    display: none !important;
}

Integration options:

API: Apply the custom style through the setCustomCss option.
WordPress plugin: This feature is available under the Basic Settings tab > General Options section > Custom CSS.

3. Using the pdfcrowd-body class for conditional styling

Another method for targeting elements only during the conversion process is by using the pdfcrowd-body class, which is automatically applied to the <body> element by the PDFCrowd service. This allows the implementation of CSS rules specifically tailored to the conversion scenario. For instance, to remove the sidebar only in the converted document, add this rule to your stylesheet:

.pdfcrowd-body #sidebar { 
    display: none; 
}

4. Conditional CSS for print media

You can define a CSS rule specifically for print media types to manage how elements appear in printed documents. Use a media query like this:

@media print {
    .no-print { display: none; }
}

This approach allows elements such as sidebars to be excluded from the print output by adding the no-print class to the HTML element:

<div id="sidebar" class="no-print">Screen only, not printed</div>

Integration options:

API: Enable @media print using the setUsePrintMedia option.
WordPress plugin: Adjust settings under the Expert Settings tab > General Options section > Use Print Media.
Save to PDF Link: Utilize the use_print_media URL parameter.

5. Using custom JavaScript for content exclusion

An additional non-intrusive method involves using custom JavaScript, which is executed just before the conversion process begins. Here's how you can remove an element like a sidebar:

document.querySelectorAll('#sidebar').forEach(element => {
  element.remove();
});

Alternatively, if jQuery is available, you can achieve the same result with:

$("#sidebar").remove()

Integration Options:

API: Inject the custom JavaScript using the setCustomJavascript option.
WordPress plugin: Add the JavaScript code under the Basic Settings tab > General Options section > Custom JavaScript field.

6. Z-index based content removal

For instances where you need to clear elements that may obscure your content, such as cookie consent dialogs or pop-up windows, an additional method is to use the removeZIndexHigherThan() function from the libPdfcrowd library. This function removes all elements with z-index greater than a specified value, ensuring your content is unobstructed:

libPdfcrowd.removeZIndexHigherThan({zlimit: 100});

This code can be injected in the same manner as described in the previous section.