How to Remove Elements When Converting Webpage to PDF or Image

Learn how to find HTML element class names and IDs using browser developer tools. Remove unwanted sections from your webpage screenshots and PDFs with our advanced element removal feature.

What is Element Removal?

Our "Remove Element from Screenshot" feature allows you to exclude specific HTML elements (like headers, footers, sidebars, ads, or any unwanted sections) from your final PDF or image conversion. Simply provide the class name or ID of the element you want to remove, and our tool will automatically exclude it from the conversion.

How to Find Element Class or ID

To remove an element from your webpage conversion, you need to find its HTML class name or ID. This can be easily done using browser developer tools (also called "Inspect Element"). Follow the instructions below for your browser:

🌐 Google Chrome

  1. Right-click on the element you want to remove from the webpage
  2. Select "Inspect" or "Inspect Element" from the context menu
  3. The Developer Tools panel will open at the bottom or right side of your browser
  4. In the Elements tab, the HTML code for the selected element will be highlighted
  5. Look for the class="..." or id="..." attribute in the highlighted HTML
  6. Copy the class name (without the "class=" part) or ID (without the "id=" part) and paste it into our "Remove Element" field

💡 Quick Tip: You can also press F12 or Ctrl+Shift+I (Windows/Linux) or Cmd+Option+I (Mac) to open Developer Tools

🦊 Mozilla Firefox

  1. Right-click on the element you want to remove
  2. Select "Inspect Element" or "Inspect" from the menu
  3. The Inspector panel will open at the bottom of the browser
  4. The HTML element will be highlighted in the Inspector panel
  5. Find the class or id attribute in the highlighted code
  6. Copy the value (the text inside the quotes) and use it in our removal tool

💡 Quick Tip: Press F12 or Ctrl+Shift+I (Windows/Linux) or Cmd+Option+I (Mac) to open the Inspector

🔷 Microsoft Edge

  1. Right-click on the element you want to exclude from conversion
  2. Click "Inspect" from the context menu
  3. Developer Tools will appear at the bottom or side of the window
  4. Navigate to the Elements tab (if not already selected)
  5. The selected element's HTML will be highlighted - look for class or id attributes
  6. Copy the class name or ID value and paste it into our element removal field

💡 Quick Tip: Use F12 or Ctrl+Shift+I to quickly open Developer Tools

🍎 Safari (Mac)

  1. First, enable Developer menu: Go to Safari → Preferences → Advanced → Check "Show Develop menu in menu bar"
  2. Right-click on the element you want to remove
  3. Select "Inspect Element" from the context menu
  4. The Web Inspector will open at the bottom of the window
  5. In the Elements tab, find the highlighted HTML element
  6. Look for the class or id attribute
  7. Copy the value and use it in our webpage conversion tool

💡 Quick Tip: Press Cmd+Option+I to open Web Inspector after enabling Developer menu

🎭 Opera

  1. Right-click on the element you wish to remove
  2. Choose "Inspect" or "Inspect Element"
  3. Developer Tools panel will open
  4. Go to the Elements section
  5. Locate the class or id in the highlighted HTML
  6. Copy the class name or ID and paste it into our removal tool

💡 Quick Tip: Press Ctrl+Shift+I (Windows/Linux) or Cmd+Option+I (Mac) to open Developer Tools

How to Use Class or ID in WebtoPDFConverter

Once you've found the class name or ID using the browser developer tools, follow these steps to use it in our converter:

1

Open Show Options

On the WebtoPDFConverter homepage, scroll down to find the "Show Options" button or section. Click on it to expand and see all available options.

2

Enable Remove Element Feature

Look for the checkbox labeled "Remove Element from Screenshot" in the Show Options section. Check this box to enable the element removal feature.

3

Select Removal Method

After checking the box, you'll see two radio button options appear:

  • Remove by Class - Select this if you want to remove elements by their CSS class name
  • Remove by ID - Select this if you want to remove elements by their HTML ID

Choose the appropriate option based on what you found in the browser developer tools.

4

Paste the Class or ID Value

In the input field labeled "Element Class or ID Value", paste the class name or ID you copied from the browser developer tools.

Important:

  • For class names: Enter only the class name (e.g., header-section) - do NOT include the dot (.)
  • For IDs: Enter only the ID value (e.g., main-header) - do NOT include the hash symbol (#)
  • The field has a maximum length of 20 characters
5

Convert Your Webpage

Enter the URL of the webpage you want to convert, configure any other settings you need, and click the "Convert" button. The specified element will be automatically removed from the final PDF or image.

Example: HTML Element and Usage

Here's a practical example of how to use the class or ID:

Example HTML Element:

<div class="header-section" id="main-header">
    <h1>Website Title</h1>
</div>

To remove by class:

  1. Check "Remove Element from Screenshot"
  2. Select "Remove by Class"
  3. Enter header-section in the input field (without the dot)

To remove by ID:

  1. Check "Remove Element from Screenshot"
  2. Select "Remove by ID"
  3. Enter main-header in the input field (without the hash symbol)

💡 Pro Tips for Element Removal

  • Use IDs when possible: IDs are unique identifiers and more reliable than classes
  • Multiple elements: You can remove multiple elements by separating class names or IDs with commas
  • Test first: Try removing one element at a time to ensure you get the desired result
  • Common removals: Headers, footers, sidebars, navigation menus, cookie banners, and advertisement sections
  • If an element doesn't have a class or ID, you may need to inspect parent elements to find a suitable identifier

Ready to Convert Your Webpage?

Now that you know how to find element classes and IDs, try our free web to PDF converter with element removal feature!

Convert Webpage to PDF Now