Star on GitHub Create Issues Buy me a Bubble Tea

Watermark

About 395 wordsAbout 1 min

2025-10-09

Overview

The theme's built-in watermark plugin adds watermarks to the entire site or individual pages.

Related plugin: @vuepress/plugin-watermark

For feature details, please refer to Watermark Feature

Usage

.vuepress/config.ts
import { defineUserConfig
 } from 'vuepress'
import { plumeTheme
 } from 'vuepress-theme-plume'

export default defineUserConfig
({
  theme
: plumeTheme
({
    // watermark: true,
    watermark
: {
      // enabled: false,  // boolean type controls global enablement
      enabled
: page
 => true, // function type filters which pages enable watermark

      /**
       * Whether to enable full-page watermark, defaults to `true`,
       * When set to `false`, watermark is only displayed in the content area.
       */
      fullPage
: true,

      /** @see https://zhensherlock.github.io/watermark-js-plus/zh/config/ */
      watermarkOptions
: {
        content
: 'your watermark',
        // ...
      }
    },
  })
})

For configuration entry priority information, please refer to Plugin Configuration Entry.

Configuration Options

enabled

Type: boolean | ((page: Page) => boolean)
Default: true
Details:
Specifies which pages should have watermarks added.
Pages with a true value will have watermarks applied.
The default true does not conflict with "no watermark when not configured"
The theme only registers the watermark plugin when watermark is configured (either the top-level watermark or plugins.watermark), and it explicitly passes enabled: true when registering. Therefore when watermark is not configured, no watermark appears anywhere on the site; the true here describes the default behavior once the watermark has been configured, and it is not an on/off switch.

fullPage

Type: boolean
Default: true
Details:
Whether to use a full-page watermark. This is a theme extension field; @vuepress/plugin-watermark itself does not have this option.
- true: The watermark covers the entire page
- false: The watermark is only displayed within the content area
A single page can also override this by setting watermark.fullPage: false in frontmatter.

watermarkOptions

Type: WatermarkOptions
Default: undefined
Details: Configuration options refer to watermark-js-plus.

watermarkOptions.parent

Type: string
Default: body
Details: Parent element selector for adding watermarks.
By default inserted into the body, can be specified to insert into a specific element on the page.

Frontmatter

watermark

Type: boolean | WatermarkOptions
Details:
When type is boolean, indicates whether to enable watermark.
When type is WatermarkOptions, indicates current page watermark configuration.
Refer to watermark-js-plus for configuration options.

frontmatter
---
watermark:
  width: 200
  height: 200
  content: Your content
  opacity: 0.5
---

Contributors

pengzhanbo

Changelog

10/13/26, 3:56 PM

View All Changelog

e4dae-docs: improve docs (#1071)on 10/13/26
60619-docs: improve docs (#1069)on 10/11/26
0daf2-docs: improve docs (#929)on 7/15/26
aede6-fix(theme): twoslash comment error (#881)on 4/2/26
38505-docs: update en docs (#708)on 10/9/25