Utilizing SLDS To Prevent The Rendering Of particular Elements Within The LWC Component.

The business may request specific sections of the page to be printed while excluding other elements when saving the file as a PDF or when generating a printout.

The business may request that only specific sections of the page be included in the printout, while excluding other elements when saving the file as a PDF or when generating a printout.

How can we address this use case?

While custom styles can be employed, it’s considered a best practice to explore out-of-the-box features before resorting to custom solutions. This post will guide you through the process of using SLDS-specific classes to exclude certain elements from being printed or saved as PDF.

To achieve this, wrap the element you want to exclude from printing (or saving) using the class slds-no-print.

The complete template file will resemble the following.

<template>
  <div>
    <span>
      <p>HEY!! Salesforce Casts</p>
    </span>
  </div>
  <p class="slds-no-print">This will not be printed (or saved)</p>
</template>