Deleting elements

Estimated reading time: 2 minutes.
Date:

To my knowledge, soupault is the only website generator that can delete things from pages. With a generator based on a template processor you can conditionally include something in the page or not, but if it's already in the page, you can't do anything about it. Soupault opens a new era for website management: now you can delete anything you want, including the <body> element. First let's see how it's done and then discuss the use cases for deleting elements.

We'll start with a simple and absurd example: deleting the page body for real:

[widgets.delete-body]
  widget = "delete_element"
  selector = "body"

No one will want to do that, so let's move on to more useful examples.

Cleaning up empty elements

With the only_if_empty option you can delete only empty elements, but leave them intact if there's some content inside.

Suppose you are using a preprocessor for some format that is fond of leaving empty paragraphs. Then you can clean them up with this config:

[widgets.delete-empty-paragraphs]
  widget = "delete_element"
  selector = "p"
  only_if_empty = true

This technique can also be used to clean up empty containers that weren't populated by other widgets. For example, on my website I have breadcrumbs, which can be seen on pages inside sections, like /notes/mobile-friendly. At the top level, breadcrumbs make no sense though, so my config limits them to appear only on pages nested at least one level deep:

[widgets.breadcrumbs]
  widget = "breadcrumbs"
  selector = "div#breadcrumbs"
  prepend = ".. / "
  append = " /"
  between = " / "
  breadcrumb_template = "<a class=\"nav\"> </a>"
  min_depth = 1

Since the <div id="breadcrumbs"> is in my templates/main.html, it leaves an empty div in top level pages, which is not harmful, but still a bit dirty.

The delete_element widget offers a simple way to clean it up:

[widgets.breadcrumbs-cleanup]
  widget = "delete_element"
  selector = "div#breadcrumbs"
  only_if_empty = true

  # Must run after breadcrumbs!
  after = "breadcrumbs"

Note that after option. Soupault doesn't process widgets in the same order as they appear in the config, and may even run them in parallel in future versions, so if order is important, you should specify it explicitly with before and after options.

Deleting unwanted elements from third-party HTML

Sometimes third-party tools may generate something you don't want. Not a problem, if the unwanted element is identifiable with a CSS selector, you can use this widget to delete it. If a hypothetical HTML Gallery Generator Pro inserts a prominent logo in, say, <div id="watermark">, nothing prevents you from deleting it with:

[widgets.no-watermark]
  widget = "delete_element"
  selector = "div#watermark"