Highlight code in the web page.
Click here for the project documentation.
- Download the latest release of this project.
- Clone the repo:
git clone https://github.com/yusufshakeel/dyCodeHighlighter.git - Install with npm:
npm install dycodehighlighter - From jsDelivr CDN:
https://www.jsdelivr.com/package/npm/dycodehighlighter
Include the Javascript and Stylesheet file from the dist directory.
Then call the init() method of dyCodeHighlighter.
Sample:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>dyCodeHighlighter</title>
<!-- dyCodeHighlighter stylesheet -->
<link rel="stylesheet" href="path/to/dist/css/dycodehighlighter.min.css">
</head>
<body>
<pre class='dyCodeHighlighter'>
<code>
// some code goes here...
</code>
</pre>
<!-- dyCodeHighlighter javascript -->
<script src="path/to/dist/js/dycodehighlighter.min.js"></script>
<script>dyCodeHighlighter.init();</script>
</body>
</html>
- Style
pre.dyCodeHighlighter codecontent - Show line numbers
- Highlight lines
- Show header info like: total lines and filename
- Start line number from a custom integer value like -10, 0, 10 etc.
- Theme: blue, choco, dark, gray
- Custom style
It's free and released under MIT License Copyright (c) 2017 Yusuf Shakeel
Feeling generous :-) Buy me a cup of tea.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent