[{"content":" We\u0026rsquo;ll be using yml/yaml format for all examples down below, it is recommend to use yaml over toml as it is easier to read. You can find any YML to TOML converters if needed. Getting Started 🚀 Follow Hugo Docs\u0026rsquo;s - Quick Start guide to install . (Make sure you install Hugo \u0026gt;= v0.112.4)\nCreate a new site\nhugo new site MyFreshWebsite --format yaml # replace MyFreshWebsite with name of your website Note:\nOlder versions of Hugo may not support --format yaml Read more here about Hugo Docs\u0026rsquo;s - hugo new site command After you have created a new site, follow the below steps to add PaperMod\nInstalling/Updating PaperMod Themes reside in MyFreshWebsite/themes directory. PaperMod will be installed in MyFreshWebsite/themes/PaperMod Expand Method 1 - Git Clone INSTALL : Inside the folder of your Hugo site MyFreshWebsite, run:\ngit clone https://github.com/adityatelange/hugo-PaperMod themes/PaperMod --depth=1 You may use --branch v7.0 to end of above command if you want to stick to specific release.\nUPDATE: Inside the folder of your Hugo site MyFreshWebsite, run:\ncd themes/PaperMod git pull Expand Method 2 - Git Submodule (recomended) INSTALL : Inside the folder of your Hugo site MyFreshWebsite, run:\ngit submodule add --depth=1 https://github.com/adityatelange/hugo-PaperMod.git themes/PaperMod git submodule update --init --recursive # needed when you reclone your repo (submodules may not get cloned automatically) You may use --branch v7.0 to end of above command if you want to stick to specific release. Read more about git submodules here.\nUPDATE: Inside the folder of your Hugo site MyFreshWebsite, run:\ngit submodule update --remote --merge Expand Method 3 - Download an unzip Download PaperMod source as Zip from Github Releases and extract in your themes directory at MyFreshWebsite/themes/PaperMod\nDirect Links:\nMaster Branch (Latest) v7.0 v6.0 v5.0 v4.0 v3.0 v2.0 v1.0 Expand Method 4 - Hugo module INSTALL :\nInstall Go programming language in your operating system.\nIntialize your own hugo mod\nhugo mod init YOUR_OWN_GIT_REPOSITORY Add PaperMod in your config.yml file 1 2 3 module: imports: - path: github.com/adityatelange/hugo-PaperMod UPDATE:\nhugo mod get -u Read more : Hugo Docs\u0026rsquo;s - HUGO MODULES\nFinally set theme as PaperMod in your site config In config.yml add:\n1 theme: [\u0026#34;PaperMod\u0026#34;] Next up - Customizing PaperMod to suit your preferences. Your site will be blank after you set up for the very first time. You may go through this website\u0026rsquo;s source code - PaperMod\u0026rsquo;s exampleSite\u0026rsquo;s source Scroll below this page where you will find more specific details about each section. Kindly go through all of the pages below to know how to configure PaperMod. Support 🫶 Star 🌟 PaperMod\u0026rsquo;s Github repository. Help spread the word about PaperMod by sharing it on social media and recommending it to your friends. 🗣️ You can also sponsor 🏅 on Github Sponsors / Ko-Fi. Videos featuring PaperMod You can go through few videos which are available on YouTube for getting to know the creator\u0026rsquo;s thoughts as well as the setup process.\n▶️ https://youtube.com/playlist?list=PLeiDFxcsdhUrzkK5Jg9IZyiTsIMvXxKZP\nQuick Links Papermod - Features Papermod - FAQs Papermod - Variables Papermod - Icons ChangeLog Sample config.yml Example Site Structure is present here: exampleSite\nUse appropriately\nbaseURL: \u0026#34;https://examplesite.com/\u0026#34; title: ExampleSite paginate: 5 theme: PaperMod enableRobotsTXT: true buildDrafts: false buildFuture: false buildExpired: false googleAnalytics: UA-123-45 minify: disableXML: true minifyOutput: true params: env: production # to enable google analytics, opengraph, twitter-cards and schema. title: ExampleSite description: \u0026#34;ExampleSite description\u0026#34; keywords: [Blog, Portfolio, PaperMod] author: Me # author: [\u0026#34;Me\u0026#34;, \u0026#34;You\u0026#34;] # multiple authors images: [\u0026#34;\u0026lt;link or path of image for opengraph, twitter-cards\u0026gt;\u0026#34;] DateFormat: \u0026#34;January 2, 2006\u0026#34; defaultTheme: auto # dark, light disableThemeToggle: false ShowReadingTime: true ShowShareButtons: true ShowPostNavLinks: true ShowBreadCrumbs: true ShowCodeCopyButtons: false ShowWordCount: true ShowRssButtonInSectionTermList: true UseHugoToc: true disableSpecial1stPost: false disableScrollToTop: false comments: false hidemeta: false hideSummary: false showtoc: false tocopen: false assets: # disableHLJS: true # to disable highlight.js # disableFingerprinting: true favicon: \u0026#34;\u0026lt;link / abs url\u0026gt;\u0026#34; favicon16x16: \u0026#34;\u0026lt;link / abs url\u0026gt;\u0026#34; favicon32x32: \u0026#34;\u0026lt;link / abs url\u0026gt;\u0026#34; apple_touch_icon: \u0026#34;\u0026lt;link / abs url\u0026gt;\u0026#34; safari_pinned_tab: \u0026#34;\u0026lt;link / abs url\u0026gt;\u0026#34; label: text: \u0026#34;Home\u0026#34; icon: /apple-touch-icon.png iconHeight: 35 # profile-mode profileMode: enabled: false # needs to be explicitly set title: ExampleSite subtitle: \u0026#34;This is subtitle\u0026#34; imageUrl: \u0026#34;\u0026lt;img location\u0026gt;\u0026#34; imageWidth: 120 imageHeight: 120 imageTitle: my image buttons: - name: Posts url: posts - name: Tags url: tags # home-info mode homeInfoParams: Title: \u0026#34;Hi there \\U0001F44B\u0026#34; Content: Welcome to my blog socialIcons: - name: x url: \u0026#34;https://x.com/\u0026#34; - name: stackoverflow url: \u0026#34;https://stackoverflow.com\u0026#34; - name: github url: \u0026#34;https://github.com/\u0026#34; analytics: google: SiteVerificationTag: \u0026#34;XYZabc\u0026#34; bing: SiteVerificationTag: \u0026#34;XYZabc\u0026#34; yandex: SiteVerificationTag: \u0026#34;XYZabc\u0026#34; cover: hidden: true # hide everywhere but not in structured data hiddenInList: true # hide on list pages and home hiddenInSingle: true # hide on single page editPost: URL: \u0026#34;https://github.com/\u0026lt;path_to_repo\u0026gt;/content\u0026#34; Text: \u0026#34;Suggest Changes\u0026#34; # edit text appendFilePath: true # to append file path to Edit link # for search # https://fusejs.io/api/options.html fuseOpts: isCaseSensitive: false shouldSort: true location: 0 distance: 1000 threshold: 0.4 minMatchCharLength: 0 limit: 10 # refer: https://www.fusejs.io/api/methods.html#search keys: [\u0026#34;title\u0026#34;, \u0026#34;permalink\u0026#34;, \u0026#34;summary\u0026#34;, \u0026#34;content\u0026#34;] menu: main: - identifier: categories name: categories url: /categories/ weight: 10 - identifier: tags name: tags url: /tags/ weight: 20 - identifier: example name: example.org url: https://example.org weight: 30 # Read: https://github.com/adityatelange/hugo-PaperMod/wiki/FAQs#using-hugos-syntax-highlighter-chroma pygmentsUseClasses: true markup: highlight: noClasses: false # anchorLineNos: true # codeFences: true # guessSyntax: true # lineNos: true # style: monokai Sample Page.md --- title: \u0026#34;My 1st post\u0026#34; date: 2020-09-15T11:30:03+00:00 # weight: 1 # aliases: [\u0026#34;/first\u0026#34;] tags: [\u0026#34;first\u0026#34;] author: \u0026#34;Me\u0026#34; # author: [\u0026#34;Me\u0026#34;, \u0026#34;You\u0026#34;] # multiple authors showToc: true TocOpen: false draft: false hidemeta: false comments: false description: \u0026#34;Desc Text.\u0026#34; canonicalURL: \u0026#34;https://canonical.url/to/page\u0026#34; disableHLJS: true # to disable highlightjs disableShare: false disableHLJS: false hideSummary: false searchHidden: true ShowReadingTime: true ShowBreadCrumbs: true ShowPostNavLinks: true ShowWordCount: true ShowRssButtonInSectionTermList: true UseHugoToc: true cover: image: \u0026#34;\u0026lt;image path/url\u0026gt;\u0026#34; # image path/url alt: \u0026#34;\u0026lt;alt text\u0026gt;\u0026#34; # alt text caption: \u0026#34;\u0026lt;text\u0026gt;\u0026#34; # display caption under cover relative: false # when using page bundles set this to true hidden: true # only hide on current single page editPost: URL: \u0026#34;https://github.com/\u0026lt;path_to_repo\u0026gt;/content\u0026#34; Text: \u0026#34;Suggest Changes\u0026#34; # edit text appendFilePath: true # to append file path to Edit link --- You can use it by creating archetypes/post.md\nhugo new --kind post \u0026lt;name\u0026gt; ","permalink":"https://sucks.agakom.com/posts/papermod/papermod-installation/","summary":"Read aboout Install and Update instructions and sampled configuration templates","title":"Install / Update PaperMod"},{"content":"Intro We\u0026rsquo;ll be using yml/yaml format for all examples down below, I recommend using yml over toml as it is easier to read.\nYou can find any YML to TOML converters if necessary.\nAssets (js/css) The following is enabled by default\nminification - makes the assets size smallest as possible. bundling - bundles all the styles in one single asset fingerprint/intergity check. Default Theme light/dark/auto 1 2 3 4 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 :\n1 disableThemeToggle: true You can refer following table for better understanding\u0026hellip;\ndefaultTheme disableThemeToggle checks local storage? checks system theme? Info auto true No Yes only system theme false Yes (if not-\u0026gt;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. ├── config.yml ├── content/ │ ├── archives.md \u0026lt;--- Create archive.md here │ └── posts/ ├── static/ └── themes/ └── PaperMod/ and add the following to it\n--- title: \u0026#34;Archive\u0026#34; layout: \u0026#34;archives\u0026#34; url: \u0026#34;/archives/\u0026#34; summary: archives --- Note: Archives Layout does not support Multilingual Month Translations.\nex: archives.md\nRegular 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: \u0026#34;\u0026lt;platform\u0026gt;\u0026#34; url: \u0026#34;\u0026lt;link\u0026gt;\u0026#34; - name: \u0026#34;\u0026lt;platform 2\u0026gt;\u0026#34; url: \u0026#34;\u0026lt;link2\u0026gt;\u0026#34; Profile Mode Shows Index/Home page as Full Page with Social Links and Image\nadd following to config file\n1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 params: profileMode: enabled: true title: \u0026#34;\u0026lt;Title\u0026gt;\u0026#34; # optional default will be site title subtitle: \u0026#34;This is subtitle\u0026#34; imageUrl: \u0026#34;\u0026lt;image link\u0026gt;\u0026#34; # optional imageTitle: \u0026#34;\u0026lt;title of image as alt\u0026gt;\u0026#34; # optional imageWidth: 120 # custom size imageHeight: 120 # custom size buttons: - name: Archive url: \u0026#34;/archive\u0026#34; - name: Github url: \u0026#34;https://github.com/\u0026#34; socialIcons: # optional - name: \u0026#34;\u0026lt;platform\u0026gt;\u0026#34; url: \u0026#34;\u0026lt;link\u0026gt;\u0026#34; - name: \u0026#34;\u0026lt;platform 2\u0026gt;\u0026#34; url: \u0026#34;\u0026lt;link2\u0026gt;\u0026#34; Search Page PaperMod uses Fuse.js Basic for search functionality\nAdd the following to site config, config.yml\n1 2 3 4 5 outputs: home: - HTML - RSS - JSON # necessary for search Create a page with search.md in content directory with following content\n1 2 3 4 5 6 7 8 --- title: \u0026#34;Search\u0026#34; # in any language you want layout: \u0026#34;search\u0026#34; # necessary for search # url: \u0026#34;/archive\u0026#34; # description: \u0026#34;Description for Search\u0026#34; summary: \u0026#34;search\u0026#34; placeholder: \u0026#34;placeholder text in search input box\u0026#34; --- To hide a particular page from being searched, add it in post\u0026rsquo;s frontmatter\n1 searchHidden: true ex: search.md\nSearch Page also has Key bindings:\nArrow keys to move up/down the list Enter key (return) or Right Arrow key to go to the highlighted page Escape key to clear searchbox and results For Multilingual use search.\u0026lt;lang\u0026gt;.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.\n1 2 3 4 5 6 7 8 9 10 params: fuseOpts: isCaseSensitive: false shouldSort: true location: 0 distance: 1000 threshold: 0.4 minMatchCharLength: 0 # limit: 10 # refer: https://www.fusejs.io/api/methods.html#search keys: [\u0026#34;title\u0026#34;, \u0026#34;permalink\u0026#34;, \u0026#34;summary\u0026#34;, \u0026#34;content\u0026#34;] Draft Page indication adds [draft] mark to indicate draft pages.\nPost Cover Image In post\u0026rsquo;s page-variables add :\n1 2 3 4 5 6 7 cover: image: \u0026#34;\u0026lt;image path/url\u0026gt;\u0026#34; # can also paste direct link from external site # ex. https://i.ibb.co/K0HVPBd/paper-mod-profilemode.png alt: \u0026#34;\u0026lt;alt text\u0026gt;\u0026#34; caption: \u0026#34;\u0026lt;text\u0026gt;\u0026#34; 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.\nTo reduce generation time and size of the site, you can disable this feature using\n1 2 3 params: cover: responsiveImages: false To enable hyperlinks to the full image size on post pages, use\n1 2 3 params: 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 BreadCrumb Navigation Adds BreadCrumb Navigation above Post\u0026rsquo;s Title to show subsections and Navigation to Home\nparams: ShowBreadCrumbs: true Can be diabled for particular page\u0026rsquo;s front-matter\n--- 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.\nFor site config use:\nParams: editPost: URL: \u0026#34;https://github.com/\u0026lt;path_to_repo\u0026gt;/content\u0026#34; Text: \u0026#34;Suggest Changes\u0026#34; # edit text appendFilePath: true # to append file path to Edit link Can be modified for individual pages\n--- editPost: URL: \u0026#34;https://github.com/\u0026lt;path_to_repo\u0026gt;/content\u0026#34; Text: \u0026#34;Suggest Changes\u0026#34; # edit text appendFilePath: true # to append file path to Edit link --- The example above would yield the following link for the post file posts/post-name.md: https://github.com/\u0026lt;path_to_repo\u0026gt;/content/posts/post-name.md\nParameter Required Default Value editPost.URL true - editPost.appendFilePath false false editPost.Text false Edit Since the link generated is a regular HTML anchor tag \u0026lt;a href=...\u0026gt;, you can also use other URL schemas like mailto://, e.g. URL: \u0026quot;mailto://mail@example.com?subject=Suggesting changes for \u0026quot;\nOther Posts suggestion below a post Adds a Previous / Next post suggestion under a single post\nparams: ShowPostNavLinks: true Code Copy Button Adds a copy button in code block to copy the code it contains\nparams: ShowCodeCopyButtons: true Multiple Authors To Use multiple authors for a post, in post-variables:\n--- author: [\u0026#34;Me\u0026#34;, \u0026#34;You\u0026#34;] --- To use Multiple Authors Site-wide, in config.yml:\nparams: author: [\u0026#34;Me\u0026#34;, \u0026#34;You\u0026#34;] 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 hugo-comments\nAccessKeys c - ToC Open/Close g - Go To Top h - Home (according to current lang) t - Theme toggle / - Jumps to search page if in menu What\u0026rsquo;s AccessKeys ?\nEnhanced SEO Enabled only when env: production\nRich Results/Snippets Support Twitter Cards Support The Twitter Cards metadata, except x: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 x: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, x: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 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: - image_01.png - image_02.png 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: - 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 ","permalink":"https://sucks.agakom.com/posts/papermod/papermod-features/","summary":"Learn About All Features in PaperMod","title":"Features / Mods"},{"content":"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.\nHeadings The following HTML \u0026lt;h1\u0026gt;—\u0026lt;h6\u0026gt; elements represent six levels of section headings. \u0026lt;h1\u0026gt; is the highest section level while \u0026lt;h6\u0026gt; is the lowest.\nH1 H2 H3 H4 H5 H6 Paragraph Xerum, quo qui aut unt expliquam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus eiur? Quianimin porecus evelectur, cum que nis nust voloribus ratem aut omnimi, sitatur? Quiatem. Nam, omnis sum am facea corem alique molestrunt et eos evelece arcillit ut aut eos eos nus, sin conecerem erum fuga. Ri oditatquam, ad quibus unda veliamenimin cusam et facea ipsamus es exerum sitate dolores editium rerore eost, temped molorro ratiae volorro te reribus dolorer sperchicium faceata tiustia prat.\nItatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sapicia is sinveli squiatum, core et que aut hariosam ex eat.\nBlockquotes The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a footer or cite element, and optionally with in-line changes such as annotations and abbreviations.\nBlockquote without attribution Tiam, ad mint andaepu dandae nostion secatur sequo quae. Note that you can use Markdown syntax within a blockquote.\nBlockquote with attribution Don\u0026rsquo;t communicate by sharing memory, share memory by communicating.\n— Rob Pike1\nTables Tables aren\u0026rsquo;t part of the core Markdown spec, but Hugo supports them out-of-the-box.\nName Age Bob 27 Alice 23 Inline Markdown within tables Italics Bold Code italics bold code List Types Ordered List First item Second item Third item Unordered List List item Another item And another item Nested Unordered list Fruit Apple Orange Banana Dairy Milk Cheese Nested Ordered list Fruit Apple Orange Banana Dairy Milk Cheese Third item Sub One Sub Two Other Elements — abbr, sub, sup, kbd, mark GIF is a bitmap image format.\nH2O\nXn + Yn = Zn\nPress CTRL+ALT+Delete to end the session.\nMost salamanders are nocturnal, and hunt for insects, worms, and other small creatures.\nThe above quote is excerpted from Rob Pike\u0026rsquo;s talk during Gopherfest, November 18, 2015.\u0026#160;\u0026#x21a9;\u0026#xfe0e;\n","permalink":"https://sucks.agakom.com/posts/markdown-syntax/","summary":"\u003cp\u003eThis 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.\u003c/p\u003e","title":"Markdown Syntax Guide"},{"content":"Inline Code This is Inline Code\nOnly pre This is pre text Code block with backticks \u0026lt;!DOCTYPE html\u0026gt; \u0026lt;html lang=\u0026#34;en\u0026#34;\u0026gt; \u0026lt;head\u0026gt; \u0026lt;meta charset=\u0026#34;utf-8\u0026#34; /\u0026gt; \u0026lt;title\u0026gt;Example HTML5 Document\u0026lt;/title\u0026gt; \u0026lt;meta name=\u0026#34;description\u0026#34; content=\u0026#34;Sample article showcasing basic Markdown syntax and formatting for HTML elements.\u0026#34; /\u0026gt; \u0026lt;/head\u0026gt; \u0026lt;body\u0026gt; \u0026lt;p\u0026gt;Test\u0026lt;/p\u0026gt; \u0026lt;/body\u0026gt; \u0026lt;/html\u0026gt; Code block with backticks and language specified \u0026lt;!DOCTYPE html\u0026gt; \u0026lt;html lang=\u0026#34;en\u0026#34;\u0026gt; \u0026lt;head\u0026gt; \u0026lt;meta charset=\u0026#34;utf-8\u0026#34; /\u0026gt; \u0026lt;title\u0026gt;Example HTML5 Document\u0026lt;/title\u0026gt; \u0026lt;meta name=\u0026#34;description\u0026#34; content=\u0026#34;Sample article showcasing basic Markdown syntax and formatting for HTML elements.\u0026#34; /\u0026gt; \u0026lt;/head\u0026gt; \u0026lt;body\u0026gt; \u0026lt;p\u0026gt;Test\u0026lt;/p\u0026gt; \u0026lt;/body\u0026gt; \u0026lt;/html\u0026gt; Code block with backticks and language specified with line numbers 1 2 3 4 5 6 7 8 9 10 11 12 13 14 \u0026lt;!DOCTYPE html\u0026gt; \u0026lt;html lang=\u0026#34;en\u0026#34;\u0026gt; \u0026lt;head\u0026gt; \u0026lt;meta charset=\u0026#34;utf-8\u0026#34; /\u0026gt; \u0026lt;title\u0026gt;Example HTML5 Document\u0026lt;/title\u0026gt; \u0026lt;meta name=\u0026#34;description\u0026#34; content=\u0026#34;Sample article showcasing basic Markdown syntax and formatting for HTML elements.\u0026#34; /\u0026gt; \u0026lt;/head\u0026gt; \u0026lt;body\u0026gt; \u0026lt;p\u0026gt;Test\u0026lt;/p\u0026gt; \u0026lt;/body\u0026gt; \u0026lt;/html\u0026gt; Code block with line numbers and highlighted lines PaperMod supports linenos=true or linenos=table 1 2 3 4 5 6 7 8 9 10 11 12 13 14 \u0026lt;!DOCTYPE html\u0026gt; \u0026lt;html lang=\u0026#34;en\u0026#34;\u0026gt; \u0026lt;head\u0026gt; \u0026lt;meta charset=\u0026#34;utf-8\u0026#34; /\u0026gt; \u0026lt;title\u0026gt;Example HTML5 Document\u0026lt;/title\u0026gt; \u0026lt;meta name=\u0026#34;description\u0026#34; content=\u0026#34;Sample article showcasing basic Markdown syntax and formatting for HTML elements.\u0026#34; /\u0026gt; \u0026lt;/head\u0026gt; \u0026lt;body\u0026gt; \u0026lt;p\u0026gt;Test\u0026lt;/p\u0026gt; \u0026lt;/body\u0026gt; \u0026lt;/html\u0026gt; With linenos=inline line might not get highlighted properly. This issue is fixed with 045c084 1\u0026lt;!DOCTYPE html\u0026gt; 2\u0026lt;html lang=\u0026#34;en\u0026#34;\u0026gt; 3 \u0026lt;head\u0026gt; 4 \u0026lt;meta charset=\u0026#34;utf-8\u0026#34; /\u0026gt; 5 \u0026lt;title\u0026gt;Example HTML5 Document\u0026lt;/title\u0026gt; 6 \u0026lt;meta 7 name=\u0026#34;description\u0026#34; 8 content=\u0026#34;Sample article showcasing basic Markdown syntax and formatting for HTML elements.\u0026#34; 9 /\u0026gt; 10 \u0026lt;/head\u0026gt; 11 \u0026lt;body\u0026gt; 12 \u0026lt;p\u0026gt;Test\u0026lt;/p\u0026gt; 13 \u0026lt;/body\u0026gt; 14\u0026lt;/html\u0026gt; Code block indented with four spaces \u0026lt;!doctype html\u0026gt; \u0026lt;html lang=\u0026quot;en\u0026quot;\u0026gt; \u0026lt;head\u0026gt; \u0026lt;meta charset=\u0026quot;utf-8\u0026quot;\u0026gt; \u0026lt;title\u0026gt;Example HTML5 Document\u0026lt;/title\u0026gt; \u0026lt;/head\u0026gt; \u0026lt;body\u0026gt; \u0026lt;p\u0026gt;Test\u0026lt;/p\u0026gt; \u0026lt;/body\u0026gt; \u0026lt;/html\u0026gt; Code block with Hugo\u0026rsquo;s internal highlight shortcode \u0026lt;!doctype html\u0026gt; \u0026lt;html lang=\u0026#34;en\u0026#34;\u0026gt; \u0026lt;head\u0026gt; \u0026lt;meta charset=\u0026#34;utf-8\u0026#34;\u0026gt; \u0026lt;title\u0026gt;Example HTML5 Document\u0026lt;/title\u0026gt; \u0026lt;/head\u0026gt; \u0026lt;body\u0026gt; \u0026lt;p\u0026gt;Test\u0026lt;/p\u0026gt; \u0026lt;/body\u0026gt; \u0026lt;/html\u0026gt; ","permalink":"https://sucks.agakom.com/posts/code_syntax/","summary":"Sample article showcasing basic code syntax and formatting for HTML elements.","title":"Code Syntax Guide"},{"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.\nFigure Shortcode (PaperMod enhanced) Photo by Aditya Telange on Unsplash\nYouTube Twitter Shortcode PaperMod is now the most starred @GoHugoIO theme on #GitHub ! ✨\nHere\u0026#39;s what it offers:\n- Simple, minimal \u0026amp; clean design\n- Light/Dark mode\n- Fuzzy search for content\n- Good page-speed insights\nand much more...\nHuge thanks to all supporters🙏https://t.co/YAEd2cfrrn\n\u0026mdash; Aditya (@adityatelange) November 14, 2023 Vimeo Shortcode ","permalink":"https://sucks.agakom.com/posts/rich-content/","summary":"\u003cp\u003eHugo ships with several \u003ca href=\"https://gohugo.io/content-management/shortcodes/#use-hugos-built-in-shortcodes\"\u003eBuilt-in Shortcodes\u003c/a\u003e for rich content, along with a \u003ca href=\"https://gohugo.io/about/hugo-and-gdpr/\"\u003ePrivacy Config\u003c/a\u003e and a set of Simple Shortcodes that enable static and no-JS versions of various social media embeds.\u003c/p\u003e","title":"Rich Content and Shortcodes"},{"content":"Mathematical notation in a Hugo project can be enabled by using third party JavaScript libraries.\nIn this example we will be using KaTeX\nCreate a partial under /layouts/partials/math.html Within this partial reference the Auto-render Extension or host these scripts locally. Include the partial in your templates (extend_head.html) like so: refer ISSUE #236 {{ if or .Params.math .Site.Params.math }} {{ partial \u0026#34;math.html\u0026#34; . }} {{ end }} To enable KaTex globally set the parameter math to true in a project\u0026rsquo;s configuration To enable KaTex on a per page basis include the parameter math: true in content files Note: Use the online reference of Supported TeX Functions\nExamples Block math:\n$$ \\varphi = 1+\\frac{1} {1+\\frac{1} {1+\\frac{1} {1+\\cdots} } } $$\n","permalink":"https://sucks.agakom.com/posts/math-typesetting/","summary":"\u003cp\u003eMathematical notation in a Hugo project can be enabled by using third party JavaScript libraries.\u003c/p\u003e","title":"Math Typesetting"},{"content":"Emoji can be enabled in a Hugo project in a number of ways.\nThe emojify function can be called directly in templates or Inline Shortcodes.\nTo enable emoji globally, set enableEmoji to true in your site\u0026rsquo;s configuration and then you can type emoji shorthand codes directly in content files; e.g.\n🙈 :see_no_evil: 🙉 :hear_no_evil: 🙊 :speak_no_evil:\nThe Emoji cheat sheet is a useful reference for emoji shorthand codes.\nN.B. The above steps enable Unicode Standard emoji characters and sequences in Hugo, however the rendering of these glyphs depends on the browser and the platform. To style the emoji you can either use a third party emoji font or a font stack; e.g.\n.emoji { font-family: Apple Color Emoji, Segoe UI Emoji, NotoColorEmoji, Segoe UI Symbol, Android Emoji, EmojiSymbols; }","permalink":"https://sucks.agakom.com/posts/emoji-support/","summary":"\u003cp\u003eEmoji can be enabled in a Hugo project in a number of ways.\u003c/p\u003e","title":"Emoji Support"}]