Shortcodes available on this site
5 minutes read
Filecodes
To display triple backticks in a fenced code block, wrap them inside quadruple backticks.
````
```
Look! These triple backticks will be preserved.
```
````
To display 4 backticks, enclose them with 5 backticks or with <pre></pre>.
SCSS
{{< filecode "scss" "Main.scss" >}}
```scss
```
{{< /filecode >}}
Main.scss
$font: Helvetica, sans-serif;
$primary-color: #333;
body {
font: 100% $font;
color: $primary-color;
}
Go
{{< filecode "go" "head.html" >}}
```go
```
{{< /filecode >}}
head.html
{{ $main_options := (dict "targetPath" "css/site.css" "outputStyle" "compressed") }}
{{ $main_template := resources.Get "sass/main.scss" }}
{{ $main_style := $main_template | resources.ExecuteAsTemplate "main_parsed.scss" . | toCSS $main_options | resources.Minify }}
CSS
{{< filecode "css" "style.css" >}}
```css
```
{{< /filecode >}}
style.css
.center {
margin: auto;
width: 50%;
border: 3px solid green;
padding: 10px;
}
HTML
{{< filecode "html" "home.html" >}}
```html
```
{{< /filecode >}}
home.html
<form action="" method="get" class="form-example">
<div class="form-example">
<label for="email">Enter your email: </label>
<input type="email" name="email" id="email" required>
</div>
<div class="form-example">
<input type="submit" value="Submit">
</div>
</form>
Git
{{< filecode "git" "home.html" >}}
```
```
{{< /filecode >}}
git add .
git commit -m "Enjoy!"
Toml
{{< filecode "toml" "config.html" >}}
```toml
```
{{< /filecode >}}
config.html
[outputFormats]
[outputFormats.sitemap2]
baseName = "sitemap2"
mediaType = "application/xml"
isPlainText = false
protocol = "xml://"
path = "/"
[outputs]
home = ["HTML", "RSS", "sitemap2"]
Github action
{{< filecode "ga-action" "action.yaml" >}}
```yaml
```
{{< /filecode >}}
action.yaml
name: Licensed
on:
push: {branches: main}
pull_request: {branches: main}
jobs:
test:
runs-on: ubuntu-latest
name: Check licenses
steps:
- uses: actions/checkout@v2
- run: npm install
Netlify Toml
{{< filecode "netlify" "netlify.toml" >}}
```toml
```
{{< /filecode >}}
netlify.toml
[Settings]
ID = "Your_Site_ID"
# Settings in the [build] context are global and are applied to all contexts unless otherwise overridden by more specific contexts.
[build]
# This is the directory to change to before starting a build.
base = "project/"
# NOTE: This is where we will look for package.json/.nvmrc/etc, not root.
# This is the directory that you are publishing from (relative to root of your repo)
publish = "project/build-output/"
# This will be your default build command
command = "echo 'default context'"
# This is where we will look for your lambda functions
functions = "project/functions/"
# Ignore build command if exit 0
ignore = "git diff --quiet HEAD^ HEAD sub_dir/"
# If skip_processing = true, all other settings are ignored
[build.processing]
skip_processing = false
[build.processing.css]
bundle = true
minify = false
[build.processing.js]
bundle = true
minify = false
[build.processing.html]
pretty_urls = true
[build.processing.images]
compress = true
# Set enviroment variable prompts for templates
[template.environment]
YOUR_ENV_KEYS_NEEDED = "Enter in the ENV key here"
# ref https://bit.ly/2wQ1mVk
incoming-hooks = ["Service-1"]
# Production context: All deploys from the Production branch set in your site's deploy settings will inherit these settings.
[context.production]
publish = "output/"
command = "make publish"
environment = { ACCESS_TOKEN = "super secret", NODE_ENV = "8.0.1" }
# Deploy Preview context: All Deploy Previews (https://www.netlify.com/blog/2016/07/20/introducing-deploy-previews-in-netlify/)
# will inherit these settings.
[context.deploy-preview]
publish = "dist/"
# Here is another way to define context specific environment variables
[context.deploy-preview.environment]
ACCESS_TOKEN = "not so secret"
# Branch Deploy context: All deploys that are not resulting from a Pull/Merge Request and not from the primary, linked branch will inherit these settings.
[context.branch-deploy]
command = "echo branch"
[context.branch-deploy.environment]
NODE_ENV = "development"
# Specific branch context: Deploys from this branch
# will take these settings and override their
# current ones.
[context.staging] # 'staging' is a branch name
command = "echo 'staging'"
base = "staging"
# For contexts of branches with special characters, enclose the branch name with quotes
[context."feat/branch"]
command = "echo 'special branch'"
base = "branch"
# A basic redirects rule
[[redirects]]
from = "/*"
to = "/blog/:splat"
# The following show an example redirects rule with all the supported properties.
[[redirects]]
from = "/old-path"
to = "/new-path"
status = 301
force = false
query = {path = ":path"} # apply this rule for /old-path?path=example
# NOTE: Each combination of query params will need to be defined in a separate [[redirects]] block. More here: https://www.netlify.com/docs/redirects/#query-params
conditions = {Language = ["en"], Country = ["US"], Role = ["admin"]}
# you can use env variables you've set in the UI or within your contexts as values
# sign each request with the value of this env variable
signed = "API_SIGNATURE_TOKEN"
# NOTE: env variables are only natively supported for this signed property of headers via this mechanism!
# You can also define custom headers within your redirects blocks
[redirects.headers]
X-From = "Netlify"
X-Api-Key = "some-api-key-string"
# The following redirect is intended for use with most SPA's that handles routing internally.
[[redirects]]
from = "/*"
to = "/index.html"
status = 200
[[redirects]]
from = "/api/*"
to = "https://us-central1-netlify-intercom.cloudfunctions.net/readHeaders/:splat"
status = 200
force = true
conditions = {Role = ["admin", "cms"]}
[redirects.headers]
X-From = "Netlify"
X-Api-Key = "some-api-key-string"
[[headers]]
for = "/*" # This defines which paths this specific [[headers]] block will cover.
[headers.values]
X-Frame-Options = "DENY"
X-XSS-Protection = "1; mode=block"
Content-Security-Policy = "frame-ancestors https://www.facebook.com"
# Multi-key header rules are expressed with multi-line strings
Link = '''
</assets/css/base.css>; rel=preload; as=style, \
</assets/css/base2.css>; rel=preload; as=style, \
</assets/css/base3.css>; rel=preload; as=style'''
# Basic-Auth allows you to password protect your whole site but is only available
# to paid accounts
Basic-Auth = "someuser:somepassword anotheruser:anotherpassword"
More icons can be found in the VScode-icons repo
More shortcodes will be added soon.