Add language badge to Expressive Code codeblocks in your Astro site.
npm install expressive-code-language-badgeA plugin for Expressive Code that adds language badges to code blocks with customizable styling.
- Automatic language detection: Shows programming language for each code block
- Custom language labels: Remap identifiers (e.g., cpp → C++)
- Exclude languages: Hide badges for specific languages
- Text transform: Choose uppercase or lowercase display
- Hover interaction: Badges fade out on hover
- Fully customizable: Extensive styling options for colors, fonts, and borders
``bash`
npm install expressive-code-language-badge
`js
import { pluginLanguageBadge } from 'expressive-code-language-badge';
// Add to your Expressive Code configuration
plugins: [
pluginLanguageBadge({
textTransform: 'lowercase',
excludeLanguages: ['json', 'css'],
languageMap: {
cpp: 'C++',
csharp: 'C#',
},
})
]
``
For comprehensive documentation, installation guides, configuration options, and examples, visit the plugin documentation.
Contributions are welcome! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.
Licensed under the MIT License, Copyright © frostybee.
See LICENSE for more information.