Modify URLs

Modify all URLs of HTML files with a custom function.

Description

The modify_urls plugin modifies all URLs in your HTML documents using a function. It's used internally by other plugins like resolve_urls, relative_urls and base_path, but you can use it to modify URLs using a custom function.

Installation

Import this plugin in your _config.ts file to use it:

import lume from "lume/mod.ts";
import modifyUrls from "lume/plugins/modify_urls.ts";

const site = lume();

site.use(modifyUrls());

export default site;

See all available options in Deno Doc.

Example

To use it, just import the plugin in the _config.js file and create a callback to change the url. For example, let's say we want to convert all URLs to lowercase:

import lume from "lume/mod.ts";
import modifyUrls from "lume/plugins/modify_urls.ts";

const site = lume();

site.use(modifyUrls({
  fn: (url) => url.toLowerCase();
}));

export default site;

The plugin will search all URLs in your HTML documents (elements with href, src, srcset, and imagesrcset attributes) and invoke the callback for every URL found. The callback has two arguments: the URL and the Page instance where that URL was found.