pengzhanbo b1f996cb0e
feat(plugin-md-power): add ::: encrypt container, close #815 (#831)
* feat(plugin-md-power): add `::: encrypt` container

* chore: tweak

* chore: tweak

* chore: tweak
2026-02-12 23:55:21 +08:00

4.6 KiB

title, icon, createTime, permalink
title icon createTime permalink
Encryption mdi:encryption-outline 2025/10/08 15:58:48 /en/guide/features/encryption/

Encryption

In this topic, various flexible encryption methods such as full-site encryption and partial encryption are supported.

::: warning Note Due to the limitations of vuepress as a static site, encryption only makes the content appear invisible. During compilation, the content is not pre-rendered into the html, but it can still be retrieved from the site's source files. Therefore, the encryption feature should not be considered as completely secure or reliable.

Avoid using the encryption feature for content that requires strict confidentiality. :::

Unlocked articles are only visible during the current session.

Enabling Encryption

Add the encrypt option in the theme configuration.

import { defineUserConfig } from 'vuepress'
import { plumeTheme } from 'vuepress-theme-plume'

export default defineUserConfig({
  theme: plumeTheme({
    encrypt: {
      // more options...
    }
  })
})

Full-Site Encryption

In some cases, you may need to encrypt the entire site. You can configure full-site encryption using the encrypt.global option and set one or more passwords with encrypt.admin.

export default defineUserConfig({
  theme: plumeTheme({
    encrypt: {
      global: true,
      admin: ['123456'],
    }
  })
})

Partial Encryption

In most cases, you may only need to encrypt a specific article, directory, etc. You can configure partial encryption using the encrypt.rules option.

export default defineUserConfig({
  theme: plumeTheme({
    encrypt: {
      rules: {
        // Can be the relative path of an MD file to encrypt that file
        '前端/基础.md': '123456',
        // Can be a directory path to encrypt all articles under that directory
        '/notes/vuepress-theme-plume/': '123456',
        // Can be a request path to encrypt all articles under that path
        '/vuepress-theme-plume/': '123456',
        // Can be a specific page's request path to encrypt that page
        '/article/f8dnci3/': '123456',
        // If prefixed with `^`, pages matching the regex will also be encrypted
        '^/(a|b)/': '123456',
      }
    }
  })
})

The key in encrypt.rules serves as the matching rule, and the value is the corresponding password (or multiple passwords) for that rule.

:::tip Notes

  • Passwords must be plain strings.
  • If encrypting an entire directory, unlocking applies to the entire directory, not individual articles within it.
  • encrypt.admin can also be used to unlock partially encrypted pages.
  • After unlocking with encrypt.admin, the user is considered an admin, and all other locked pages are unlocked by default. :::

Frontmatter

In the Frontmatter of a Markdown file, you can set the article's password using the password field.

---
title: Encrypted Article
password: 123456
---

You can also add the passwordHint option to provide a password hint.

---
title: Encrypted Article
password: 123456
passwordHint: The password is 123456
---

Example

Click to visit Encrypted Article, Password: 123456

The following configurations can be used in multilingual settings.

encryptGlobalText

  • Type: string

  • Default: 'Only password can access this site'

  • Description:

    The prompt message for full-site encryption. Supports HTML. Useful if you want to provide contact information for visitors to obtain the password.

encryptPageText

  • Type: string

  • Default: 'Only password can access this page'

  • Description:

    The prompt message for partial encryption. Supports HTML. Useful if you want to provide contact information for visitors to obtain the password.

encryptButtonText

  • Type: string
  • Default: 'Confirm'
  • Description: The text for the confirmation button.

encryptPlaceholder

  • Type: string
  • Default: 'Enter password'
  • Description: The placeholder text for the password input field.

Example

import { defineUserConfig } from 'vuepress'
import { plumeTheme } from 'vuepress-theme-plume'

export default defineUserConfig({
  theme: plumeTheme({
    locales: {
      '/': {
        encryptButtonText: 'Confirm',
        encryptPlaceholder: 'Enter password',
        encryptGlobalText: 'Only password can access this site',
        encryptPageText: 'Only password can access this page',
      }
    }
  })
})