Skip to main content

Home Frontmatter Config

About 2 minConfigFrontmatterHome

home

  • Type: boolean
  • Default: false

Enable homepage style when setting to true

title

  • Type: string
  • Required: No

Page title, will be used in breadcrumb, seo, etc.

heroText

  • Type: string | false
  • Default: "Hello"

Hero Title

tagline

  • Type: string | false
  • Default: "Welcome to your VuePress site"

Short description in hero

heroImage

  • Type: string
  • Required: No

Home hero (logo) image link, relative path is not supported.

heroImageDark

  • Type: string
  • Default: heroImage

Darkmode Home hero (logo) image link, relative path is not supported.

heroAlt

  • Type: string
  • Required: No

Home icon alt text

heroImageStyle

  • Type: Record<string, string> | string
  • Required: No

CSS style for home icon

bgImage

  • Type: string
  • Required: No

Link of background image, relative path is not supported.

bgImageDark

  • Type: string
  • Default: bgImage

Link of darkmode background image, relative path is not supported.

bgImageStyle

  • Type: Record<string, string> | string
  • Required: No

The CSS style of the background image.

heroFullScreen

  • Type: boolean
  • Default: false

Whether Hero is full screen displayed

actions

  • Type: ThemeHomeActionOptions[]

    interface ThemeHomeActionOptions {
      /**
       * Action name
       */
      text: string;
    
      /**
       * Action link
       */
      link: string;
    
      /**
       * Type of action
       * @default 'default'
       */
      type?: "primary" | "default";
    }
    
  • Required: No

Home actions

highlights

  • Type: (ThemeProjectHomeFeatureOptions |ThemeProjectHomeHighlightOptions)[]

    interface ThemeProjectHomeHighlightItem {
      /**
       * Item name, supports HTML string
       */
      title: string;
    
      /**
       * Item description, supports HTML string
       */
      details?: string;
    
      /**
       * Item icon
       *
       * @description image link or icon fontClass are supported
       */
      icon?: string;
    
      /**
       * Item link
       */
      link?: string;
    }
    
    type ThemeProjectHomeFeatureItem = ThemeProjectHomeHighlightItem;
    
    interface ThemeProjectHomeFeatureOptions {
      /**
       * Feature header
       */
      header?: string;
    
      /**
       * Feature section description, supports HTML string
       */
      description?: string;
    
      /**
       * Text color
       */
      color?: string;
    
      /**
       * Feature section image
       */
      image?: string;
    
      /**
       * Feature section image used in darkmode
       *
       * @default image
       */
      imageDark?: string;
    
      /**
       * Feature Background image
       */
      bgImage?: string;
    
      /**
       * Feature Background image used in darkmode
       *
       * @default bgImage
       */
      bgImageDark?: string;
    
      /**
       * Features Background image style
       */
      bgImageStyle?: Record<string, string> | string;
    
      /**
       * Features
       */
      features: ThemeProjectHomeFeatureItem[];
    }
    
    interface ThemeProjectHomeHighlightSection {
      /**
       * Highlight section header, supports HTML string
       */
      header: string;
    
      /**
       * Highlight section description, supports HTML string
       */
      description?: string;
    
      /**
       * Text color
       */
      color?: string;
    
      /**
       * Highlight section image
       */
      image?: string;
    
      /**
       * Highlight section image used in darkmode
       *
       * @default image
       */
      imageDark?: string;
    
      /**
       * Highlight Background image
       */
      bgImage?: string;
    
      /**
       * Highlight Background image used in darkmode
       *
       * @default bgImage
       */
      bgImageDark?: string;
    
      /**
       * Highlight Background image style
       */
      bgImageStyle?: Record<string, string> | string;
    
      /**
       * Highlight section list type
       *
       * @default un-order
       */
      type?: "order" | "un-order" | "no-order";
    
      /**
       * Highlights
       */
      highlights?: ThemeProjectHomeHighlightItem[];
    }
    
  • Required: No

Highlights description.

features

  • Type: ThemeProjectHomeFeatureItem[]

    interface ThemeProjectHomeFeatureItem {
      /**
       * Item name, supports HTML string
       */
      title: string;
    
      /**
       * Item description, supports HTML string
       */
      details?: string;
    
      /**
       * Item icon
       *
       * @description image link or icon fontClass are supported
       */
      icon?: string;
    
      /**
       * Item link
       */
      link?: string;
    }
    
  • Required: No

Features description.