Code Syntax Highlighting
Verify the following code blocks render as code blocks and highlight properly.
More about tuning syntax highlighting is the Hugo documentation.
Diff
1
2
3
4
5
6
7
8
9
10
|
*** /path/to/original ''timestamp''
--- /path/to/new ''timestamp''
***************
*** 1 ****
! This is a line.
--- 1 ---
! This is a replacement line.
It is important to spell
-removed line
+new line
|
*** /path/to/original ''timestamp''
--- /path/to/new ''timestamp''
***************
*** 1 ****
! This is a line.
--- 1 ---
! This is a replacement line.
It is important to spell
-removed line
+new line
Makefile
CC=gcc
CFLAGS=-I.
hellomake: hellomake.o hellofunc.o
$(CC) -o hellomake hellomake.o hellofunc.o -I.
1
2
3
4
5
|
CC=gcc
CFLAGS=-I.
hellomake: hellomake.o hellofunc.o
$(CC) -o hellomake hellomake.o hellofunc.o -I.
|
JSON
1
|
{ "employees": [{ "firstName": "John", "lastName": "Doe" }] }
|
Markdown
1
2
3
|
**bold**
_italics_
[link](www.example.com)
|
JavaScript
1
|
document.write("Hello, world!");
|
CSS
1
2
3
|
body {
background-color: red;
}
|
Objective C
1
2
3
4
5
6
|
#import <stdio.h>
int main (void)
{
printf ("Hello world!\n");
}
|
Python
XML
1
2
3
4
5
|
<employees>
<employee>
<firstName>John</firstName> <lastName>Doe</lastName>
</employee>
</employees>
|
Perl
1
|
print "Hello, World!\n";
|
Bash
PHP
1
|
<?php echo '<p>Hello World</p>'; ?>
|
CoffeeScript
1
|
console.log(“Hello world!”);
|
C
1
2
3
4
5
6
7
8
|
using System;
class Program
{
public static void Main(string[] args)
{
Console.WriteLine("Hello, world!");
}
}
|
C++
1
2
3
4
5
6
7
|
#include <iostream.h>
main()
{
cout << "Hello World!";
return 0;
}
|
SQL
1
2
|
SELECT column_name,column_name
FROM table_name;
|
Go
1
2
3
4
5
|
package main
import "fmt"
func main() {
fmt.Println("Hello, 世界")
}
|
Ruby
Java
1
2
3
4
5
6
7
8
9
10
11
12
|
import javax.swing.JFrame; //Importing class JFrame
import javax.swing.JLabel; //Importing class JLabel
public class HelloWorld {
public static void main(String[] args) {
JFrame frame = new JFrame(); //Creating frame
frame.setTitle("Hi!"); //Setting title frame
frame.add(new JLabel("Hello, world!"));//Adding text to frame
frame.pack(); //Setting size to smallest
frame.setLocationRelativeTo(null); //Centering frame
frame.setVisible(true); //Showing frame
}
}
|
Latex Equation
1
|
\frac{d}{dx}\left( \int_{0}^{x} f(u)\,du\right)=f(x).
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
|
import {x, y} as p from 'point';
const ANSWER = 42;
class Car extends Vehicle {
constructor(speed, cost) {
super(speed);
var c = Symbol('cost');
this[c] = cost;
this.intro = `This is a car runs at
${speed}.`;
}
}
for (let num of [1, 2, 3]) {
console.log(num + 0b111110111);
}
function $initHighlight(block, flags) {
try {
if (block.className.search(/\bno\-highlight\b/) != -1)
return processBlock(block.function, true, 0x0F) + ' class=""';
} catch (e) {
/* handle exception */
var e4x =
<div>Example
<p>1234</p></div>;
}
for (var i = 0 / 2; i < classes.length; i++) {
// "0 / 2" should not be parsed as regexp
if (checkCondition(classes[i]) === undefined)
return /\d+[\s/]/g;
}
console.log(Array.every(classes, Boolean));
}
export $initHighlight;
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Hello world</title>
<link
href="http://fonts.googleapis.com/css?family=Roboto:400,400italic,700,700italic"
rel="stylesheet"
type="text/css"
/>
<link rel="stylesheet" href="index.css" />
</head>
<body>
<div id="app"></div>
<script src="//cdnjs.cloudflare.com/ajax/libs/less.js/2.5.1/less.min.js"></script>
<script src="vendor/prism.js"></script>
<script src="examples.bundle.js"></script>
</body>
</html>
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
|
/*********************************************************
* General
*/
pre[class*="language-"],
code {
color: #5c6e74;
font-size: 13px;
text-shadow: none;
font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
direction: ltr;
text-align: left;
white-space: pre;
word-spacing: normal;
word-break: normal;
line-height: 1.5;
tab-size: 4;
hyphens: none;
}
pre[class*="language-"]::selection,
code::selection {
text-shadow: none;
background: #b3d4fc;
}
@media print {
pre[class*="language-"],
code {
text-shadow: none;
}
}
pre[class*="language-"] {
padding: 1em;
margin: 0.5em 0;
overflow: auto;
background: #f8f5ec;
}
:not(pre) > code {
padding: 0.1em 0.3em;
border-radius: 0.3em;
color: #db4c69;
background: #f9f2f4;
}
|
