<!doctype html><htmllang=endir=auto><head><metacharset=utf-8><metahttp-equiv=x-ua-compatiblecontent="IE=edge"><metaname=viewportcontent="width=device-width,initial-scale=1,shrink-to-fit=no"><title>Papermod - How To's Guide - PaperMod</title><metaname=keywordscontent="PaperMod"><metaname=descriptioncontent="FAQs"><metaname=authorcontent="Aditya Telange"><linkrel=canonicalhref=https://adityatelange.github.io/hugo-PaperMod/posts/papermod/papermod-how-to/><linkhref=https://adityatelange.github.io/hugo-PaperMod/assets/css/stylesheet.min.5d44456813d58b9cb020e3474e4c5d14b03070ef2a1e81ef3a4de94a1bc6696b.cssintegrity="sha256-XURFaBPVi5ywIONHTkxdFLAwcO8qHoHvOk3pShvGaWs="rel="preload stylesheet"as=style><linkrel=apple-touch-iconhref=https://adityatelange.github.io/hugo-PaperMod/apple-touch-icon.png><linkrel=iconhref=https://adityatelange.github.io/hugo-PaperMod/favicon.ico><metaname=generatorcontent="Hugo 0.77.0"><metaproperty="og:title"content="Papermod - How To's Guide"><metaproperty="og:description"content="FAQs"><metaproperty="og:type"content="article"><metaproperty="og:url"content="https://adityatelange.github.io/hugo-PaperMod/posts/papermod/papermod-how-to/"><metaproperty="article:published_time"content="2020-09-18T11:30:03+05:30"><metaproperty="article:modified_time"content="2020-09-18T11:30:03+05:30"><metaname=twitter:cardcontent="summary"><metaname=twitter:titlecontent="Papermod - How To's Guide"><metaname=twitter:descriptioncontent="FAQs"><scripttype=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","headline":"Papermod - How To's Guide","name":"Papermod - How To\u0027s Guide","description":"FAQs","keywords":["PaperMod"],"articleBody":"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.\n 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.\nLet’s say you wish the list was different. All you have to do is copy the list template:\nyour-site/themes/papermod/layouts/_defaults/list.html And paste it under your own layouts folder:\nyour-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.\n Enable Social-Metadata and SEO These include OpenGraph, Twitter Cards and Schema.\nparams: env: production or set HUGO_ENV as “production” in system env-vars\n Archive Page . ├── config.yml ├── content/ │ ├── archives.md and add the following to it\n--- title: \"Archive\" layout: \"archives\" url: \"/archives/\" summary: archives --- References Override a Hugo theme ","wordCount":"170","inLanguage":"en","datePublished":"2020-09-18T11:30:03+05:30","dateModified":"2020-09-18T11:30:03+05:30","author":{"@type":"Person","name":"Aditya Telange"},"mainEntityOfPage":{"@type":"WebPage","@id":"https://adityatelange.github.io/hugo-PaperMod/posts/papermod/papermod-how-to/"},"publisher":{"@type":"Organization","name":"PaperMod","logo":{"@type":"ImageObject","url":"https://adityatelange.github.io/hugo-PaperMod/favicon.ico"}}}</script></head><bodyclass=singleid=top><script>if(localStorage.getItem("pref-theme")==="dark"){document.body.classList.add('dark');}elseif(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><styletype=text/css>.theme-toggle,.top-link{display:none}</style></noscript><headerclass=header><navclass=nav><divclass=logo><ahref=https://adityatelange.github.io/hugo-PaperMod/accesskey=h>PaperMod</a>
<spanclass=logo-switches><spanclass=theme-toggle><aid=theme-toggleaccesskey=t><svgid="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"><pathd="M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z"/></svg><svgid="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"><circlecx="12"cy="12"r="5"/><linex1="12"y1="1"x2="12"y2="3"/><linex1="12"y1="21"x2="12"y2="23"/><linex1="4.22"y1="4.22"x2="5.64"y2="5.64"/><linex1="18.36"y1="18.36"x2="19.78"y2="19.78"/><linex1="1"y1="12"x2="3"y2="12"/><linex1="21"y1="12"x2="23"y2="12"/><linex1="4.22"y1="19.78"x2="5.64"y2="18.36"/><linex1="18.36"y1="5.64"x2="19.78"y2="4.22"/></svg></a></span><spanclass=lang-switch><span>|</span><ul><li><ahref=https://adityatelange.github.io/hugo-PaperMod/l2/title=Lang2aria-label=Lang2>Lang2</a></li><li><ahref=https://adityatelange.github.io/hugo-PaperMod/l3/title=Langrtlaria-label=Langrtl>Langrtl</a></li></ul></span></span></div><ulclass=menuid=menuonscroll=menu_on_scroll()><li><ahref=https://adityatelange.github.io/hugo-PaperMod/archives/><span>Archives</span></a></li><li><ahref=https://adityatelange.github.io/hugo-PaperMod/tags/><span>Tags</span></a></li></ul></nav></header><mainclass=main><articleclass=post-single><headerclass=post-header><h1class=post-title>Papermod - How To's Guide<divclass=entry-isdraft><sup> [draft]</sup></div></h1><divclass=post-meta>September 18, 2020 · 1 min · Aditya Telange</div></header><divclass=toc><detailsopen><summary><divclass=detailsaccesskey=c>Table of Contents</div></summary><blockquote><ul><li><ahref=#intro>Intro</a></li><li><ahref=#override-theme-template>Override theme template</a></li><li><ahref=#enable-social-metadata-and-seo>Enable Social-Metadata and SEO</a></li><li><ahref=#archive-page>Archive Page</a></li><li><ahref=#references>References</a></li></ul></blockquote></details></div><divclass=post-content><h2id=intro>Intro</h2><p>We’ll be using <code>yml/yaml</code> format for all examples down below, I recommend using <code>yml</code> over <code>toml</code> as it is easier to read.</p><hr><h2id=override-theme-template>Override theme template</h2><p>By Hugo’s Lookup Order, you can override any part of a theme that you want. The following is a quick example.</p><p>Let’s say you wish the <code>list</code> was different. All you have to do is copy the <code>list</code> template:</p><divclass=highlight><prestyle=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><codeclass=language-shelldata-lang=shell>your-site/themes/papermod/layouts/_defaults/list.html
</code></pre></div><p>And paste it under your own <code>layouts</code> folder:</p><divclass=highlight><prestyle=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><codeclass=language-shelldata-lang=shell>your-site/layouts/_defaults/list.html
</code></pre></div><p>Then you’re free to make any changes you want to the <code>list</code>.
When Hugo builds your site, your copy of <code>list.html</code> will be used instead of the theme’s <code>list.html</code>.</p><hr><h2id=enable-social-metadata-and-seo>Enable Social-Metadata and SEO</h2><p>These include OpenGraph, Twitter Cards and Schema.</p><divclass=highlight><prestyle=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><codeclass=language-ymldata-lang=yml><spanstyle=color:#f92672>params</span>:
</code></pre></div><p>or set <code>HUGO_ENV</code> as “production” in system env-vars</p><hr><h2id=archive-page>Archive Page</h2><divclass=highlight><prestyle=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><codeclass=language-shelldata-lang=shell>.
├── config.yml
├── content/
│ ├── archives.md <--- Create archive.md here
│ └── posts/
├── static/
└── themes/
└── hugo-PaperMod/
</code></pre></div><p>and add the following to it</p><divclass=highlight><prestyle=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><codeclass=language-ymldata-lang=yml>---
<span>Theme <ahref=https://git.io/hugopapermodrel=noopenertarget=_blank>PaperMod</a></span></footer><ahref=#toparia-label="go to top"title="Go to Top"accesskey=g><buttonclass=top-linkid=top-linktype=button><svgxmlns="http://www.w3.org/2000/svg"viewBox="0 0 12 6"><pathd="M12 6H0l6-6z"/></svg></button></a>
