hugo-theme-more-contentful/recipes/index.html

387 lines
13 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en-us">
<head><title>Recipes | More Contentful</title>
<link rel="stylesheet" href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/css/main.min.53a06f6951ce4ff305c20e7c07c32335e9494f58b5035ef6869e0f557248247c.css" />
<link rel="shortcut icon" href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/favicon.png" /><meta name="generator" content="Hugo 0.96.0" />
<meta charset="utf-8">
<meta name="author" content="John Doe" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="referrer" content="no-referrer" />
<meta name="description" content="Extending a Hugo theme is nothing new and a few places provide a place for the most common extensions. In this section, Ill be listing a few personal recipes Ive always used for extending a Hugo theme. Though this only applies specifically to Contentful and may need some tweaking when applying it other themes.
" /><meta name="twitter:card" content="summary"/>
<meta name="twitter:title" content="Recipes"/>
<meta name="twitter:description" content=""/>
<meta property="og:title" content="Recipes" />
<meta property="og:description" content="" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://foo-dogsquared.github.io/hugo-theme-more-contentful/recipes/" />
<meta itemprop="name" content="Recipes">
<meta itemprop="description" content=""><link rel="canonical" type="text/html" href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/recipes/" /><link rel="alternate" type="application/feed+json" href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/recipes/feed.json" /><link rel="alternate" type="application/rss+xml" href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/recipes/feed.rss" /><link rel="alternate" type="application/atom+xml" href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/recipes/feed.atom" />
<script>
let theme = window.localStorage.getItem('theme');
if (theme) {
document.documentElement.dataset.theme = theme;
}
</script>
</head>
<body><div aria-label="Site header">
<nav>
<a class="site__title" href="https://foo-dogsquared.github.io/hugo-theme-more-contentful">More Contentful</a>
<div class="list site__links">
<a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/about/">About</a>
<a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/categories/">Categories</a>
<a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/recipes/">Recipes</a>
<a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/tags/">Tags</a>
</div>
</nav>
<div class="site__theme-btn" aria-label="Theme toggle" aria-hidden="true">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/swatch.svg#swatch"></use>
</svg>
<div class="site__theme-dropdown">
<div class="site__theme-dropdown-list">
<div class="site__theme-item"
data-theme="Default Dark"
data-theme-dark
>Dark</div>
<div class="site__theme-item"
data-theme="Default Light"
data-theme-light
>Light</div>
<div class="site__theme-item"
data-theme="Dracula"
>Dracula</div>
<div class="site__theme-item"
data-theme="Gruvbox dark, hard"
>Gruvbox dark, hard</div>
<div class="site__theme-item"
data-theme="Gruvbox light, hard"
>Gruvbox light, hard</div>
<div class="site__theme-item"
data-theme="Nord"
>Nord</div>
<div class="site__theme-item"
data-theme="Solarized Dark"
>Solarized Dark</div>
<div class="site__theme-item"
data-theme="Solarized Light"
>Solarized Light</div>
<div class="site__theme-item" data-theme-system>
OS default
</div>
</div>
</div>
</div>
<script>
function styleTheme() {
const selectedTheme = window.localStorage.getItem("theme");
for (const el of document.querySelectorAll(".site__theme-item")) {
if (el.dataset.theme == selectedTheme) {
el.classList.add("site__theme-item--selected");
} else {
el.classList.remove("site__theme-item--selected");
}
}
}
const themeDropdown = document.querySelector('.site__theme-btn');
themeDropdown.addEventListener('click', (event) => {
const { target } = event;
if (target.classList.contains("site__theme-item")) {
if (target.dataset.theme) {
theme = target.dataset.theme;
window.localStorage.setItem("theme", theme);
document.documentElement.dataset.theme = theme;
} else {
window.localStorage.removeItem("theme");
delete document.documentElement.dataset.theme;
}
}
styleTheme();
});
styleTheme();
</script>
</div>
<hr aria-hidden="true"/>
<article>
<main><div class="paragraph">
<p>Extending a Hugo theme is nothing new and a <a href="https://gohugo.io/content-management/sections/">few</a> <a href="http://hugocodex.org/add-ons/">places</a> provide a place for the most common extensions.
In this section, Ill be listing a few personal recipes Ive always used for extending a Hugo theme.
Though this only applies specifically to Contentful and may need some tweaking when applying it other themes.</p>
</div>
</main>
<article class="post">
<h1><a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/recipes/configurable-list-of-contacts/" aria-label="Configurable list of contacts">Configurable list of contacts</a></h1>
<div class="list post__meta" aria-hidden="true"><time datetime="2020-10-20 20:38:24 &#43;0800 &#43;0800" title="Created">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/calendar.svg#calendar"></use>
</svg>
<span style="margin-left: 0.5em;">2020-10-20</span>
</time>
<time datetime="2023-02-24 20:23:27 &#43;0800 &#43;0800" title="Updated">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/arrow-path.svg#arrow-path"></use>
</svg>
<span style="margin-left: 0.5em;">2023-02-24</span>
</time>
</div>
</article>
<article class="post">
<h1><a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/recipes/creating-an-archive-page/" aria-label="Creating an archive page">Creating an archive page</a></h1>
<div class="list post__meta" aria-hidden="true"><time datetime="2020-10-20 20:36:55 &#43;0800 &#43;0800" title="Created">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/calendar.svg#calendar"></use>
</svg>
<span style="margin-left: 0.5em;">2020-10-20</span>
</time>
<time datetime="2023-02-24 20:23:27 &#43;0800 &#43;0800" title="Updated">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/arrow-path.svg#arrow-path"></use>
</svg>
<span style="margin-left: 0.5em;">2023-02-24</span>
</time>
</div>
</article>
<article class="post">
<h1><a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/recipes/open-graph-protocol/" aria-label="Open graph protocol">Open graph protocol</a></h1>
<div class="list post__meta" aria-hidden="true"><time datetime="2020-10-20 20:35:39 &#43;0800 &#43;0800" title="Created">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/calendar.svg#calendar"></use>
</svg>
<span style="margin-left: 0.5em;">2020-10-20</span>
</time>
<time datetime="2023-02-24 20:23:27 &#43;0800 &#43;0800" title="Updated">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/arrow-path.svg#arrow-path"></use>
</svg>
<span style="margin-left: 0.5em;">2023-02-24</span>
</time>
</div>
</article>
<article class="post">
<h1><a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/recipes/twitter-cards/" aria-label="Twitter cards">Twitter cards</a></h1>
<div class="list post__meta" aria-hidden="true"><time datetime="2020-10-20 20:31:32 &#43;0800 &#43;0800" title="Created">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/calendar.svg#calendar"></use>
</svg>
<span style="margin-left: 0.5em;">2020-10-20</span>
</time>
<time datetime="2023-02-24 20:23:27 &#43;0800 &#43;0800" title="Updated">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/arrow-path.svg#arrow-path"></use>
</svg>
<span style="margin-left: 0.5em;">2023-02-24</span>
</time>
</div>
</article>
<article class="post">
<h1><a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/recipes/customizing-your-head/" aria-label="Customizing your head">Customizing your head</a></h1>
<div class="list post__meta" aria-hidden="true"><time datetime="2020-10-20 20:29:42 &#43;0800 &#43;0800" title="Created">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/calendar.svg#calendar"></use>
</svg>
<span style="margin-left: 0.5em;">2020-10-20</span>
</time>
<time datetime="2023-02-24 20:23:27 &#43;0800 &#43;0800" title="Updated">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/arrow-path.svg#arrow-path"></use>
</svg>
<span style="margin-left: 0.5em;">2023-02-24</span>
</time>
</div>
</article>
</article>
<hr aria-hidden="true"/><footer aria-label="Site footer">
<a href="#top">Back to top</a>
<p>Available in other languages:
<span class="list site__languages">
<a href="/hugo-theme-more-contentful/en" hreflang="en">English</a>
<a href="/hugo-theme-more-contentful/tl" hreflang="tl">Tagalog</a>
</span>
</p>
<ul class="list site__socials">
<li>
<a class="site__social-icon" rel="me" href="https://example.org/gmail" aria-label="E-mail">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/gmail.svg#gmail"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/keybase" aria-label="Keybase">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/keybase.svg#keybase"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/devdotto" aria-label="Dev.to">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/devdotto.svg#devdotto"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/github/" aria-label="GitHub">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/github.svg#github"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/gitlab" aria-label="GitLab">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/gitlab.svg#gitlab"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/lichess" aria-label="Lichess">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/lichess.svg#lichess"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/picartodottv" aria-label="Picarto.tv">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/picartodottv.svg#picartodottv"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/pixiv" aria-label="Pixiv">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/pixiv.svg#pixiv"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/twitch" aria-label="Twitch">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/twitch.svg#twitch"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/twitter" aria-label="Twitter">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/twitter.svg#twitter"></use>
</svg>
</a>
</li><li>
<a class="site__social-icon" rel="me" href="https://example.org/youtube" aria-label="YouTube">
<svg class="icon">
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/youtube.svg#youtube"></use>
</svg>
</a>
</li></ul>
<p>© 2023 More Contentful</p>
</footer>
</body>
</html>