mirror of
https://github.com/Wonderfall/hugo-WonderMod.git
synced 2024-12-11 16:54:19 -05:00
96 lines
39 KiB
HTML
96 lines
39 KiB
HTML
<!doctype html><html lang=en dir=auto><head><meta charset=utf-8><meta http-equiv=x-ua-compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1,shrink-to-fit=no"><meta name=robots content="index, follow"><title>Papermod - Features | PaperMod</title><meta name=keywords content="PaperMod"><meta name=description content="Get known about All Features in PaperMod"><meta name=author content="Aditya Telange"><link rel=canonical href=https://adityatelange.github.io/hugo-PaperMod/posts/papermod/papermod-features/><link href=https://adityatelange.github.io/hugo-PaperMod/assets/css/stylesheet.min.c67f61ce2add05cf1690a03e10f394ed97d680c36fc4d7e53203318142a5ab6c.css integrity="sha256-xn9hzirdBc8WkKA+EPOU7ZfWgMNvxNflMgMxgUKlq2w=" rel="preload stylesheet" as=style><link rel=icon href=https://adityatelange.github.io/hugo-PaperMod/favicon.ico><link rel=icon type=image/png sizes=16x16 href=https://adityatelange.github.io/hugo-PaperMod/favicon-16x16.png><link rel=icon type=image/png sizes=32x32 href=https://adityatelange.github.io/hugo-PaperMod/favicon-32x32.png><link rel=apple-touch-icon href=https://adityatelange.github.io/hugo-PaperMod/apple-touch-icon.png><link rel=mask-icon href=https://adityatelange.github.io/hugo-PaperMod/safari-pinned-tab.svg><meta name=theme-color content="#2e2e33"><meta name=msapplication-TileColor content="#2e2e33"><meta name=generator content="Hugo 0.79.1"><meta property="og:title" content="Papermod - Features"><meta property="og:description" content="Get known about All Features in PaperMod"><meta property="og:type" content="article"><meta property="og:url" content="https://adityatelange.github.io/hugo-PaperMod/posts/papermod/papermod-features/"><meta property="article:published_time" content="2020-09-16T11:30:03+05:30"><meta property="article:modified_time" content="2020-09-16T11:30:03+05:30"><meta name=twitter:card content="summary"><meta name=twitter:title content="Papermod - Features"><meta name=twitter:description content="Get known about All Features in PaperMod"><script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","headline":"Papermod - Features","name":"Papermod - Features","description":"Get known about All Features in PaperMod","keywords":["PaperMod"],"articleBody":"Assets (js/css) The following is enabled by default\n minification - makes the assets size smallest as possible. bundling - bundles all the styles in one single asset fingerprint/intergity 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\nTo disable it :\ndisableThemeToggle: true You can refer following table for better understanding…\n defaultTheme disableThemeToggle checks local storage? checks system theme? Info auto true No Yes only system theme false Yes (if not-2) Yes (2) switch present dark true No No force dark only false Yes No switch present light true No No force light only false Yes No switch present Archives Layout Create a page with archive.md in content directory with following content\n--- title: \"Archive\" # in any language you want layout: \"archives\" # is necessary url: \"/archive\" summary: \"archive\" --- Note: Archives Layout does not support Multilingual Month Translations.\nex: archives.md\n Regular Mode (default-mode) Home-Info Mode Use 1st entry as some Information\nadd following to config file\nparams: homeInfoParams: Title: Hi there wave Content: Can be Info, links, about... socialIcons: # optional - name: \"\" url: \"\" - name: \"\" url: \"\" ex. here\n Profile Mode Shows Index/Home page as Full Page with Social Links and Image\nadd following to config file\nparams: profileMode: enabled: true title: \"\" # optional default will be site title imageUrl: \"\" # optional imageTitle: \"\" # optional imageWidth: 120 # custom size imageHeight: 120 # custom size buttons: - name: Archive url: \"/archive\" - name: Github url: \"https://github.com/\" socialIcons: # optional - name: \"\" url: \"\" - name: \"\" url: \"\" Search Add the following to site config, config.yml\noutputs: home: - HTML - RSS - JSON # is necessary Create a page with search.md in content directory with following content\n--- title: \"Search\" # in any language you want layout: \"search\" # is necessary # url: \"/archive\" summary: \"search\" --- For Multilingual use search..md ex. search.es.md.\nNote: Search will work only on current language, user is currently on !\nCustomizing Fusejs Options\nRefer https://fusejs.io/api/options.html for Options, Add those as shown below.\nparams: fuseOpts: isCaseSensitive: false shouldSort: true location: 0 distance: 1000 threshold: 0.4 minMatchCharLength: 0 keys: [\"title\", \"permalink\", \"summary\", \"content\"] ex: search.md\n Draft Page indication adds [draft] mark to indicate draft pages.\n Post Cover Image In post’s page-variables add :\ncover: image: \"\" # can also paste direct link from external site # ex. https://i.ibb.co/K0HVPBd/paper-mod-profilemode.png alt: \"\" caption: \"\" When you include images in the Page Bundle, multiple sizes of the image will automatically be provided using the HTML5 srcset field.\nTo reduce generation time and size of the site, you can disable this feature using\nparams: cover: responsiveImages: false To enable hyperlinks to the full image size on post pages, use\nparams: cover: linkFullImages: true Share Buttons on post Displays Share Buttons at Bottom of each post\nto show share buttons add\nparams: ShowShareButtons: true Show post reading time Displays Reading Time (the estimated time, in minutes, it takes to read the content.)\nTo show reading time add\nParams: ShowReadingTime: true Show Table of Contents (Toc) on blog post Displays ToC on blog-pages\nTo show ToC add following to page-variables\nShowToc: true To keep Toc Open by default on a post add following to page-variables:\nTocOpen: true Multiple Authors To Use multiple authors for a post, in post-variables:\n--- author: [\"Me\", \"You\"] --- To use Multiple Authors Site-wide, in config.yml:\nparams: author: [\"Me\", \"You\"] Comments to add comments, create a html file\nlayouts/partials/comments.html\nand paste code provided by your comments provider\nalso in config add this\nparams: comments: true read more about this here\n 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\nGoogle Analytics integration Open-Graph support Twitter Cards Support Syntax highlighting Twitter cards and opengraph tags support RSS feeds Multilingual Support ","wordCount":"675","inLanguage":"en","datePublished":"2020-09-16T11:30:03+05:30","dateModified":"2020-09-16T11:30:03+05:30","author":{"@type":"Person","name":"Aditya Telange"},"mainEntityOfPage":{"@type":"WebPage","@id":"https://adityatelange.github.io/hugo-PaperMod/posts/papermod/papermod-features/"},"publisher":{"@type":"Organization","name":"PaperMod","logo":{"@type":"ImageObject","url":"https://adityatelange.github.io/hugo-PaperMod/favicon.ico"}}}</script></head><body id=top><script>if(localStorage.getItem("pref-theme")==="dark"){document.body.classList.add('dark');}else if(localStorage.getItem("pref-theme")==="light"){document.body.classList.remove('dark')}else if(window.matchMedia('(prefers-color-scheme: dark)').matches){document.body.classList.add('dark');}</script><noscript><style type=text/css>.theme-toggle,.top-link{display:none}</style></noscript><header class=header><nav class=nav><div class=logo><a href=https://adityatelange.github.io/hugo-PaperMod/ accesskey=h title="PaperMod (Alt + H)">PaperMod</a>
|
||
<span class=logo-switches><span class=theme-toggle title="(Alt + T)"><a id=theme-toggle accesskey=t><svg id="moon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentcolor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z"/></svg><svg id="sun" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentcolor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="5"/><line x1="12" y1="1" x2="12" y2="3"/><line x1="12" y1="21" x2="12" y2="23"/><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"/><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"/><line x1="1" y1="12" x2="3" y2="12"/><line x1="21" y1="12" x2="23" y2="12"/><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"/><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"/></svg></a></span><span class=lang-switch><span>|</span><ul><li><a href=https://adityatelange.github.io/hugo-PaperMod/l2/ title=Lang2 aria-label=Lang2>Lang2</a></li><li><a href=https://adityatelange.github.io/hugo-PaperMod/l3/ title=Langrtl aria-label=Langrtl>Langrtl</a></li></ul></span></span></div><ul class=menu id=menu onscroll=menu_on_scroll()><li><a href=https://adityatelange.github.io/hugo-PaperMod/archives title=Archive><span>Archive</span></a></li><li><a href=https://adityatelange.github.io/hugo-PaperMod/search/ title="Search (Alt + /)" accesskey=/><span>Search</span></a></li><li><a href=https://adityatelange.github.io/hugo-PaperMod/tags/ title=Tags><span>Tags</span></a></li></ul></nav></header><main class=main><article class=post-single><header class=post-header><h1 class=post-title>Papermod - Features</h1><div class=post-meta>September 16, 2020 · 4 min · Aditya Telange</div></header><div class=toc><details open><summary accesskey=c title="(Alt + C)"><div class=details>Table of Contents</div></summary><blockquote><ul><li><a href=#assets-jscss aria-label="Assets (js/css)">Assets (js/css)</a></li><li><a href=#default-theme-lightdarkauto aria-label="Default Theme light/dark/auto">Default Theme light/dark/auto</a></li><li><a href=#theme-switch-toggle-enabled-by-default aria-label="Theme Switch Toggle (enabled by default)">Theme Switch Toggle (enabled by default)</a></li><li><a href=#archives-layout aria-label="Archives Layout">Archives Layout</a></li><li><a href=#regular-mode-default-mode aria-label="Regular Mode (default-mode)">Regular Mode (default-mode)</a></li><li><a href=#home-info-mode aria-label="Home-Info Mode">Home-Info Mode</a></li><li><a href=#profile-mode aria-label="Profile Mode">Profile Mode</a></li><li><a href=#search aria-label=Search>Search</a></li><li><a href=#draft-page-indication aria-label="Draft Page indication">Draft Page indication</a></li><li><a href=#post-cover-image aria-label="Post Cover Image">Post Cover Image</a></li><li><a href=#share-buttons-on-post aria-label="Share Buttons on post">Share Buttons on post</a></li><li><a href=#show-post-reading-time aria-label="Show post reading time">Show post reading time</a></li><li><a href=#show-table-of-contents-toc-on-blog-post aria-label="Show Table of Contents (Toc) on blog post">Show Table of Contents (Toc) on blog post</a></li><li><a href=#multiple-authors aria-label="Multiple Authors">Multiple Authors</a></li><li><a href=#comments aria-label=Comments>Comments</a></li><li><a href=#misc aria-label=Misc>Misc</a><ul><li><a href=#scroll-bar-themed-by-default aria-label="Scroll-Bar themed (by default)">Scroll-Bar themed (by default)</a></li><li><a href=#smooth-scroll-between-in-page-links-by-default aria-label="Smooth Scroll between in-page links (by default)">Smooth Scroll between in-page links (by default)</a></li><li><a href=#scroll-to-top-button-by-default aria-label="Scroll-to-Top Button (by default)">Scroll-to-Top Button (by default)</a></li><li><a href=#google-analytics-integration aria-label="Google Analytics integration">Google Analytics integration</a></li><li><a href=#open-graph-support aria-label="Open-Graph support">Open-Graph support</a></li><li><a href=#twitter-cards-support aria-label="Twitter Cards Support">Twitter Cards Support</a></li><li><a href=#syntax-highlighting aria-label="Syntax highlighting">Syntax highlighting</a></li><li><a href=#twitter-cards-and-opengraph-tags-support aria-label="Twitter cards and opengraph tags support">Twitter cards and opengraph tags support</a></li><li><a href=#rss-feeds aria-label="RSS feeds">RSS feeds</a></li><li><a href=#multilingual-support aria-label="Multilingual Support">Multilingual Support</a></li></ul></li></ul></blockquote></details></div><div class=post-content><h3 id=assets-jscss>Assets (js/css)<a hidden class=anchor aria-hidden=true href=#assets-jscss>#</a></h3><p>The following is enabled by default</p><ul><li><a href=https://gohugo.io/hugo-pipes/minification/>minification</a> - makes the assets size smallest as possible.</li><li><a href=https://gohugo.io/hugo-pipes/bundling/>bundling</a> - bundles all the styles in one single asset</li><li><a href=https://gohugo.io/hugo-pipes/fingerprint/>fingerprint/intergity</a> check.</li></ul><hr><h3 id=default-theme-lightdarkauto>Default Theme light/dark/auto<a hidden class=anchor aria-hidden=true href=#default-theme-lightdarkauto>#</a></h3><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>params</span>:
|
||
<span style=color:#75715e># defaultTheme: light</span>
|
||
<span style=color:#75715e># defaultTheme: dark</span>
|
||
<span style=color:#f92672>defaultTheme</span>: <span style=color:#ae81ff>auto</span> <span style=color:#75715e># to switch between dark or light according to browser theme</span>
|
||
</code></pre></div><hr><h3 id=theme-switch-toggle-enabled-by-default>Theme Switch Toggle (enabled by default)<a hidden class=anchor aria-hidden=true href=#theme-switch-toggle-enabled-by-default>#</a></h3><p>Shows icon besides title of page to change theme</p><p>To disable it :</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>disableThemeToggle</span>: <span style=color:#66d9ef>true</span>
|
||
</code></pre></div><p>You can refer following table for better understanding…</p><table><thead><tr><th><code>defaultTheme</code></th><th><code>disableThemeToggle</code></th><th>checks local storage?</th><th>checks system theme?</th><th>Info</th></tr></thead><tbody><tr><td><code>auto</code></td><td>true</td><td>No</td><td>Yes</td><td>only system theme</td></tr><tr><td></td><td>false</td><td>Yes (if not->2)</td><td>Yes (2)</td><td><em>switch present</em></td></tr><tr><td><code>dark</code></td><td>true</td><td>No</td><td>No</td><td>force dark only</td></tr><tr><td></td><td>false</td><td>Yes</td><td>No</td><td><em>switch present</em></td></tr><tr><td><code>light</code></td><td>true</td><td>No</td><td>No</td><td>force light only</td></tr><tr><td></td><td>false</td><td>Yes</td><td>No</td><td><em>switch present</em></td></tr></tbody></table><hr><h3 id=archives-layout>Archives Layout<a hidden class=anchor aria-hidden=true href=#archives-layout>#</a></h3><p>Create a page with <code>archive.md</code> in <code>content</code> directory with following content</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml>---
|
||
<span style=color:#f92672>title</span>: <span style=color:#e6db74>"Archive"</span> <span style=color:#75715e># in any language you want</span>
|
||
<span style=color:#f92672>layout</span>: <span style=color:#e6db74>"archives"</span> <span style=color:#75715e># is necessary</span>
|
||
<span style=color:#f92672>url</span>: <span style=color:#e6db74>"/archive"</span>
|
||
<span style=color:#f92672>summary</span>: <span style=color:#e6db74>"archive"</span>
|
||
---
|
||
|
||
</code></pre></div><p><strong>Note:</strong> Archives Layout does not support Multilingual Month Translations.</p><p>ex: <a href=https://raw.githubusercontent.com/adityatelange/hugo-PaperMod/exampleSite/content/archives.md>archives.md</a></p><hr><h3 id=regular-mode-default-mode>Regular Mode (default-mode)<a hidden class=anchor aria-hidden=true href=#regular-mode-default-mode>#</a></h3><p><img src=images/regular.webp alt=regular></p><hr><h3 id=home-info-mode>Home-Info Mode<a hidden class=anchor aria-hidden=true href=#home-info-mode>#</a></h3><p><img src=images/homeinfo.webp alt=homeinfo></p><p>Use 1st entry as some Information</p><p>add following to config file</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>params</span>:
|
||
<span style=color:#f92672>homeInfoParams</span>:
|
||
<span style=color:#f92672>Title</span>: <span style=color:#ae81ff>Hi there wave</span>
|
||
<span style=color:#f92672>Content</span>: <span style=color:#ae81ff>Can be Info, links, about...</span>
|
||
|
||
<span style=color:#f92672>socialIcons</span>: <span style=color:#75715e># optional</span>
|
||
- <span style=color:#f92672>name</span>: <span style=color:#e6db74>"<platform>"</span>
|
||
<span style=color:#f92672>url</span>: <span style=color:#e6db74>"<link>"</span>
|
||
- <span style=color:#f92672>name</span>: <span style=color:#e6db74>"<platform 2>"</span>
|
||
<span style=color:#f92672>url</span>: <span style=color:#e6db74>"<link2>"</span>
|
||
</code></pre></div><p>ex. <a href=https://github.com/adityatelange/hugo-PaperMod/blob/exampleSite/config.yml#L106>here</a></p><hr><h3 id=profile-mode>Profile Mode<a hidden class=anchor aria-hidden=true href=#profile-mode>#</a></h3><p><img src=images/profile.webp alt=profile></p><p>Shows Index/Home page as Full Page with Social Links and Image</p><p>add following to config file</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>params</span>:
|
||
<span style=color:#f92672>profileMode</span>:
|
||
<span style=color:#f92672>enabled</span>: <span style=color:#66d9ef>true</span>
|
||
<span style=color:#f92672>title</span>: <span style=color:#e6db74>"<Title>"</span> <span style=color:#75715e># optional default will be site title</span>
|
||
<span style=color:#f92672>imageUrl</span>: <span style=color:#e6db74>"<image link>"</span> <span style=color:#75715e># optional</span>
|
||
<span style=color:#f92672>imageTitle</span>: <span style=color:#e6db74>"<title of image as alt>"</span> <span style=color:#75715e># optional</span>
|
||
<span style=color:#f92672>imageWidth</span>: <span style=color:#ae81ff>120</span> <span style=color:#75715e># custom size</span>
|
||
<span style=color:#f92672>imageHeight</span>: <span style=color:#ae81ff>120</span> <span style=color:#75715e># custom size</span>
|
||
<span style=color:#f92672>buttons</span>:
|
||
- <span style=color:#f92672>name</span>: <span style=color:#ae81ff>Archive</span>
|
||
<span style=color:#f92672>url</span>: <span style=color:#e6db74>"/archive"</span>
|
||
- <span style=color:#f92672>name</span>: <span style=color:#ae81ff>Github</span>
|
||
<span style=color:#f92672>url</span>: <span style=color:#e6db74>"https://github.com/"</span>
|
||
|
||
<span style=color:#f92672>socialIcons</span>: <span style=color:#75715e># optional</span>
|
||
- <span style=color:#f92672>name</span>: <span style=color:#e6db74>"<platform>"</span>
|
||
<span style=color:#f92672>url</span>: <span style=color:#e6db74>"<link>"</span>
|
||
- <span style=color:#f92672>name</span>: <span style=color:#e6db74>"<platform 2>"</span>
|
||
<span style=color:#f92672>url</span>: <span style=color:#e6db74>"<link2>"</span>
|
||
</code></pre></div><hr><h3 id=search>Search<a hidden class=anchor aria-hidden=true href=#search>#</a></h3><p>Add the following to site config, <code>config.yml</code></p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>outputs</span>:
|
||
<span style=color:#f92672>home</span>:
|
||
- <span style=color:#ae81ff>HTML</span>
|
||
- <span style=color:#ae81ff>RSS</span>
|
||
- <span style=color:#ae81ff>JSON</span> <span style=color:#75715e># is necessary</span>
|
||
</code></pre></div><p>Create a page with <code>search.md</code> in <code>content</code> directory with following content</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml>---
|
||
<span style=color:#f92672>title</span>: <span style=color:#e6db74>"Search"</span> <span style=color:#75715e># in any language you want</span>
|
||
<span style=color:#f92672>layout</span>: <span style=color:#e6db74>"search"</span> <span style=color:#75715e># is necessary</span>
|
||
<span style=color:#75715e># url: "/archive"</span>
|
||
<span style=color:#f92672>summary</span>: <span style=color:#e6db74>"search"</span>
|
||
---
|
||
|
||
</code></pre></div><p>For Multilingual use <code>search.<lang>.md</code> ex. <code>search.es.md</code>.</p><p><strong>Note:</strong> Search will work only on current language, user is currently on !</p><p><strong>Customizing Fusejs Options</strong></p><p>Refer <a href=https://fusejs.io/api/options.html>https://fusejs.io/api/options.html</a> for Options, Add those as shown below.</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>params</span>:
|
||
<span style=color:#f92672>fuseOpts</span>:
|
||
<span style=color:#f92672>isCaseSensitive</span>: <span style=color:#66d9ef>false</span>
|
||
<span style=color:#f92672>shouldSort</span>: <span style=color:#66d9ef>true</span>
|
||
<span style=color:#f92672>location</span>: <span style=color:#ae81ff>0</span>
|
||
<span style=color:#f92672>distance</span>: <span style=color:#ae81ff>1000</span>
|
||
<span style=color:#f92672>threshold</span>: <span style=color:#ae81ff>0.4</span>
|
||
<span style=color:#f92672>minMatchCharLength</span>: <span style=color:#ae81ff>0</span>
|
||
<span style=color:#f92672>keys</span>: [<span style=color:#e6db74>"title"</span>, <span style=color:#e6db74>"permalink"</span>, <span style=color:#e6db74>"summary"</span>, <span style=color:#e6db74>"content"</span>]
|
||
</code></pre></div><p>ex: <a href=https://raw.githubusercontent.com/adityatelange/hugo-PaperMod/exampleSite/content/search.md>search.md</a></p><hr><h3 id=draft-page-indication>Draft Page indication<a hidden class=anchor aria-hidden=true href=#draft-page-indication>#</a></h3><p>adds <code>[draft]</code> mark to indicate draft pages.</p><hr><h3 id=post-cover-image>Post Cover Image<a hidden class=anchor aria-hidden=true href=#post-cover-image>#</a></h3><p>In post’s page-variables add :</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>cover</span>:
|
||
<span style=color:#f92672>image</span>: <span style=color:#e6db74>"<image path/url>"</span>
|
||
<span style=color:#75715e># can also paste direct link from external site</span>
|
||
<span style=color:#75715e># ex. https://i.ibb.co/K0HVPBd/paper-mod-profilemode.png</span>
|
||
<span style=color:#f92672>alt</span>: <span style=color:#e6db74>"<alt text>"</span>
|
||
<span style=color:#f92672>caption</span>: <span style=color:#e6db74>"<text>"</span>
|
||
</code></pre></div><p>When you include images in the <a href=https://gohugo.io/content-management/page-bundles/>Page Bundle</a>, multiple sizes of the image will automatically be provided using the HTML5 <code>srcset</code> field.</p><p>To reduce generation time and size of the site, you can disable this feature using</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>params</span>:
|
||
<span style=color:#f92672>cover</span>:
|
||
<span style=color:#f92672>responsiveImages</span>: <span style=color:#66d9ef>false</span>
|
||
</code></pre></div><p>To enable hyperlinks to the full image size on post pages, use</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>params</span>:
|
||
<span style=color:#f92672>cover</span>:
|
||
<span style=color:#f92672>linkFullImages</span>: <span style=color:#66d9ef>true</span>
|
||
</code></pre></div><hr><h3 id=share-buttons-on-post>Share Buttons on post<a hidden class=anchor aria-hidden=true href=#share-buttons-on-post>#</a></h3><p>Displays Share Buttons at Bottom of each post</p><p>to show share buttons add</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>params</span>:
|
||
<span style=color:#f92672>ShowShareButtons</span>: <span style=color:#66d9ef>true</span>
|
||
</code></pre></div><hr><h3 id=show-post-reading-time>Show post reading time<a hidden class=anchor aria-hidden=true href=#show-post-reading-time>#</a></h3><p>Displays Reading Time (the estimated time, in minutes, it takes to read the content.)</p><p>To show reading time add</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>Params</span>:
|
||
<span style=color:#f92672>ShowReadingTime</span>: <span style=color:#66d9ef>true</span>
|
||
</code></pre></div><hr><h3 id=show-table-of-contents-toc-on-blog-post>Show Table of Contents (Toc) on blog post<a hidden class=anchor aria-hidden=true href=#show-table-of-contents-toc-on-blog-post>#</a></h3><p>Displays ToC on blog-pages</p><p>To show ToC add following to page-variables</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>ShowToc</span>: <span style=color:#66d9ef>true</span>
|
||
</code></pre></div><p>To keep Toc Open <strong>by default</strong> on a post add following to page-variables:</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>TocOpen</span>: <span style=color:#66d9ef>true</span>
|
||
</code></pre></div><hr><h3 id=multiple-authors>Multiple Authors<a hidden class=anchor aria-hidden=true href=#multiple-authors>#</a></h3><p>To Use multiple authors for a post, in post-variables:</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml>---
|
||
<span style=color:#f92672>author</span>: [<span style=color:#e6db74>"Me"</span>, <span style=color:#e6db74>"You"</span>]
|
||
---
|
||
|
||
</code></pre></div><p>To use Multiple Authors Site-wide, in <code>config.yml</code>:</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>params</span>:
|
||
<span style=color:#f92672>author</span>: [<span style=color:#e6db74>"Me"</span>, <span style=color:#e6db74>"You"</span>]
|
||
</code></pre></div><hr><h3 id=comments>Comments<a hidden class=anchor aria-hidden=true href=#comments>#</a></h3><p>to add comments, create a html file</p><p><code>layouts/partials/comments.html</code></p><p>and paste code provided by your comments provider</p><p>also in config add this</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-yml data-lang=yml><span style=color:#f92672>params</span>:
|
||
<span style=color:#f92672>comments</span>: <span style=color:#66d9ef>true</span>
|
||
</code></pre></div><p>read more about this <a href=https://gohugo.io/content-management/comments/>here</a></p><hr><h3 id=misc>Misc<a hidden class=anchor aria-hidden=true href=#misc>#</a></h3><h4 id=scroll-bar-themed-by-default>Scroll-Bar themed (by default)<a hidden class=anchor aria-hidden=true href=#scroll-bar-themed-by-default>#</a></h4><h4 id=smooth-scroll-between-in-page-links-by-default>Smooth Scroll between in-page links (by default)<a hidden class=anchor aria-hidden=true href=#smooth-scroll-between-in-page-links-by-default>#</a></h4><h4 id=scroll-to-top-button-by-default>Scroll-to-Top Button (by default)<a hidden class=anchor aria-hidden=true href=#scroll-to-top-button-by-default>#</a></h4><p>Displays a Scroll-to-Top button in right-bottom corner</p><h4 id=google-analytics-integration>Google Analytics integration<a hidden class=anchor aria-hidden=true href=#google-analytics-integration>#</a></h4><h4 id=open-graph-support>Open-Graph support<a hidden class=anchor aria-hidden=true href=#open-graph-support>#</a></h4><h4 id=twitter-cards-support>Twitter Cards Support<a hidden class=anchor aria-hidden=true href=#twitter-cards-support>#</a></h4><h4 id=syntax-highlighting>Syntax highlighting<a hidden class=anchor aria-hidden=true href=#syntax-highlighting>#</a></h4><h4 id=twitter-cards-and-opengraph-tags-support>Twitter cards and opengraph tags support<a hidden class=anchor aria-hidden=true href=#twitter-cards-and-opengraph-tags-support>#</a></h4><h4 id=rss-feeds>RSS feeds<a hidden class=anchor aria-hidden=true href=#rss-feeds>#</a></h4><h4 id=multilingual-support>Multilingual Support<a hidden class=anchor aria-hidden=true href=#multilingual-support>#</a></h4></div><footer class=post-footer><ul class=post-tags><li><a href=https://adityatelange.github.io/hugo-PaperMod/tags/papermod/>PaperMod</a></li></ul><div class=share-buttons><a target=_blank rel="noopener noreferrer" aria-label="share Papermod - Features on twitter" href="https://twitter.com/intent/tweet/?text=Papermod%20-%20Features&url=https%3a%2f%2fadityatelange.github.io%2fhugo-PaperMod%2fposts%2fpapermod%2fpapermod-features%2f&hashtags=PaperMod"><svg viewBox="0 0 512 512"><path d="M449.446.0C483.971.0 512 28.03 512 62.554v386.892C512 483.97 483.97 512 449.446 512h-386.892c-34.524.0-62.554-28.03-62.554-62.554v-386.892c0-34.524 28.029-62.554 62.554-62.554h386.892zm-253.927 424.544c135.939.0 210.268-112.643 210.268-210.268.0-3.218.0-6.437-.153-9.502 14.406-10.421 26.973-23.448 36.935-38.314-13.18 5.824-27.433 9.809-42.452 11.648 15.326-9.196 26.973-23.602 32.49-40.92-14.252 8.429-30.038 14.56-46.896 17.931-13.487-14.406-32.644-23.295-53.946-23.295-40.767.0-73.87 33.104-73.87 73.87.0 5.824.613 11.494 1.992 16.858-61.456-3.065-115.862-32.49-152.337-77.241-6.284 10.881-9.962 23.601-9.962 37.088.0 25.594 13.027 48.276 32.95 61.456-12.107-.307-23.448-3.678-33.41-9.196v.92c0 35.862 25.441 65.594 59.311 72.49-6.13 1.686-12.72 2.606-19.464 2.606-4.751.0-9.348-.46-13.946-1.38 9.349 29.426 36.628 50.728 68.965 51.341-25.287 19.771-57.164 31.571-91.8 31.571-5.977.0-11.801-.306-17.625-1.073 32.337 21.15 71.264 33.41 112.95 33.41z"/></svg></a><a target=_blank rel="noopener noreferrer" aria-label="share Papermod - Features on linkedin" href="https://www.linkedin.com/shareArticle?mini=true&url=https%3a%2f%2fadityatelange.github.io%2fhugo-PaperMod%2fposts%2fpapermod%2fpapermod-features%2f&title=Papermod%20-%20Features&summary=Papermod%20-%20Features&source=https%3a%2f%2fadityatelange.github.io%2fhugo-PaperMod%2fposts%2fpapermod%2fpapermod-features%2f"><svg viewBox="0 0 512 512"><path d="M449.446.0C483.971.0 512 28.03 512 62.554v386.892C512 483.97 483.97 512 449.446 512h-386.892c-34.524.0-62.554-28.03-62.554-62.554v-386.892c0-34.524 28.029-62.554 62.554-62.554h386.892zM160.461 423.278V197.561h-75.04v225.717h75.04zm270.539.0v-129.439c0-69.333-37.018-101.586-86.381-101.586-39.804.0-57.634 21.891-67.617 37.266v-31.958h-75.021c.995 21.181.0 225.717.0 225.717h75.02v-126.056c0-6.748.486-13.492 2.474-18.315 5.414-13.475 17.767-27.434 38.494-27.434 27.135.0 38.007 20.707 38.007 51.037v120.768h75.024zm-307.552-334.556c-25.674.0-42.448 16.879-42.448 39.002.0 21.658 16.264 39.002 41.455 39.002h.484c26.165.0 42.452-17.344 42.452-39.002-.485-22.092-16.241-38.954-41.943-39.002z"/></svg></a><a target=_blank rel="noopener noreferrer" aria-label="share Papermod - Features on reddit" href="https://reddit.com/submit?url=https%3a%2f%2fadityatelange.github.io%2fhugo-PaperMod%2fposts%2fpapermod%2fpapermod-features%2f&title=Papermod%20-%20Features"><svg viewBox="0 0 512 512"><path d="M449.446.0C483.971.0 512 28.03 512 62.554v386.892C512 483.97 483.97 512 449.446 512h-386.892c-34.524.0-62.554-28.03-62.554-62.554v-386.892c0-34.524 28.029-62.554 62.554-62.554h386.892zM446 265.638c0-22.964-18.616-41.58-41.58-41.58-11.211.0-21.361 4.457-28.841 11.666-28.424-20.508-67.586-33.757-111.204-35.278l18.941-89.121 61.884 13.157c.756 15.734 13.642 28.29 29.56 28.29 16.407.0 29.706-13.299 29.706-29.701.0-16.403-13.299-29.702-29.706-29.702-11.666.0-21.657 6.792-26.515 16.578l-69.105-14.69c-1.922-.418-3.939-.042-5.585 1.036-1.658 1.073-2.811 2.761-3.224 4.686l-21.152 99.438c-44.258 1.228-84.046 14.494-112.837 35.232-7.468-7.164-17.589-11.591-28.757-11.591-22.965.0-41.585 18.616-41.585 41.58.0 16.896 10.095 31.41 24.568 37.918-.639 4.135-.99 8.328-.99 12.576.0 63.977 74.469 115.836 166.33 115.836s166.334-51.859 166.334-115.836c0-4.218-.347-8.387-.977-12.493 14.564-6.47 24.735-21.034 24.735-38.001zm-119.474 108.193c-20.27 20.241-59.115 21.816-70.534 21.816-11.428.0-50.277-1.575-70.522-21.82-3.007-3.008-3.007-7.882.0-10.889 3.003-2.999 7.882-3.003 10.885.0 12.777 12.781 40.11 17.317 59.637 17.317 19.522.0 46.86-4.536 59.657-17.321 3.016-2.999 7.886-2.995 10.885.008 3.008 3.011 3.003 7.882-.008 10.889zm-5.23-48.781c-16.373.0-29.701-13.324-29.701-29.698.0-16.381 13.328-29.714 29.701-29.714 16.378.0 29.706 13.333 29.706 29.714.0 16.374-13.328 29.698-29.706 29.698zm-160.386-29.702c0-16.381 13.328-29.71 29.714-29.71 16.369.0 29.689 13.329 29.689 29.71.0 16.373-13.32 29.693-29.689 29.693-16.386.0-29.714-13.32-29.714-29.693z"/></svg></a><a target=_blank rel="noopener noreferrer" aria-label="share Papermod - Features on facebook" href="https://facebook.com/sharer/sharer.php?u=https%3a%2f%2fadityatelange.github.io%2fhugo-PaperMod%2fposts%2fpapermod%2fpapermod-features%2f"><svg viewBox="0 0 512 512"><path d="M449.446.0C483.971.0 512 28.03 512 62.554v386.892C512 483.97 483.97 512 449.446 512H342.978v-192.915h66.6l12.672-82.621h-79.272v-53.617c0-22.603 11.073-44.636 46.58-44.636H425.6v-70.34s-32.71-5.582-63.982-5.582c-65.288.0-107.96 39.569-107.96 111.204v62.971h-72.573v82.621h72.573V512h-191.104c-34.524.0-62.554-28.03-62.554-62.554v-386.892c0-34.524 28.029-62.554 62.554-62.554h386.892z"/></svg></a><a target=_blank rel="noopener noreferrer" aria-label="share Papermod - Features on whatsapp" href="https://api.whatsapp.com/send?text=Papermod%20-%20Features%20-%20https%3a%2f%2fadityatelange.github.io%2fhugo-PaperMod%2fposts%2fpapermod%2fpapermod-features%2f"><svg viewBox="0 0 512 512"><path d="M449.446.0C483.971.0 512 28.03 512 62.554v386.892C512 483.97 483.97 512 449.446 512h-386.892c-34.524.0-62.554-28.03-62.554-62.554v-386.892c0-34.524 28.029-62.554 62.554-62.554h386.892zm-58.673 127.703c-33.842-33.881-78.847-52.548-126.798-52.568-98.799.0-179.21 80.405-179.249 179.234-.013 31.593 8.241 62.428 23.927 89.612l-25.429 92.884 95.021-24.925c26.181 14.28 55.659 21.807 85.658 21.816h.074c98.789.0 179.206-80.413 179.247-179.243.018-47.895-18.61-92.93-52.451-126.81zM263.976 403.485h-.06c-26.734-.01-52.954-7.193-75.828-20.767l-5.441-3.229-56.386 14.792 15.05-54.977-3.542-5.637c-14.913-23.72-22.791-51.136-22.779-79.287.033-82.142 66.867-148.971 149.046-148.971 39.793.014 77.199 15.531 105.329 43.692 28.128 28.16 43.609 65.592 43.594 105.4-.034 82.149-66.866 148.983-148.983 148.984zm81.721-111.581c-4.479-2.242-26.499-13.075-30.604-14.571-4.105-1.495-7.091-2.241-10.077 2.241-2.986 4.483-11.569 14.572-14.182 17.562-2.612 2.988-5.225 3.364-9.703 1.12-4.479-2.241-18.91-6.97-36.017-22.23-13.314-11.876-22.304-26.542-24.916-31.026s-.279-6.908 1.963-9.14c2.016-2.007 4.48-5.232 6.719-7.847 2.24-2.615 2.986-4.484 4.479-7.472 1.493-2.99.747-5.604-.374-7.846-1.119-2.241-10.077-24.288-13.809-33.256-3.635-8.733-7.327-7.55-10.077-7.688-2.609-.13-5.598-.158-8.583-.158-2.986.0-7.839 1.121-11.944 5.604-4.105 4.484-15.675 15.32-15.675 37.364.0 22.046 16.048 43.342 18.287 46.332 2.24 2.99 31.582 48.227 76.511 67.627 10.685 4.615 19.028 7.371 25.533 9.434 10.728 3.41 20.492 2.929 28.209 1.775 8.605-1.285 26.499-10.833 30.231-21.295 3.732-10.464 3.732-19.431 2.612-21.298-1.119-1.869-4.105-2.99-8.583-5.232z"/></svg></a><a target=_blank rel="noopener noreferrer" aria-label="share Papermod - Features on telegram" href="https://telegram.me/share/url?text=Papermod%20-%20Features&url=https%3a%2f%2fadityatelange.github.io%2fhugo-PaperMod%2fposts%2fpapermod%2fpapermod-features%2f"><svg viewBox="2 2 28 28"><path d="M26.49 29.86H5.5a3.37 3.37.0 01-2.47-1 3.35 3.35.0 01-1-2.47V5.48A3.36 3.36.0 013 3 3.37 3.37.0 015.5 2h21A3.38 3.38.0 0129 3a3.36 3.36.0 011 2.46V26.37a3.35 3.35.0 01-1 2.47A3.38 3.38.0 0126.49 29.86zm-5.38-6.71a.79.79.0 00.85-.66L24.73 9.24a.55.55.0 00-.18-.46.62.62.0 00-.41-.17q-.08.0-16.53 6.11a.59.59.0 00-.41.59.57.57.0 00.43.52l4 1.24 1.61 4.83a.62.62.0 00.63.43.56.56.0 00.4-.17L16.54 20l4.09 3A.9.9.0 0021.11 23.15zM13.8 20.71l-1.21-4q8.72-5.55 8.78-5.55c.15.0.23.0.23.16a.18.18.0 010 .06s-2.51 2.3-7.52 6.8z"/></svg></a></div></footer></article></main><footer class=footer><span>© 2020 <a href=https://adityatelange.github.io/hugo-PaperMod/>PaperMod</a></span>
|
||
<span>·</span>
|
||
<span>Powered by <a href=https://gohugo.io/ rel="noopener noreferrer" target=_blank>Hugo</a></span>
|
||
<span>·</span>
|
||
<span>Theme <a href=https://git.io/hugopapermod rel=noopener target=_blank>PaperMod</a></span></footer><a href=#top><button class=top-link id=top-link type=button aria-label="go to top" title="Go to Top (Alt + G)" accesskey=g><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 6"><path d="M12 6H0l6-6z"/></svg></button></a>
|
||
<script defer src=https://adityatelange.github.io/hugo-PaperMod/assets/js/highlight.min.27cd435cc9ed6abb4b496581b151804f79f366c412620272bb94e2f5f598ebcc.js integrity="sha256-J81DXMntartLSWWBsVGAT3nzZsQSYgJyu5Ti9fWY68w=" onload=hljs.initHighlightingOnLoad();></script><script>window.onload=function(){if(localStorage.getItem("menu-scroll-position")){document.getElementById('menu').scrollLeft=localStorage.getItem("menu-scroll-position");}}
|
||
document.querySelectorAll('a[href^="#"]').forEach(anchor=>{anchor.addEventListener("click",function(e){e.preventDefault();var id=this.getAttribute("href").substr(1);document.querySelector(`[id='${decodeURIComponent(id)}']`).scrollIntoView({behavior:"smooth"});if(id==="top"){history.replaceState(null,null," ");}else{history.replaceState(null,null,`#${id}`);}});});var mybutton=document.getElementById("top-link");window.onscroll=function(){if(document.body.scrollTop>800||document.documentElement.scrollTop>800){mybutton.style.visibility="visible";mybutton.style.opacity="1";}else{mybutton.style.visibility="hidden";mybutton.style.opacity="0";}};function menu_on_scroll(){localStorage.setItem("menu-scroll-position",document.getElementById('menu').scrollLeft);}</script><script>document.getElementById("theme-toggle").addEventListener("click",()=>{if(document.body.className.includes("dark")){document.body.classList.remove('dark');localStorage.setItem("pref-theme",'light');}else{document.body.classList.add('dark');localStorage.setItem("pref-theme",'dark');}})</script></body></html> |