OER Schema

VitePress Plugin

Add OER Schema pedagogical components to your VitePress documentation with semantic markup and beautiful styling.

Quick Installation

1. Install from npm

npm install vitepress-plugin-oer-schema

2. Configure VitePress

import { oerSchemaPlugin } from 'vitepress-plugin-oer-schema'

export default {
  markdown: {
    config: (md) => md.use(oerSchemaPlugin)
  }
}

3. Import Styles

import 'vitepress-plugin-oer-schema/styles.css'

Features

  • Published on npm registry
  • OER Schema microdata for SEO and interoperability
  • 9 pedagogical component types (including rubrics)
  • Responsive design with dark mode
  • Print-friendly styling
  • Accessible markup and styling

Alternative: Download Files

Prefer to download the files directly? Access the plugin source files below:

index.mjs

Main plugin file with ES module support

~8KB
Download

styles.css

Component styles with dark mode support

~4KB
Download

package.json

Package configuration and dependencies

~1KB
Download

README.md

Installation and usage documentation

~3KB
Download

Example Usage

Here's how to use the components in your VitePress markdown files:

::: learning-objective skill="analyze data" course="DATA-101"
Students will be able to analyze and interpret data using statistical methods.
:::

::: practice action="Analyzing,Computing" material="dataset-csv"
**Exercise: Sales Data Analysis**
Download the sales dataset and calculate key metrics...
:::

::: assessment type="Project" points="100" assessing="data-analysis"
**Final Project: Data Analysis Report**
Create a comprehensive analysis of the provided dataset...
:::

::: rubric type="analytic"
**Assignment Rubric**

::: rubric-criterion weight="40"
**Data Analysis Quality**
::: rubric-scale pointsRequired="true"
::: rubric-level ordinal="3" points="40"
Excellent analysis with clear insights
:::
::: rubric-level ordinal="2" points="30"
Good analysis with some insights
:::
::: rubric-level ordinal="1" points="20"
Basic analysis
:::
:::
:::
:::