Markdown Syntax Guide
This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme. -...
404
FAQs [draft]
Table of Contents
- Intro
- Override theme template
- Enable Social-Metadata and SEO
- Failed to find a valid digest in the ‘integrity’ attribute for resource … ?
- Bundling Custom css with theme’s assets
- Custom Head / Footer
- Add menu to site
- Pin a Post
- Adding Custom Favicon(s)
- Centering image in markdown
- Using Hugo’s Syntax highlighter “chroma”
- Search not working ?
- References
Intro
We’ll be using
yml/yamlformat for all examples down below, I recommend usingymlovertomlas it is easier to read.You can find any YML to TOML converters if necessary.
Override theme template
By Hugo’s Lookup Order, you can override any part of a theme that you want. The following is a quick example.
Let’s say you wish the list was different. All you have to do is copy the list template:
your-site/themes/papermod/layouts/_defaults/list.html
-And paste it under your own layouts folder:
your-site/layouts/_defaults/list.html
+
+
+
+
+
+FAQs | PaperMod
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+FAQs [draft]
+
+
+
+
+
+Table of Contents
+
+
+-
+Intro
+-
+Override theme template
+-
+Enable Social-Metadata and SEO
+-
+Failed to find a valid digest in the ‘integrity’ attribute for resource … ?
+-
+Bundling Custom css with theme’s assets
+-
+Custom Head / Footer
+-
+Add menu to site
+-
+Pin a Post
+-
+Adding Custom Favicon(s)
+-
+Centering image in markdown
+-
+Using Hugo’s Syntax highlighter “chroma”
+-
+Search not working ?
+-
+References
+
+
+
+
+
+Intro
+
+-
+
We’ll be using yml/yaml format for all examples down below, I recommend using yml over toml as it is easier to read.
+
+-
+
You can find any YML to TOML converters if necessary.
+
+
+
+Override theme template
+By Hugo’s Lookup Order, you can override any part of a theme that you want. The following is a quick example.
+Let’s say you wish the list was different. All you have to do is copy the list template:
+your-site/themes/papermod/layouts/_defaults/list.html
+
And paste it under your own layouts folder:
+your-site/layouts/_defaults/list.html
Then you’re free to make any changes you want to the list.
-When Hugo builds your site, your copy of list.html will be used instead of the theme’s list.html.
Enable Social-Metadata and SEO
These include OpenGraph, Twitter Cards and Schema.
params:
+When Hugo builds your site, your copy of list.html will be used instead of the theme’s list.html.
+
+Enable Social-Metadata and SEO
+These include OpenGraph, Twitter Cards and Schema.
+params:
env: production
-
or set HUGO_ENV as “production” in system env-vars
Failed to find a valid digest in the ‘integrity’ attribute for resource … ?
Read about How Subresource Integrity helps: Subresource_Integrity
Why was the asset not loading ? : How_browsers_handle_Subresource_Integrity
Solution:
Set the following in config.yml
params:
+
or set HUGO_ENV as “production” in system env-vars
+
+Failed to find a valid digest in the ‘integrity’ attribute for resource … ?
+Read about How Subresource Integrity helps: Subresource_Integrity
+Why was the asset not loading ? : How_browsers_handle_Subresource_Integrity
+Solution:
+Set the following in config.yml
+params:
assets:
disableFingerprinting: true
-
Linked Issues:
- https://stackoverflow.com/questions/65056585/hugo-theme-not-loading
- https://stackoverflow.com/questions/65040931/hugo-failed-to-find-a-valid-digest-in-the-integrity-attribute-for-resource
- https://blog.gerardbeckerleg.com/posts/hugo-failed-to-find-a-valid-digest-in-the-integrity-attribute-for-resource/
Bundling Custom css with theme’s assets
- For adding custom css to be bundled inside one minimized css
Create folder in yout project directory as
.(site root)
+
Linked Issues:
+
+- https://stackoverflow.com/questions/65056585/hugo-theme-not-loading
+- https://stackoverflow.com/questions/65040931/hugo-failed-to-find-a-valid-digest-in-the-integrity-attribute-for-resource
+- https://blog.gerardbeckerleg.com/posts/hugo-failed-to-find-a-valid-digest-in-the-integrity-attribute-for-resource/
+
+
+Bundling Custom css with theme’s assets
+
+- For adding custom css to be bundled inside one minimized css
+
+Create folder in yout project directory as
+.(site root)
├── config.yml
├── content/
├── theme/hugo-PaperMod/
@@ -16,7 +178,16 @@ When Hugo builds your site, your copy of list.html will be used ins
└── extended/ <---
├── custom_css1.css <---
└── any_name.css <---
-
All css files inside assets/css/extended will be bundled !
Note: blank.css is just the placeholder so that it doesn’t break the theme when no files are present under assets/css/extended
Linked Issues:
Custom Head / Footer
Custom css/js can be added by way mentioned below.
.(site root)
+
All css files inside assets/css/extended will be bundled !
+Note: blank.css is just the placeholder so that it doesn’t break the theme when no files are present under assets/css/extended
+Linked Issues:
+
+
+Custom Head / Footer
+Custom css/js can be added by way mentioned below.
+.(site root)
├── config.yml
├── content/
├── theme/hugo-PaperMod/
@@ -26,7 +197,14 @@ When Hugo builds your site, your copy of list.html will be used ins
│ ├── extend_footer.html <---
│ └── extend_head.html <---
└── robots.txt
-
Create a html page in directory structure as shown above.
Contents of extend_head.html will be added to head of page.
and contents of extend_footer.html will be added to bottom of page.
Add menu to site
You can add menu entries which will appear in the header of every page.
To do so, add a menu section to your site’s config.yml:
menu:
+
Create a html page in directory structure as shown above.
+Contents of extend_head.html will be added to head of page.
+and contents of extend_footer.html will be added to bottom of page.
+
+Add menu to site
+You can add menu entries which will appear in the header of every page.
+To do so, add a menu section to your site’s config.yml:
+menu:
main:
- identifier: categories
name: categories
@@ -42,39 +220,83 @@ When Hugo builds your site, your copy of list.html will be used ins
weight: 30
name controls what will be displayed for the menu entry.
url sets the URL that the entry points to.
-weight is used to control the positioning of entries.
For more information on menus, see the Hugo wiki page.
Pin a Post
Post can be pinned/ displayed top on the list by adding a weight=<num> var to page-variables
example:
---
+weight is used to control the positioning of entries.
+For more information on menus, see the Hugo wiki page.
+
+Pin a Post
+Post can be pinned/ displayed top on the list by adding a weight=<num> var to page-variables
+example:
+---
title: "My Important post"
date: 2020-09-15T11:30:03+00:00
weight: 1
---
-
---
+
---
title: "My 2nd Important post"
date: 2020-09-15T11:30:03+00:00
weight: 2
---
-
Adding Custom Favicon(s)
We support the following paths under /static directory
-and can be added accordingly.
favicon.icofavicon-16x16.pngfavicon-32x32.pngapple-touch-icon.pngsafari-pinned-tab.svg
Favicon(s) can be generated by Favicon.io
and can be simply put in /static folder.
Other way is to add favicon(s) NOT located in /static folder.
In site config add the following:
params:
+
+Adding Custom Favicon(s)
+We support the following paths under /static directory
+and can be added accordingly.
+
+favicon.icofavicon-16x16.pngfavicon-32x32.pngapple-touch-icon.pngsafari-pinned-tab.svg
+
+-
+
Favicon(s) can be generated by Favicon.io
+and can be simply put in /static folder.
+
+-
+
Other way is to add favicon(s) NOT located in /static folder.
+In site config add the following:
+params:
assets:
favicon: "<link / absolute url>"
favicon16x16: "<link / absolute url>"
favicon32x32: "<link / absolute url>"
apple_touch_icon: "<link / absolute url>"
safari_pinned_tab: "<link / absolute url>"
-
absolute url means direct links to external resource: ex. https://web.site/someimage.png
example:
params:
+
+absolute url means direct links to external resource: ex. https://web.site/someimage.png
+example:
+params:
assets:
favicon: "/favicon.ico"
favicon16x16: "/favicon-16x16.png"
favicon32x32: "/favicon-32x32.png"
apple_touch_icon: "/apple-touch-icon.png"
safari_pinned_tab: "/safari-pinned-tab.svg"
-
Centering image in markdown
Add #center after image to center align an image
-
When using figure shortcode
use align=center to center image with captions
ex.
{{< figure align=center src="image.jpg" >}}
-
Using Hugo’s Syntax highlighter “chroma”
Disable Highlight.js in site config.yml
params:
+
+
+
+Centering image in markdown
+Add #center after image to center align an image
+
+
When using figure shortcode
+use align=center to center image with captions
+ex.
+{{< figure align=center src="image.jpg" >}}
+
+Using Hugo’s Syntax highlighter “chroma”
+
+-
+
Disable Highlight.js in site config.yml
+params:
assets:
disableHLJS: true
-
Set hugo’s markdown styling in site config.yml
markup:
+
-
+
Set hugo’s markdown styling in site config.yml
+markup:
highlight:
# anchorLineNos: true
codeFences: true
@@ -82,14 +304,78 @@ assets:
lineNos: true
# noClasses: false
style: monokai
-
If you want lineNos: true, the background won’t be proper.
+
-
+
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
Add the following to assets/css/extended/custom.css
.chroma {
+Read Generate Syntax Highlighter CSS
+Add the following to assets/css/extended/custom.css
+.chroma {
background-color: unset;
}
-
More Info : Configure Markup - Highlight
Search not working ?
If you are using a CDN to server assets from a different domain, search would break
Why? Take a look at fastsearch.js#L35.
We fetch the index.json (where the search function looks for the keywords typed) one level up of the website search.min.js is hosted on.
We have used this insted of assigning baseURL so as to work with multilingual websites ex. example.com/fr/ and websites being placed under a subdirectory ex. example.com/blog/.
To fix for single language websites hosting assets from CDN, this you may override fastsearch.js#L35 and placing appropriate URL as in
xhr.open("GET", "https://example.com/index.json");
-
References
More Info : Configure Markup - Highlight
+
+
+
+Search not working ?
+If you are using a CDN to server assets from a different domain, search would break
+Why? Take a look at fastsearch.js#L35.
+We fetch the index.json (where the search function looks for the keywords typed) one level up of the website search.min.js is hosted on.
+We have used this insted of assigning baseURL so as to work with multilingual websites ex. example.com/fr/ and websites being placed under a subdirectory ex. example.com/blog/.
+To fix for single language websites hosting assets from CDN, this you may override fastsearch.js#L35 and placing appropriate URL as in
+xhr.open("GET", "https://example.com/index.json");
+
+References
+
+
+
+
+
+
\ No newline at end of file
+ PaperMod
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/posts/papermod/papermod-features/index.html b/posts/papermod/papermod-features/index.html
index f5e13900..4a566124 100644
--- a/posts/papermod/papermod-features/index.html
+++ b/posts/papermod/papermod-features/index.html
@@ -1,10 +1,257 @@
-Features | PaperMod Features
Table of Contents
- Intro
- Assets (js/css)
- Default Theme light/dark/auto
- Theme Switch Toggle (enabled by default)
- Archives Layout
- Regular Mode (default-mode)
- Home-Info Mode
- Profile Mode
- Search Page
- Draft Page indication
- Post Cover Image
- Share Buttons on post
- Show post reading time
- Show Table of Contents (Toc) on blog post
- BreadCrumb Navigation
- Edit Link for Posts
- Other Posts suggestion below a post
- Multiple Authors
- Comments
- AccessKeys
- Enhanced SEO
- Multilingual Support
- Misc
Intro
We’ll be using yml/yaml format for all examples down below, I recommend using yml over toml as it is easier to read.
You can find any YML to TOML converters if necessary.
Assets (js/css)
The following is enabled by default
- minification - makes the assets size smallest as possible.
- bundling - bundles all the styles in one single asset
- fingerprint/integrity check.
Default Theme light/dark/auto
params:
+
+
+
+
+
+Features | PaperMod
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+Features
+
+
+
+
+
+Table of Contents
+
+
+-
+Intro
+-
+Assets (js/css)
+-
+Default Theme light/dark/auto
+-
+Theme Switch Toggle (enabled by default)
+-
+Archives Layout
+-
+Regular Mode (default-mode)
+-
+Home-Info Mode
+-
+Profile Mode
+-
+Search Page
+-
+Draft Page indication
+-
+Post Cover Image
+-
+Share Buttons on post
+-
+Show post reading time
+-
+Show Table of Contents (Toc) on blog post
+-
+BreadCrumb Navigation
+-
+Edit Link for Posts
+-
+Other Posts suggestion below a post
+-
+Multiple Authors
+-
+Comments
+-
+AccessKeys
+-
+Enhanced SEO
+
+-
+Multilingual Support
+-
+Misc
+
+
+
+
+
+Intro
+
+-
+
We’ll be using yml/yaml format for all examples down below, I recommend using yml over toml as it is easier to read.
+
+-
+
You can find any YML to TOML converters if necessary.
+
+
+
+Assets (js/css)
+The following is enabled by default
+
+- minification - makes the assets size smallest as possible.
+- bundling - bundles all the styles in one single asset
+- fingerprint/integrity check.
+
+
+Default Theme light/dark/auto
+params:
# defaultTheme: light
# defaultTheme: dark
defaultTheme: auto # to switch between dark or light according to browser theme
-
Theme Switch Toggle (enabled by default)
Shows icon besides title of page to change theme
To disable it :
disableThemeToggle: true
-
You can refer following table for better understanding…
defaultThemedisableThemeTogglechecks local storage? checks system theme? Info autotrue No Yes only system theme false Yes (if not->2) Yes (2) switch present darktrue No No force dark only false Yes No switch present lighttrue No No force light only false Yes No switch present
Archives Layout
Create a page with archive.md in content directory with following content
.
+
+
+Theme Switch Toggle (enabled by default)
+Shows icon besides title of page to change theme
+To disable it :
+disableThemeToggle: true
+
You can refer following table for better understanding…
+
+
+
+defaultThemedisableThemeTogglechecks local storage?
+checks system theme?
+Info
+
+
+
+
+autotrue
+No
+Yes
+only system theme
+
+
+false
+Yes (if not->2)
+Yes (2)
+switch present
+
+
+darktrue
+No
+No
+force dark only
+
+
+false
+Yes
+No
+switch present
+
+
+lighttrue
+No
+No
+force light only
+
+
+false
+Yes
+No
+switch present
+
+
+
+
+Archives Layout
+Create a page with archive.md in content directory with following content
+.
├── config.yml
├── content/
│ ├── archives.md <--- Create archive.md here
@@ -12,14 +259,27 @@
├── static/
└── themes/
└── PaperMod/
-
and add the following to it
---
+
and add the following to it
+---
title: "Archive"
layout: "archives"
url: "/archives/"
summary: archives
---
-
Note: Archives Layout does not support Multilingual Month Translations.
ex: archives.md
Regular Mode (default-mode)
Home-Info Mode
Use 1st entry as some Information
add following to config file
params:
+
Note: Archives Layout does not support Multilingual Month Translations.
+ex: archives.md
+
+Regular Mode (default-mode)
+
+
+
+Home-Info Mode
+
+
+Use 1st entry as some Information
+add following to config file
+params:
homeInfoParams:
Title: Hi there wave
Content: Can be Info, links, about...
@@ -29,7 +289,14 @@
url: "<link>"
- name: "<platform 2>"
url: "<link2>"
-
ex. config.yml#L106
Profile Mode
Shows Index/Home page as Full Page with Social Links and Image
add following to config file
params:
+
ex. config.yml#L106
+
+Profile Mode
+
+
+Shows Index/Home page as Full Page with Social Links and Image
+add following to config file
+params:
profileMode:
enabled: true
title: "<Title>" # optional default will be site title
@@ -49,12 +316,17 @@
url: "<link>"
- name: "<platform 2>"
url: "<link2>"
-
Search Page
PaperMod uses Fuse.js Basic for seach functionality
Add the following to site config, config.yml
outputs:
+
+Search Page
+PaperMod uses Fuse.js Basic for seach functionality
+Add the following to site config, config.yml
+outputs:
home:
- HTML
- RSS
- JSON # is necessary
-
Create a page with search.md in content directory with following content
---
+
Create a page with search.md in content directory with following content
+---
title: "Search" # in any language you want
layout: "search" # is necessary
# url: "/archive"
@@ -62,9 +334,23 @@
summary: "search"
---
-
To hide a particular page from being searched, add it in post’s fron’t matter
---
+
To hide a particular page from being searched, add it in post’s fron’t matter
+---
searchHidden: true
-
ex: search.md
Search Page also has Key bindings:
- Arrow keys to move up/down the list
- Enter key (return) or Right Arrow key to Go to highlighted page
- Escape key to clear searchbox and results
For Multilingual use search.<lang>.md ex. search.es.md.
Note: Search will work only on current language, user is currently on !
Customizing Fusejs Options
Refer https://fusejs.io/api/options.html for Options, Add those as shown below.
params:
+
ex: search.md
+
+Search Page also has Key bindings:
+
+- Arrow keys to move up/down the list
+- Enter key (return) or Right Arrow key to Go to highlighted page
+- Escape key to clear searchbox and results
+
+
+For Multilingual use search.<lang>.md ex. search.es.md.
+Note: Search will work only on current language, user is currently on !
+Customizing Fusejs Options
+Refer https://fusejs.io/api/options.html for Options, Add those as shown below.
+params:
fuseOpts:
isCaseSensitive: false
shouldSort: true
@@ -73,37 +359,68 @@
threshold: 0.4
minMatchCharLength: 0
keys: ["title", "permalink", "summary", "content"]
-
Draft Page indication
adds [draft] mark to indicate draft pages.
Post Cover Image
In post’s page-variables add :
cover:
+
+Draft Page indication
+adds [draft] mark to indicate draft pages.
+
+Post Cover Image
+In post’s page-variables add :
+cover:
image: "<image path/url>"
# can also paste direct link from external site
# ex. https://i.ibb.co/K0HVPBd/paper-mod-profilemode.png
alt: "<alt text>"
caption: "<text>"
relative: false # To use relative path for cover image, used in hugo Page-bundles
-
When you include images in the Page Bundle, multiple sizes of the image will automatically be provided using the HTML5 srcset field.
To reduce generation time and size of the site, you can disable this feature using
params:
+
When you include images in the Page Bundle, multiple sizes of the image will automatically be provided using the HTML5 srcset field.
+To reduce generation time and size of the site, you can disable this feature using
+params:
cover:
responsiveImages: false
-
To enable hyperlinks to the full image size on post pages, use
params:
+
To enable hyperlinks to the full image size on post pages, use
+params:
cover:
linkFullImages: true
-
Share Buttons on post
Displays Share Buttons at Bottom of each post
to show share buttons add
params:
+
+Share Buttons on post
+Displays Share Buttons at Bottom of each post
+to show share buttons add
+params:
ShowShareButtons: true
-
Show post reading time
Displays Reading Time (the estimated time, in minutes, it takes to read the content.)
To show reading time add
Params:
+
+Show post reading time
+Displays Reading Time (the estimated time, in minutes, it takes to read the content.)
+To show reading time add
+Params:
ShowReadingTime: true
-
Show Table of Contents (Toc) on blog post
Displays ToC on blog-pages
To show ToC add following to page-variables
ShowToc: true
-
To keep Toc Open by default on a post add following to page-variables:
TocOpen: true
-
BreadCrumb Navigation
Adds BreadCrumb Navigation above Post’s Title to show subsections and Navigation to Home
params:
+
+Show Table of Contents (Toc) on blog post
+Displays ToC on blog-pages
+To show ToC add following to page-variables
+ShowToc: true
+
To keep Toc Open by default on a post add following to page-variables:
+TocOpen: true
+
+BreadCrumb Navigation
+Adds BreadCrumb Navigation above Post’s Title to show subsections and Navigation to Home
+params:
ShowBreadCrumbs: true
-
Can be diabled for particular page’s front-matter
---
+
Can be diabled for particular page’s front-matter
+---
ShowBreadCrumbs: false
---
-
Edit Link for Posts
Add a button to suggest changes by using the file path of the post to link to a edit destination.
For site config use:
Params:
+
+Edit Link for Posts
+Add a button to suggest changes by using the file path of the post to link to a edit destination.
+For site config use:
+Params:
editPost:
URL: "https://github.com/<path_to_repo>/content"
Text: "Suggest Changes" # edit text
appendFilePath: true # to append file path to Edit link
-
Can be modified for individual pages
---
+
Can be modified for individual pages
+---
editPost:
URL: "https://github.com/<path_to_repo>/content"
Text: "Suggest Changes" # edit text
@@ -111,48 +428,172 @@
---
The example above would yield the following link for the post file posts/post-name.md:
-https://github.com/<path_to_repo>/content/posts/post-name.md
Parameter Required Default Value editPost.URL true - editPost.appendFilePath false false editPost.Text false “Edit”
Since the link generated is a regular HTML anchor tag <a href=...>, you can
+https://github.com/<path_to_repo>/content/posts/post-name.md
+
+
+
+Parameter
+Required
+Default Value
+
+
+
+
+editPost.URL
+true
+-
+
+
+editPost.appendFilePath
+false
+false
+
+
+editPost.Text
+false
+“Edit”
+
+
+
+Since the link generated is a regular HTML anchor tag <a href=...>, you can
also use other URL schemas like mailto://, e.g.
-URL: "mailto://mail@example.com?subject=Suggesting changes for "
Other Posts suggestion below a post
Adds a Previous / Next post suggestion under a single post
params:
+URL: "mailto://mail@example.com?subject=Suggesting changes for "
+
+Other Posts suggestion below a post
+Adds a Previous / Next post suggestion under a single post
+params:
ShowPostNavLinks: true
-
Multiple Authors
To Use multiple authors for a post, in post-variables:
---
+
+Multiple Authors
+To Use multiple authors for a post, in post-variables:
+---
author: ["Me", "You"]
---
-
To use Multiple Authors Site-wide, in config.yml:
params:
+
To use Multiple Authors Site-wide, in config.yml:
+params:
author: ["Me", "You"]
-
Comments
to add comments, create a html file
layouts/partials/comments.html
and paste code provided by your comments provider
also in config add this
params:
+
+Comments
+to add comments, create a html file
+layouts/partials/comments.html
+and paste code provided by your comments provider
+also in config add this
+params:
comments: true
-
read more about this hugo-comments
AccessKeys
c - ToC Open/Close
+
read more about this hugo-comments
+
+AccessKeys
+c - ToC Open/Close
g - Go To Top
h - Home (according to current lang)
t - Theme toggle
/ - Jumps to search page if in menu
-
Enhanced SEO
Enabled only when env: production
Twitter Cards Support
- The Twitter Cards metadata, except
twitter:image should not require
+
+
+Enhanced SEO
+Enabled only when env: production
+
+Twitter Cards Support
+
+- The Twitter Cards metadata, except
twitter:image should not require
additional configuration, since it is generated from metadata that
-you should already have (for instance the page title and description). - The
twitter:image uses the Post Cover Image, if present. - In the absence of a cover images, the first image from the
images
-frontmatter (a list) is used.images:
+you should already have (for instance the page title and description).
+- The
twitter:image uses the Post Cover Image, if present.
+- In the absence of a cover images, the first image from the
images
+frontmatter (a list) is used.
+images:
- image_01.png
- image_02.png
-
- Finally, if neither of those are provided,
twitter:image comes from the first
+
+- Finally, if neither of those are provided,
twitter:image comes from the first
Page Bundle
image with feature in the name, with a fallback to the first image with
-cover or thumbnail in the name.
OpenGraph support
- The OpenGraph metadata, except
og:image should not require
+cover or thumbnail in the name.
+
+OpenGraph support
+
+- The OpenGraph metadata, except
og:image should not require
additional configuration, since it is generated from metadata that
-you should already have (for instance the page title and description). - The
og:image uses the Post Cover Image, if present. - In the absence of a cover images, the first image from the
images
-frontmatter (a list) is used.images:
+you should already have (for instance the page title and description).
+- The
og:image uses the Post Cover Image, if present.
+- In the absence of a cover images, the first image from the
images
+frontmatter (a list) is used.
+images:
- image_01.png
- image_02.png
-
- Finally, if neither of those are provided,
og:image comes from the first
+
+- Finally, if neither of those are provided,
og:image comes from the first
Page Bundle
image with feature in the name, with a fallback to the first image with
-cover or thumbnail in the name. - For pages, you can also add audio (using frontmatter
audio: filename.ext) and/or
-videos.videos:
+cover or thumbnail in the name.
+- For pages, you can also add audio (using frontmatter
audio: filename.ext) and/or
+videos.
+videos:
- filename01.mov
- filename02.avi
-
Multilingual Support
Misc
Scroll-Bar themed (by default)
Smooth Scroll between in-page links (by default)
Scroll-to-Top Button (by default)
Displays a Scroll-to-Top button in right-bottom corner
-
Google Analytics integration
Syntax highlighting
RSS feeds
+
+
+Multilingual Support
+
+Misc
+Scroll-Bar themed (by default)
+Smooth Scroll between in-page links (by default)
+Scroll-to-Top Button (by default)
+Displays a Scroll-to-Top button in right-bottom corner
+
Google Analytics integration
+Syntax highlighting
+RSS feeds
+
+
+
+
+
\ No newline at end of file
+ PaperMod
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/posts/papermod/papermod-icons/index.html b/posts/papermod/papermod-icons/index.html
index 592ed95a..8ac1dfec 100644
--- a/posts/papermod/papermod-icons/index.html
+++ b/posts/papermod/papermod-icons/index.html
@@ -1,13 +1,492 @@
-Icons | PaperMod Icons [draft]
Table of Contents
Social Icons
No. Name Platform Link 1 123rf123rf.com 2 adobestockstock.adobe.com 3 behancebehance.net 4 buymeacoffeebuymeacoffee.com 5 codepencodepen.io 6 cryptohackcryptohack.org 7 ctftimectftime.org 8 devdev.to 9 discogsdiscogs.com 10 discorddiscord.com 11 dreamstimedreamstime.com 12 dribbbledribbble.com 13 email- 14 facebookfacebook.com 15 flickrflickr.com 16 freepikfreepik.com 17 giteagitea.io 18 githubgithub.com 19 gitlabgitlab.com 20 goodreadsgoodreads.com 21 hackeronehackerone.com 22 hackerrankhackerrank.com 23 hacktheboxhackthebox.eu 24 instagraminstagram.com 25 itchioitch.io 26 kakaotalkkakaocorp.com/service/KakaoTalk 27 keybasekeybase.io 28 kofiko-fi.com 29 lastfmlast.fm 30 liberapayliberapay.com 31 linkedinlinkedin.com 32 mastodonmastodon.social 33 matrixmatrix.org 34 mediummedium.com 35 mixcloudmixcloud.com 36 nugetnuget.org 37 paypalpaypal.com 38 qqqq.com 39 redditreddit.com 40 rss- 41 serverfaultserverfault.com 42 soundcloudsoundcloud.com 43 shutterstockshutterstock.com 44 slackslack.com 45 snapchatsnapchat.com/add 46 sourcerersourcerer.io 47 spotifyspotify.com 48 stackoverflowstackoverflow.com 49 steamsteampowered.com 50 telegramtelegram.org 51 twitchtwitch.tv 52 twittertwitter.com 53 unsplashunsplash.com 54 xdaxda-developers.com 55 youtubeyoutube.com 56 other-
Usage :
socialIcons:
+
+
+
+
+
+Icons | PaperMod
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+Icons [draft]
+
+
+
+
+
+Table of Contents
+
+
+-
+Social Icons
+-
+Share Icons
+
+
+
+
+
+Social Icons
+
+
+
+No.
+Name
+Platform Link
+
+
+
+
+1
+123rf123rf.com
+
+
+2
+adobestockstock.adobe.com
+
+
+3
+behancebehance.net
+
+
+4
+buymeacoffeebuymeacoffee.com
+
+
+5
+codepencodepen.io
+
+
+6
+cryptohackcryptohack.org
+
+
+7
+ctftimectftime.org
+
+
+8
+devdev.to
+
+
+9
+discogsdiscogs.com
+
+
+10
+discorddiscord.com
+
+
+11
+dreamstimedreamstime.com
+
+
+12
+dribbbledribbble.com
+
+
+13
+email-
+
+
+14
+facebookfacebook.com
+
+
+15
+flickrflickr.com
+
+
+16
+freepikfreepik.com
+
+
+17
+giteagitea.io
+
+
+18
+githubgithub.com
+
+
+19
+gitlabgitlab.com
+
+
+20
+goodreadsgoodreads.com
+
+
+21
+hackeronehackerone.com
+
+
+22
+hackerrankhackerrank.com
+
+
+23
+hacktheboxhackthebox.eu
+
+
+24
+instagraminstagram.com
+
+
+25
+itchioitch.io
+
+
+26
+kakaotalkkakaocorp.com/service/KakaoTalk
+
+
+27
+keybasekeybase.io
+
+
+28
+kofiko-fi.com
+
+
+29
+lastfmlast.fm
+
+
+30
+liberapayliberapay.com
+
+
+31
+linkedinlinkedin.com
+
+
+32
+mastodonmastodon.social
+
+
+33
+matrixmatrix.org
+
+
+34
+mediummedium.com
+
+
+35
+mixcloudmixcloud.com
+
+
+36
+nugetnuget.org
+
+
+37
+paypalpaypal.com
+
+
+38
+qqqq.com
+
+
+39
+redditreddit.com
+
+
+40
+rss-
+
+
+41
+serverfaultserverfault.com
+
+
+42
+soundcloudsoundcloud.com
+
+
+43
+shutterstockshutterstock.com
+
+
+44
+slackslack.com
+
+
+45
+snapchatsnapchat.com/add
+
+
+46
+sourcerersourcerer.io
+
+
+47
+spotifyspotify.com
+
+
+48
+stackoverflowstackoverflow.com
+
+
+49
+steamsteampowered.com
+
+
+50
+telegramtelegram.org
+
+
+51
+twitchtwitch.tv
+
+
+52
+twittertwitter.com
+
+
+53
+unsplashunsplash.com
+
+
+54
+xdaxda-developers.com
+
+
+55
+youtubeyoutube.com
+
+
+56
+other-
+
+
+
+Usage :
+socialIcons:
- name: "kofi"
url: "https://kofi.com"
- name: "twitter"
url: "https://twitter.com"
-
Share Icons
No. Platform 1 twitter (also generates hash tags from tags linked with post)2 linkedin3 reddit4 facebook5 whatsapp6 telegram
Usage:
params:
+
+Share Icons
+
+
+
+No.
+Platform
+
+
+
+
+1
+twitter (also generates hash tags from tags linked with post)
+
+2
+linkedin
+
+3
+reddit
+
+4
+facebook
+
+5
+whatsapp
+
+6
+telegram
+
+
+Usage:
+params:
ShowShareButtons: true
-
+
+
+Installation | Update | PaperMod Installation | Update
Intro
- We’ll be using
yml/yaml format for all examples down below, I recommend using yml over toml as it is easier to read. - You can find any YML to TOML converters if necessary.
Guide
Follow Quick Start guide to setup hugo and create a new site.
Note: Use -f to select yml format
hugo new site <name of site> -f yml
Make sure you install latest version of hugo(>=0.83.0).
After you have created a new site, at Step 3 follow the steps:
Method 1
Inside the folder of your Hugo site, run:
git clone https://github.com/adityatelange/hugo-PaperMod themes/PaperMod --depth=1
-
Note: You may use --branch v5.0 to end of above command if you want to stick to specific release.
Updating theme :
cd themes/PaperMod
+
+
+
+
+
+Installation | Update | PaperMod
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+Installation | Update
+
+
+
+
+
+Table of Contents
+
+
+-
+Intro
+-
+Guide
+
+-
+Quick Links
+
+-
+Sample
config.yml
+-
+Sample
Page.md
+
+
+
+
+
+Intro
+
+- We’ll be using
yml/yaml format for all examples down below, I recommend using yml over toml as it is easier to read.
+- You can find any YML to TOML converters if necessary.
+
+
+Guide
+Follow Quick Start guide to setup hugo and create a new site.
+
+Note: Use -f to select yml format
+hugo new site <name of site> -f yml
+
+Make sure you install latest version of hugo(>=0.83.0).
+After you have created a new site, at Step 3 follow the steps:
+Method 1
+Inside the folder of your Hugo site, run:
+git clone https://github.com/adityatelange/hugo-PaperMod themes/PaperMod --depth=1
+
Note: You may use --branch v5.0 to end of above command if you want to stick to specific release.
+
+Updating theme :
+cd themes/PaperMod
git pull
-
Method 2
you can use as submodule with
git submodule add https://github.com/adityatelange/hugo-PaperMod.git themes/PaperMod --depth=1
+
+Method 2
+You can use as submodule with
+git submodule add https://github.com/adityatelange/hugo-PaperMod.git themes/PaperMod --depth=1
git submodule update --init --recursive # needed when you reclone your repo (submodules may not get cloned automatically)
-
Note: You may use --branch v5.0 to end of above command if you want to stick to specific release.
Updating theme :
git submodule update --remote --merge
-
Method 3
Or you can Download as Zip from Github Page and extract in your themes directory
Direct Links:
Finally …
Add in config.yml:
theme: "PaperMod"
-
Quick Links
Sample config.yml
Example Site Structure is present here: exampleSite
Use appropriately
baseURL: "https://examplesite.com/"
+
Note: You may use --branch v5.0 to end of above command if you want to stick to specific release.
+
+Updating theme :
+git submodule update --remote --merge
+
+Method 3
+Or you can Download as Zip from Github Page and extract in your themes directory
+Direct Links:
+
+Finally …
+Add in config.yml:
+theme: "PaperMod"
+
Method 4
+
+-
+
Install Go programming language in your operating system.
+
+-
+
Intialize your own hugo mod
+
+
+hugo mod init YOUR_OWN_GIT_REPOSITORY
+
+- Add PaperMod in your
config.yml file
+
+module:
+ imports:
+ - path: github.com/adityatelange/hugo-PaperMod
+
+- Update theme
+
+hugo mod get -u
+
+Quick Links
+
+-
+
Papermod - Features
+
+-
+
Papermod - FAQs
+
+-
+
Papermod - Variables
+
+-
+
Papermod - Icons
+
+-
+
ChangeLog
+
+
+
+Sample config.yml
+
+Example Site Structure is present here: exampleSite
+
+Use appropriately
+baseURL: "https://examplesite.com/"
title: ExampleSite
paginate: 5
theme: PaperMod
@@ -140,7 +355,9 @@ git submodule update --init --recursive # needed when
# guessSyntax: true
# lineNos: true
# style: monokai
-
Sample Page.md
---
+
+Sample Page.md
+---
title: "My 1st post"
date: 2020-09-15T11:30:03+00:00
# weight: 1
@@ -174,8 +391,51 @@ git submodule update --init --recursive # needed when
Text: "Suggest Changes" # edit text
appendFilePath: true # to append file path to Edit link
---
-
You can use it by creating archetypes/post.md
hugo new --kind post <name>
-
You can use it by creating archetypes/post.md
+hugo new --kind post <name>
+
+
+
+Variables | Front Matter | PaperMod Variables | Front Matter [draft]
Below are variables used with this theme…
Site Variables under Params
name type example Description envstring ‘production’ To set env to production titlestring ‘My Blog’ To set title descriptionstring ‘This is a blog of mine’ To set site description authorstring |list ‘Me’ | [‘Me’,‘You’] To show multiple Authors imagesstring ‘myimage.png’ Link or path of image for opengraph, twitter-cards keywordslist [blog, page] Add keywords for Home page DateFormatstring “January 2, 2006” The format of date strings in the website. Details languageAltTitlestring “English” Alternate title in Multilingual Mode ShowReadingTimeboolean true | false To show read time in post meta ShowShareButtonsboolean true | false To show/hide share buttons under post ShowCodeCopyButtonsboolean true | false To show/hide Code Copy button ShowFullTextinRSSboolean true | false To show Content in RSS feed defaultThemestring light | dark | auto To set default theme disableThemeToggleboolean true | false To disable theme toggle icon shown besides label disableSpecial1stPostboolean true | false To disable no-card special appearance of 1st post disableScrollToTopboolean true | false To disable ScrollToTop button disableAnchoredHeadingsboolean true | false To disable Anchored Headings hideMetaboolean true | false To Hide meta elements : date, read-time, author and available-translations for page hideSummaryboolean true | false To Hide summary being shown in list pages showtocboolean true | false To show/hide Table of Contents tocopenboolean true | false To keep open ToC by default on page load ShowPostNavLinksboolean true | false Show Previous and Next Posts below a Post ShowBreadCrumbsboolean true | false Show BreadCrumb Navigation above single post/page commentsboolean true | false To show/hide comments analytics.google.SiteVerificationTagstring “XYZabc” Site Verification Tag for Google Analytics analytics.bing.SiteVerificationTagstring “XYZabc” Site Verification Tag for Bing analytics.yandex.SiteVerificationTagstring “XYZabc” Site Verification Tag for Yandex schema- - Details fuseOpts- - Details socialIcons- - Details label- - Details assets- - Details cover- - Details profileMode- - Details editPost- - Details
Site Variables
name type example Description copyrightstring **[example.site](https://example.site)**This is HUGO’s site variable, which can also render markdown content
label
name type example Description label.textstring ‘Home’ To display different label text other than title label.iconstring ‘/apple-touch-icon.png’ To display a logo image in label label.iconHeightinteger 35 To set size of label logo image
profileMode
name type example Description profileMode.enabledboolean true | false For enabling profileMode, needs to be explicitly set profileMode.titlestring “Title” Title profileMode.subtitlestring “subtitle here” Subtitle profileMode.imageUrlstring “image.png” | “https://example.com/image.jpg" Image URL or Link profileMode.imageWidthstring “150” Width of image profileMode.imageHeightstring “150” Height of image profileMode.imageTitlestring “This image is a picture of ..” Title of image profileMode.buttons- - Details
profileMode.buttons
profileMode:
+
+
+
+
+
+Variables | Front Matter | PaperMod
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+Variables | Front Matter [draft]
+
+
+
+
+
+Table of Contents
+
+
+-
+Site Variables under
Params
+-
+Site Variables
+-
+label
+-
+profileMode
+
+-
+assets
+-
+cover
+-
+schema
+-
+fuseOpts
+-
+socialIcons
+-
+editPost
+
+-
+Page Variables
+
+
+
+
+
+Below are variables used with this theme…
+
+Site Variables under Params
+
+
+
+name
+type
+example
+Description
+
+
+
+
+envstring
+‘production’
+To set env to production
+
+
+titlestring
+‘My Blog’
+To set title
+
+
+descriptionstring
+‘This is a blog of mine’
+To set site description
+
+
+authorstring |list
+‘Me’ | [‘Me’,‘You’]
+To show multiple Authors
+
+
+imagesstring
+‘myimage.png’
+Link or path of image for opengraph, twitter-cards
+
+
+keywordslist
+[blog, page]
+Add keywords for Home page
+
+
+DateFormatstring
+“January 2, 2006”
+The format of date strings in the website. Details
+
+
+languageAltTitlestring
+“English”
+Alternate title in Multilingual Mode
+
+
+ShowReadingTimeboolean
+true | false
+To show read time in post meta
+
+
+ShowShareButtonsboolean
+true | false
+To show/hide share buttons under post
+
+
+ShowCodeCopyButtonsboolean
+true | false
+To show/hide Code Copy button
+
+
+ShowFullTextinRSSboolean
+true | false
+To show Content in RSS feed
+
+
+defaultThemestring
+light | dark | auto
+To set default theme
+
+
+disableThemeToggleboolean
+true | false
+To disable theme toggle icon shown besides label
+
+
+disableSpecial1stPostboolean
+true | false
+To disable no-card special appearance of 1st post
+
+
+disableScrollToTopboolean
+true | false
+To disable ScrollToTop button
+
+
+disableAnchoredHeadingsboolean
+true | false
+To disable Anchored Headings
+
+
+hideMetaboolean
+true | false
+To Hide meta elements : date, read-time, author and available-translations for page
+
+
+hideSummaryboolean
+true | false
+To Hide summary being shown in list pages
+
+
+showtocboolean
+true | false
+To show/hide Table of Contents
+
+
+tocopenboolean
+true | false
+To keep open ToC by default on page load
+
+
+ShowPostNavLinksboolean
+true | false
+Show Previous and Next Posts below a Post
+
+
+ShowBreadCrumbsboolean
+true | false
+Show BreadCrumb Navigation above single post/page
+
+
+commentsboolean
+true | false
+To show/hide comments
+
+
+analytics.google.SiteVerificationTagstring
+“XYZabc”
+Site Verification Tag for Google Analytics
+
+
+analytics.bing.SiteVerificationTagstring
+“XYZabc”
+Site Verification Tag for Bing
+
+
+analytics.yandex.SiteVerificationTagstring
+“XYZabc”
+Site Verification Tag for Yandex
+
+
+schema-
+-
+Details
+
+
+fuseOpts-
+-
+Details
+
+
+socialIcons-
+-
+Details
+
+
+label-
+-
+Details
+
+
+assets-
+-
+Details
+
+
+cover-
+-
+Details
+
+
+profileMode-
+-
+Details
+
+
+editPost-
+-
+Details
+
+
+
+Site Variables
+
+
+
+name
+type
+example
+Description
+
+
+
+
+copyrightstring
+**[example.site](https://example.site)**This is HUGO’s site variable, which can also render markdown content
+
+
+
+label
+
+
+
+name
+type
+example
+Description
+
+
+
+
+label.textstring
+‘Home’
+To display different label text other than title
+
+
+label.iconstring
+‘/apple-touch-icon.png’
+To display a logo image in label
+
+
+label.iconHeightinteger
+35
+To set size of label logo image
+
+
+
+profileMode
+
+
+
+name
+type
+example
+Description
+
+
+
+
+profileMode.enabledboolean
+true | false
+For enabling profileMode, needs to be explicitly set
+
+
+profileMode.titlestring
+“Title”
+Title
+
+
+profileMode.subtitlestring
+“subtitle here”
+Subtitle
+
+
+profileMode.imageUrlstring
+“image.png” | “https://example.com/image.jpg"
+Image URL or Link
+
+
+profileMode.imageWidth string
+“150”
+Width of image
+
+
+profileMode.imageHeightstring
+“150”
+Height of image
+
+
+profileMode.imageTitlestring
+“This image is a picture of ..”
+Title of image
+
+
+profileMode.buttons-
+-
+Details
+
+
+
+profileMode.buttons
+profileMode:
buttons:
- name: Archive
url: "/archive"
- name: Github
url: "https://github.com/"
-
assets
name type example Description assets.faviconstring ‘icon.ico’ To set favicon, can be path or external link assets.disableHLJSboolean true | false To disable Highlight.js loading assets.disableFingerprintingboolean true | false To disable Sub-Resource integrity for assets
cover
name type example Description cover.linkFullImagesboolean true | false To open full size cover images on click on cover cover.responsiveImagesboolean true | false To enable/disable generation of responsive cover images cover.hiddenboolean true | false To hide everywhere but not in structured data cover.hiddenInListboolean true | false To hide on list pages and home cover.hiddenInSingleboolean true | false To hide on list pages and home
schema
name type example Description schema.publisherTypestring ‘Organization’ https://schema.org/publisher schema.sameAslist [“URL1”, “URL2”] Set https://schema.org/sameAs
fuseOpts
Refer: https://fusejs.io/api/options.html
fuseOpts:
+
assets
+
+
+
+name
+type
+example
+Description
+
+
+
+
+assets.faviconstring
+‘icon.ico’
+To set favicon, can be path or external link
+
+
+assets.disableHLJSboolean
+true | false
+To disable Highlight.js loading
+
+
+assets.disableFingerprintingboolean
+true | false
+To disable Sub-Resource integrity for assets
+
+
+
+cover
+
+
+
+name
+type
+example
+Description
+
+
+
+
+cover.linkFullImagesboolean
+true | false
+To open full size cover images on click on cover
+
+
+cover.responsiveImagesboolean
+true | false
+To enable/disable generation of responsive cover images
+
+
+cover.hiddenboolean
+true | false
+To hide everywhere but not in structured data
+
+
+cover.hiddenInListboolean
+true | false
+To hide on list pages and home
+
+
+cover.hiddenInSingle boolean
+true | false
+To hide on list pages and home
+
+
+
+schema
+
+
+
+name
+type
+example
+Description
+
+
+
+
+schema.publisherTypestring
+‘Organization’
+https://schema.org/publisher
+
+
+schema.sameAslist
+[“URL1”, “URL2”]
+Set https://schema.org/sameAs
+
+
+
+fuseOpts
+Refer: https://fusejs.io/api/options.html
+fuseOpts:
isCaseSensitive: false
shouldSort: true
location: 0
@@ -13,17 +576,207 @@
threshold: 0.4
minMatchCharLength: 0
keys: ["title", "permalink", "summary", "content"] ## can be less but not more than shown in list
-
socialIcons
socialIcons:
+
socialIcons
+socialIcons:
- name: "<platform>"
url: "<link>"
- name: "<platform 2>"
url: "<link2>"
-
editPost
editPost:
+
editPost
+editPost:
URL: "https://github.com/<path_to_repo>/content"
Text: "Suggest Changes" # edit text
appendFilePath: true # to append file path to Edit link
-
Note: Same format is being used by Page Variables
Page Variables
Name Type Example Description showtocboolean true | false To show/hide Table of Contents tocopenboolean true | false To keep open ToC by default on page load hidemetaboolean true | false To Hide meta elements : date, read-time, author and available-translations for page commentsboolean true | false To show/hide comments descriptionstring ‘description text’ Show Post Description under Title canonicalURLstring “https://canonical.url/to/page" To add canonical URL to posts disableShareboolean true | false To hide/show share icons under a page disableHLJSboolean true | false To disable Highlight.js loading disableAnchoredHeadingsboolean true | false To disable Anchored Headings searchHiddenboolean true | false Hide page from search hideSummaryboolean true | false To Hide summary being shown in list pages ShowReadingTimeboolean true | false To show read time in post meta ShowBreadCrumbsboolean true | false Show BreadCrumb Navigation above single post/page ShowPostNavLinksboolean true | false Show Previous and Next Posts below a Post authorstring |list ‘Me’ | [‘Me’,‘You’] To show multiple Authors cover.imagestring ‘featured.jpg’ To add a cover image cover.captionstring ‘caption for image’ To add caption to cover image cover.altstring ‘this is cover image’ Alternate text to show if image doesn’t load/show up cover.relativeboolean true | false To use relative path for cover image, used in hugo Page-bundles cover.hiddenboolean true | false To hide on current single page weightinteger 5 To set page order or to pin a post to Top of list
+Note: Same format is being used by Page Variables
+
+
+Page Variables
+
+
+
+Name
+Type
+Example
+Description
+
+
+
+
+showtocboolean
+true | false
+To show/hide Table of Contents
+
+
+tocopenboolean
+true | false
+To keep open ToC by default on page load
+
+
+hidemetaboolean
+true | false
+To Hide meta elements : date, read-time, author and available-translations for page
+
+
+commentsboolean
+true | false
+To show/hide comments
+
+
+descriptionstring
+‘description text’
+Show Post Description under Title
+
+
+canonicalURLstring
+“https://canonical.url/to/page"
+To add canonical URL to posts
+
+
+disableShareboolean
+true | false
+To hide/show share icons under a page
+
+
+disableHLJSboolean
+true | false
+To disable Highlight.js loading
+
+
+disableAnchoredHeadingsboolean
+true | false
+To disable Anchored Headings
+
+
+searchHiddenboolean
+true | false
+Hide page from search
+
+
+hideSummaryboolean
+true | false
+To Hide summary being shown in list pages
+
+
+ShowReadingTimeboolean
+true | false
+To show read time in post meta
+
+
+ShowBreadCrumbsboolean
+true | false
+Show BreadCrumb Navigation above single post/page
+
+
+ShowPostNavLinksboolean
+true | false
+Show Previous and Next Posts below a Post
+
+
+authorstring |list
+‘Me’ | [‘Me’,‘You’]
+To show multiple Authors
+
+
+cover.imagestring
+‘featured.jpg’
+To add a cover image
+
+
+cover.caption string
+‘caption for image’
+To add caption to cover image
+
+
+cover.altstring
+‘this is cover image’
+Alternate text to show if image doesn’t load/show up
+
+
+cover.relativeboolean
+true | false
+To use relative path for cover image, used in hugo Page-bundles
+
+
+cover.hidden boolean
+true | false
+To hide on current single page
+
+
+weight integer
+5
+To set page order or to pin a post to Top of list
+
+
+
+
+
+Placeholder Text | PaperMod Placeholder Text
Lorem Ipsum Dolor Si AmetTable of Contents
Lorem est tota propiore conpellat pectoribus de pectora summo.
Redit teque digerit hominumque toris verebor lumina non cervice subde tollit usus habet Arctonque, furores quas nec ferunt. Quoque montibus nunc caluere tempus inhospita parcite confusaque translucet patri vestro qui optatis lumine cognoscere flos nubis! Fronde ipsamque patulos Dryopen deorum.
- Exierant elisi ambit vivere dedere
- Duce pollice
- Eris modo
- Spargitque ferrea quos palude
Rursus nulli murmur; hastile inridet ut ab gravi sententia! Nomine potitus silentia flumen, sustinet placuit petis in dilapsa erat sunt. Atria tractus malis.
- Comas hunc haec pietate fetum procerum dixit
- Post torum vates letum Tiresia
- Flumen querellas
- Arcanaque montibus omnes
- Quidem et
Vagus elidunt
Mane refeci capiebant unda mulcebat
Victa caducifer, malo vulnere contra dicere aurato, ludit regale, voca! Retorsit colit est profanae esse virescere furit nec; iaculi matertera et visa est, viribus. Divesque creatis, tecta novat collumque vulnus est, parvas. Faces illo pepulere tempus adest. Tendit flamma, ab opes virum sustinet, sidus sequendo urbis.
Iubar proles corpore raptos vero auctor imperium; sed et huic: manus caeli Lelegas tu lux. Verbis obstitit intus oblectamina fixis linguisque ausus sperare Echionides cornuaque tenent clausit possit. Omnia putatur. Praeteritae refert ausus; ferebant e primus lora nutat, vici quae mea ipse. Et iter nil spectatae vulnus haerentia iuste et exercebat, sui et.
Eurytus Hector, materna ipsumque ut Politen, nec, nate, ignari, vernum cohaesit sequitur. Vel mitis temploque vocatus, inque alis, oculos nomen non silvis corpore coniunx ne displicet illa. Crescunt non unus, vidit visa quantum inmiti flumina mortis facto sic: undique a alios vincula sunt iactata abdita! Suspenderat ego fuit tendit: luna, ante urbem Propoetides parte.
Rich Content | PaperMod Rich Content
A brief description of Hugo ShortcodesHugo ships with several Built-in Shortcodes for rich content, along with a Privacy Config and a set of Simple Shortcodes that enable static and no-JS versions of various social media embeds.
YouTube Privacy Enhanced Shortcode
Twitter Simple Shortcode
“In addition to being more logical, asymmetry has the advantage that its complete appearance is far more optically effective than symmetry.”
— Jan Tschichold pic.twitter.com/gcv7SrhvJb
— Graphic Design History (@DesignReviewed) January 17, 2019
Vimeo Simple Shortcode
Search | PaperMod Search
Series | PaperMod Series
PaperMod | PaperMod PaperMod
Installation | Update
Read Install and Update instructions here
Themes Guide | PaperMod Themes Guide
Markdown Syntax Guide
This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme.
-...
css | PaperMod css
Markdown Syntax Guide
This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme.
-...
emoji | PaperMod emoji
Emoji Support
Emoji can be enabled in a Hugo project in a number of ways.
-...
html | PaperMod html
Markdown Syntax Guide
This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme.
-...
Tags | PaperMod Tags
markdown | PaperMod markdown
Markdown Syntax Guide
This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme.
-...
Placeholder Text
Lorem est tota propiore conpellat pectoribus de pectora summo.
-...
PaperMod | PaperMod PaperMod
Installation | Update
Read Install and Update instructions here
Features
Learn About All Features in PaperMod
FAQs [draft]
Frequently Asked Questions
Icons [draft]
List of all Icons supported by PaperMod
Variables | Front Matter [draft]
List of Front Matter variables used by PaperMod
privacy | PaperMod privacy
Rich Content
Hugo ships with several Built-in Shortcodes for rich content, along with a Privacy Config and a set of Simple Shortcodes that enable static and no-JS versions of various social media embeds.
-...
shortcodes | PaperMod shortcodes
Rich Content
Hugo ships with several Built-in Shortcodes for rich content, along with a Privacy Config and a set of Simple Shortcodes that enable static and no-JS versions of various social media embeds.
-...
text | PaperMod text
Placeholder Text
Lorem est tota propiore conpellat pectoribus de pectora summo.
-...
themes | PaperMod themes
Markdown Syntax Guide
This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme.
-...
