WP Documentation comes with built-in syntax highlighting powered by Highlight.js — a lightweight, battle-tested syntax highlighter that supports 190+ programming languages and automatically detects the language for most code blocks. Whether you’re documenting JavaScript, Python, HTML, or even obscure languages like Brainfuck or Elixir, Highlight.js renders beautifully formatted and readable code out of the box.
Features include:
- ✅ Auto language detection
- 🌈 Stylish theming with customizable themes
- 🚀 Fast performance, even with large blocks
- 🔌 Works seamlessly with Markdown or HTML
- 🔍 Copy-to-clipboard support (if integrated)
Below are examples in different languages to demonstrate the full capabilities of syntax highlighting in this theme.
✅ JavaScript
index.js
// Simple function
function greet(name) {
console.log(`Hello, ${name}!`);
}
greet("World");
🐍 Python
fibonacci.py
def fibonacci(n):
a, b = 0, 1
for _ in range(n):
print(a)
a, b = b, a + b
fibonacci(5)
🖥️ Bash
bash
#!/bin/bash
echo "Deploying app..."
npm run build && git push origin main
📦 JSON
config.json
{
"name": "my-docs-theme",
"version": "1.0.0",
"scripts": {
"dev": "vite",
"build": "vite build"
}
}
🌐 HTML + CSS
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Docs Theme</title>
<style>
body { background: #fff7ea; color: #000; }
</style>
</head>
<body>
<h1>Hello, World!</h1>
</body>
</html>
⚙️ TypeScript Interface
ts
interface User {
id: number;
name: string;
email?: string;
}
const user: User = { id: 1, name: "Alice" };