mirror of
				https://github.com/adityatelange/hugo-PaperMod.git
				synced 2025-11-04 10:22:44 +01:00 
			
		
		
		
	update FAQ for Using Hugo's Syntax highlighter "chroma"
This commit is contained in:
		@@ -274,34 +274,36 @@ Add `#center` after image to center align an image
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
1. Disable Highlight.js in site `config.yml`
 | 
					1. Disable Highlight.js in site `config.yml`
 | 
				
			||||||
 | 
					
 | 
				
			||||||
```yml
 | 
					    ```yml
 | 
				
			||||||
params:
 | 
					    params:
 | 
				
			||||||
    assets:
 | 
					        assets:
 | 
				
			||||||
        disableHLJS: true
 | 
					            disableHLJS: true
 | 
				
			||||||
```
 | 
					    ```
 | 
				
			||||||
 | 
					
 | 
				
			||||||
2. Set hugo's markdown styling in site `config.yml`
 | 
					2. Set hugo's markdown styling in site `config.yml`
 | 
				
			||||||
 | 
					
 | 
				
			||||||
```yml
 | 
					    ```yml
 | 
				
			||||||
markup:
 | 
					    markup:
 | 
				
			||||||
    highlight:
 | 
					        highlight:
 | 
				
			||||||
        # anchorLineNos: true
 | 
					            # anchorLineNos: true
 | 
				
			||||||
        codeFences: true
 | 
					            codeFences: true
 | 
				
			||||||
        guessSyntax: true
 | 
					            guessSyntax: true
 | 
				
			||||||
        lineNos: true
 | 
					            lineNos: true
 | 
				
			||||||
        # noClasses: false
 | 
					            # noClasses: false
 | 
				
			||||||
        style: monokai
 | 
					            style: monokai
 | 
				
			||||||
```
 | 
					    ```
 | 
				
			||||||
 | 
					
 | 
				
			||||||
3. If you want `lineNos: true`, the background won't be proper.
 | 
					3. If you want `lineNos: true`, the background won't be proper.
 | 
				
			||||||
 | 
					   This will only work with `noClasses: false` or `pygmentsUseClasses: true`.
 | 
				
			||||||
 | 
					   Read [Generate Syntax Highlighter CSS](https://gohugo.io/content-management/syntax-highlighting/#generate-syntax-highlighter-css)
 | 
				
			||||||
 | 
					
 | 
				
			||||||
Add the following to `assets/css/extended/custom.css`
 | 
					    Add the following to `assets/css/extended/custom.css`
 | 
				
			||||||
 | 
					
 | 
				
			||||||
```css
 | 
					    ```css
 | 
				
			||||||
.chroma {
 | 
					    .chroma {
 | 
				
			||||||
    background-color: unset;
 | 
					        background-color: unset;
 | 
				
			||||||
}
 | 
					    }
 | 
				
			||||||
```
 | 
					    ```
 | 
				
			||||||
 | 
					
 | 
				
			||||||
More Info : [Configure Markup - Highlight](https://gohugo.io/getting-started/configuration-markup#highlight)
 | 
					More Info : [Configure Markup - Highlight](https://gohugo.io/getting-started/configuration-markup#highlight)
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user