diff options
Diffstat (limited to 'exampleSite/docs/blog/configuration/index.html')
| -rw-r--r-- | exampleSite/docs/blog/configuration/index.html | 424 |
1 files changed, 424 insertions, 0 deletions
diff --git a/exampleSite/docs/blog/configuration/index.html b/exampleSite/docs/blog/configuration/index.html new file mode 100644 index 0000000..08956fe --- /dev/null +++ b/exampleSite/docs/blog/configuration/index.html @@ -0,0 +1,424 @@ +<!DOCTYPE html> +<html lang="en-us"> + <head> + + <meta charset="utf-8"> +<meta http-equiv="X-UA-Compatible" content="chrome=1"> +<meta name="HandheldFriendly" content="True"> +<meta name="MobileOptimized" content="320"> +<meta name="viewport" content="width=device-width, initial-scale=1.0"> +<meta name="referrer" content="no-referrer"> +<meta name="description" content="Website Description"> +<title> +Theme Features - Introduction +</title> + + + + <meta property="og:title" content="Theme Features - Introduction" /> +<meta property="og:type" content="website" /> +<meta property="og:description" content="Website Description"/> +<meta property="og:url" content="http://example.com/blog/configuration/"/> +<meta property="og:site_name" content="Introduction"/> + + + + +<meta property="og:image" content="http://example.com/home/profile.jpg"/> + + + + + +<link rel="shortcut icon" href="/img/fav.ico"> + + + + + + + + +<link rel="stylesheet" href="/css/main.min.daa833377fb1636f8cbfa65c601050bb5475623deb7aa6e6fdde94a064a6185d.css" integrity="sha256-2qgzN3+xY2+Mv6ZcYBBQu1R1Yj3reqbm/d6UoGSmGF0=" crossorigin="anonymous" media="screen"> + + + + + + + + + + </head> + <body> + <section id="top" class="section"> + + <div class="container hero fade-in one "> + + +<h1 class="bold-title is-1">Blog</h1> + + + </div> + + <div class="section fade-in two "> + +<div class="container"> + <hr> + <nav class="navbar" role="navigation" aria-label="main navigation"> + + <a role="button" class="navbar-burger" data-target="navMenu" aria-label="menu" aria-expanded="false" > + <span aria-hidden="true"></span> + <span aria-hidden="true"></span> + <span aria-hidden="true"></span> + </a> + <div class="navbar-menu " id="navMenu"> + + + + + <a class="navbar-item" href="/">main</a> + + + + + + + + + + + + + + + + + + + <a class="navbar-item" href="/#about">About</a> + + + + + + + + + + <a class="navbar-item" href="http://example.com/projects/"> + + Project + + </a> + + + + + + + + + + + + <a class="navbar-item" href="http://example.com/blog/"> + + Back to Blog + + </a> + + + + + + + + <a class="navbar-item" href="/#lorem">Lorem Ipsum</a> + + + + + + + + <a class="navbar-item" href="/#contact">Contact</a> + + + + + + + + <a class="navbar-item" href="http://example.com/es/">Español</a> + + + + <a class="navbar-item" href="http://example.com/de/">Deutsch</a> + + + + + + </div> + </nav> + <hr> +</div> + + + + +<div class="container"> + <h2 class="title is-1 top-pad strong-post-title"> + <a href="http://example.com/blog/configuration/">Theme Features</a> + </h2> + <div class="post-data"> + Jul 25, 2020 | + 4 minutes read + </div> + + <div class="blog-share"> + Share this: + + <a class="twitter-share-button" href="https://twitter.com/intent/tweet?text=Theme%20Features%20http%3a%2f%2fexample.com%2fblog%2fconfiguration%2f" onclick="window.open(this.href, 'twitter-share', 'width=550,height=235');return false;"> + <i class="fab fa-twitter"></i> + <span class="hidden">Twitter</span> + </a> + + + <a class="icon-facebook" href="https://www.facebook.com/sharer/sharer.php?u=http%3a%2f%2fexample.com%2fblog%2fconfiguration%2f" onclick="window.open(this.href, 'facebook-share','width=580,height=296');return false;"> + <i class="fab fa-facebook-f"></i> + <span class="hidden">Facebook</span> + </a> + + + <a class="icon-pinterest" href="http://pinterest.com/pin/create/button/?url=http%3a%2f%2fexample.com%2fblog%2fconfiguration%2f&description=Theme%20Features" onclick="window.open(this.href, 'pinterest-share','width=580,height=296');return false;"> + <i class="fab fa-pinterest-p"></i> + <span class="hidden">Pinterest</span> + </a> + + + <a class="icon-google-plus" href="https://plus.google.com/share?url=http%3a%2f%2fexample.com%2fblog%2fconfiguration%2f" onclick="window.open(this.href, 'google-plus-share', 'width=490,height=530');return false;"> + <i class="fab fa-google-plus-g"></i> + <span class="hidden">Google+</span> + </a> + + </div> + + + + <p> + Tag: + + <a href="/tags/code">code</a> + + </p> + +</div> + +<div class="container markdown top-pad"> + <p>Here are some helpful tips for setting up this theme.</p> +<h2 id="syntax-highlighting">Syntax Highlighting</h2> +<p>Introduction allows the use of Hugo’s rich built-in syntax highlighting capabilities. See <a href="https://gohugo.io/content-management/syntax-highlighting/">Syntax Highlighting</a> in the Hugo docs.</p> +<p>Below is an example configuration for Highlight. See <a href="https://gohugo.io/getting-started/configuration-markup#highlight">Highlight in the Hugo docs</a> for more.</p> +<div class="highlight"><pre style="background-color:#f0f0f0;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-toml" data-lang="toml">[markup] + [markup.highlight] + codeFences = <span style="color:#007020;font-weight:bold">true</span> + guessSyntax = <span style="color:#007020;font-weight:bold">false</span> + hl_Lines = <span style="color:#4070a0">""</span> + lineNoStart = <span style="color:#40a070">1</span> + lineNos = <span style="color:#007020;font-weight:bold">false</span> + lineNumbersInTable = <span style="color:#007020;font-weight:bold">true</span> + noClasses = <span style="color:#007020;font-weight:bold">true</span> + <span style="color:#60a0b0;font-style:italic"># For styles, see https://xyproto.github.io/splash/docs/longer/all.html</span> + style = <span style="color:#4070a0">"friendly"</span> + tabWidth = <span style="color:#40a070">4</span> +</code></pre></div><h2 id="shortcodes">Shortcodes</h2> +<p><a href="https://gohugo.io/templates/shortcode-templates/">Custom shortcodes</a> can be added to a <code>layouts/shortcodes/</code> directory in your site root. Below, I use two custom shortcodes to display a data file: the current configuration file for this site! See the <a href="https://github.com/victoriadrake/hugo-theme-introduction/blob/master/exampleSite/content/en/blog/configuration.md">source for this page</a> to understand how to use shortcodes.</p> +<h2 id="show-html-in-posts">Show HTML in Posts</h2> +<p>To ensure Hugo renders any HTML that your shortcode or other additions like Font Awesome uses in posts, make sure these lines for <a href="https://gohugo.io/getting-started/configuration-markup">the Goldmark renderer</a> are in your <code>config.toml</code>:</p> +<div class="highlight"><pre style="background-color:#f0f0f0;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-toml" data-lang="toml">[markup] +defaultMarkdownHandler = <span style="color:#4070a0">"goldmark"</span> + +[markup.goldmark] + +[markup.goldmark.renderer] +unsafe = <span style="color:#007020;font-weight:bold">true</span> +</code></pre></div><h2 id="configuration">Configuration</h2> +<p>Introduction can be easily configured using <a href="https://gohugo.io/getting-started/configuration/">Hugo’s configuration file</a>. You can copy the <code>config.toml</code> in the <code>exampleSite/</code> to your site root get started.</p> +<p>Here are all the options included in the configuration file for this example site!</p> +<div class="highlight"><pre style="background-color:#f0f0f0;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-toml" data-lang="toml"> +baseURL = <span style="color:#4070a0">"http://example.com/"</span> <span style="color:#60a0b0;font-style:italic"># Your domain name. Must end with "/"</span> +theme = <span style="color:#4070a0">"introduction"</span> +DefaultContentLanguage = <span style="color:#4070a0">"en"</span> <span style="color:#60a0b0;font-style:italic"># Default language for multilingual sites</span> +<span style="color:#60a0b0;font-style:italic"># disqusshortname = "" # https://gohugo.io/content-management/comments</span> +<span style="color:#60a0b0;font-style:italic"># googleAnalytics = "" # https://gohugo.io/templates/internal/#google-analytics</span> + +[params] + themeStyle = <span style="color:#4070a0">"light"</span> <span style="color:#60a0b0;font-style:italic"># Choose "light" or "dark"</span> + favicon = <span style="color:#4070a0">"/img/fav.ico"</span> <span style="color:#60a0b0;font-style:italic"># Path to favicon file</span> + showRSSButton = <span style="color:#007020;font-weight:bold">false</span> <span style="color:#60a0b0;font-style:italic"># Show rss button in navigation</span> + fadeIn = <span style="color:#007020;font-weight:bold">true</span> <span style="color:#60a0b0;font-style:italic"># Turn on/off the fade-in effect</span> + fadeInIndex = <span style="color:#007020;font-weight:bold">false</span> <span style="color:#60a0b0;font-style:italic"># Turn on/off the fade-in effect on the index page even if fade-in was otherwise turned off</span> + dateFormat = <span style="color:#4070a0">"Jan 2, 2006"</span> + email = <span style="color:#4070a0">"youremail@email.com"</span> <span style="color:#60a0b0;font-style:italic"># E-mail address for contact section</span> + <span style="color:#60a0b0;font-style:italic"># customCSS = ["foo.css"] # Include custom css files placed under assets/</span> + + <span style="color:#60a0b0;font-style:italic"># Configure the home page</span> + [params.home] + introHeight = <span style="color:#4070a0">"fullheight"</span> <span style="color:#60a0b0;font-style:italic"># Input either "medium" or "large" or "fullheight"</span> + showLatest = <span style="color:#007020;font-weight:bold">true</span> <span style="color:#60a0b0;font-style:italic"># Show latest blog post summary</span> + showAllPosts = <span style="color:#007020;font-weight:bold">false</span> <span style="color:#60a0b0;font-style:italic"># Set true to list all posts on home page, or set false to link to separate blog list page</span> + numberOfProjectsToShow = <span style="color:#40a070">3</span> <span style="color:#60a0b0;font-style:italic"># Maximum number of projects to show on home page. Unset or comment out to show all projects</span> + localTime = <span style="color:#007020;font-weight:bold">true</span> <span style="color:#60a0b0;font-style:italic"># Show your current local time in contact section</span> + timeZone = <span style="color:#4070a0">"America/Los_Angeles"</span> <span style="color:#60a0b0;font-style:italic"># Your timezone as in the TZ* column of this list: https://en.wikipedia.org/wiki/List_of_tz_database_time_zones</span> + timeFormat = <span style="color:#4070a0">"h:mm A"</span> <span style="color:#60a0b0;font-style:italic"># https://momentjs.com/docs/#/displaying/format/</span> + [params.projects] + useTwoColumns = <span style="color:#007020;font-weight:bold">false</span> <span style="color:#60a0b0;font-style:italic"># Use a layout with two columns instead of three</span> + + <span style="color:#60a0b0;font-style:italic"># Share buttons on blog post pages</span> + [params.share] + twitter = <span style="color:#007020;font-weight:bold">true</span> + facebook = <span style="color:#007020;font-weight:bold">true</span> + googlePlus = <span style="color:#007020;font-weight:bold">true</span> + pinterest = <span style="color:#007020;font-weight:bold">true</span> + + <span style="color:#60a0b0;font-style:italic"># Social icons appear in introduction and contact section. Add as many more as you like.</span> + <span style="color:#60a0b0;font-style:italic"># Icon pack "fab" includes social network icons, see: https://fontawesome.com/icons?d=gallery&s=brands&m=free</span> + <span style="color:#60a0b0;font-style:italic"># Icon pack "fas" includes solid style icons, see: https://fontawesome.com/icons?d=gallery&s=solid&m=free</span> + [[params.social]] + url = <span style="color:#4070a0">"https://twitter.com/"</span> + icon = <span style="color:#4070a0">"twitter"</span> <span style="color:#60a0b0;font-style:italic"># icon name without the 'fa-'</span> + icon_pack = <span style="color:#4070a0">"fab"</span> + [[params.social]] + url = <span style="color:#4070a0">"https://facebook.com/"</span> + icon = <span style="color:#4070a0">"facebook-f"</span> <span style="color:#60a0b0;font-style:italic"># icon name without the 'fa-'</span> + icon_pack = <span style="color:#4070a0">"fab"</span> + [[params.social]] + url = <span style="color:#4070a0">"https://linkedin.com/"</span> + icon = <span style="color:#4070a0">"linkedin-in"</span> <span style="color:#60a0b0;font-style:italic"># icon name without the 'fa-'</span> + icon_pack = <span style="color:#4070a0">"fab"</span> + [[params.social]] + url = <span style="color:#4070a0">"mailto:youremail@email.com"</span> <span style="color:#60a0b0;font-style:italic"># For a direct email link, use "mailto:test@example.org".</span> + icon = <span style="color:#4070a0">"paper-plane"</span> <span style="color:#60a0b0;font-style:italic"># icon name without the 'fa-'</span> + icon_pack = <span style="color:#4070a0">"fas"</span> + [[params.social]] + url = <span style="color:#4070a0">"https://mastodon.social/"</span> + icon = <span style="color:#4070a0">"mastodon"</span> <span style="color:#60a0b0;font-style:italic"># icon name without the 'fa-'</span> + icon_pack = <span style="color:#4070a0">"fab"</span> + html_attributes = <span style="color:#4070a0">"rel=\"me\""</span> <span style="color:#60a0b0;font-style:italic"># Add rel attribute for Mastodon profile link verification</span> + + +<span style="color:#60a0b0;font-style:italic"># If you don't want to use the default menu, you can define one by yourself</span> +<span style="color:#60a0b0;font-style:italic"># [[menu.main]]</span> +<span style="color:#60a0b0;font-style:italic"># name = "Home"</span> +<span style="color:#60a0b0;font-style:italic"># url = "/"</span> +<span style="color:#60a0b0;font-style:italic"># weight = 0</span> +<span style="color:#60a0b0;font-style:italic"># [[menu.main]]</span> +<span style="color:#60a0b0;font-style:italic"># name = "Blog"</span> +<span style="color:#60a0b0;font-style:italic"># url = "/blog/"</span> +<span style="color:#60a0b0;font-style:italic"># weight = 1</span> + +<span style="color:#60a0b0;font-style:italic"># We only use tag as a taxonomies</span> +<span style="color:#60a0b0;font-style:italic"># You can add more by yourself</span> +[taxonomies] + tag = <span style="color:#4070a0">"tags"</span> + +[markup] + defaultMarkdownHandler = <span style="color:#4070a0">"goldmark"</span> + [markup.goldmark] + [markup.goldmark.renderer] + unsafe = <span style="color:#007020;font-weight:bold">true</span> + [markup.highlight] + codeFences = <span style="color:#007020;font-weight:bold">true</span> + guessSyntax = <span style="color:#007020;font-weight:bold">false</span> + hl_Lines = <span style="color:#4070a0">""</span> + lineNoStart = <span style="color:#40a070">1</span> + lineNos = <span style="color:#007020;font-weight:bold">false</span> + lineNumbersInTable = <span style="color:#007020;font-weight:bold">true</span> + noClasses = <span style="color:#007020;font-weight:bold">true</span> + <span style="color:#60a0b0;font-style:italic"># For styles, see https://xyproto.github.io/splash/docs/longer/all.html</span> + style = <span style="color:#4070a0">"friendly"</span> + tabWidth = <span style="color:#40a070">4</span> + +[languages] + [languages.en] + languageName = <span style="color:#4070a0">"English"</span> + languageCode = <span style="color:#4070a0">"en-us"</span> + contentDir = <span style="color:#4070a0">"content/en"</span> + weight = <span style="color:#40a070">0</span> + title = <span style="color:#4070a0">"Introduction"</span> + [languages.en.params] + description = <span style="color:#4070a0">"Website Description"</span> <span style="color:#60a0b0;font-style:italic"># Max 160 characters show in search results</span> + <span style="color:#60a0b0;font-style:italic"># footerText = "" # Text to override default footer text (markdown allowed)</span> + + [languages.es] + languageName = <span style="color:#4070a0">"Español"</span> + languageCode = <span style="color:#4070a0">"es"</span> + contentDir = <span style="color:#4070a0">"content/es"</span> + weight = <span style="color:#40a070">1</span> + title = <span style="color:#4070a0">"Introducción"</span> + [languages.es.params] + description = <span style="color:#4070a0">"Descripcion del sitio web"</span> + <span style="color:#60a0b0;font-style:italic"># footerText = ""</span> + + [languages.de] + languageName = <span style="color:#4070a0">"Deutsch"</span> + languageCode = <span style="color:#4070a0">"de"</span> + contentDir = <span style="color:#4070a0">"content/de"</span> + weight = <span style="color:#40a070">2</span> + title = <span style="color:#4070a0">"Vorstellung"</span> + [languages.de.params] + dateFormat = <span style="color:#4070a0">"2. January 2006"</span> + description = <span style="color:#4070a0">"Beschreibung der Webseite"</span> + <span style="color:#60a0b0;font-style:italic"># footerText = ""</span> + + +</code></pre></div> +</div> + + + + + + + <div class="container"> + <hr> +</div> +<div class="container has-text-centered top-pad"> + <a href="#top"> + <i class="fa fa-arrow-up"></i> + </a> +</div> + +<div class="container"> + <hr> +</div> + + <div class="section" id="footer"> + <div class="container has-text-centered"> + + <span class="footer-text"> + <a href="https://github.com/victoriadrake/hugo-theme-introduction/"><strong>Introduction</strong></a> theme for <a href="http://gohugo.io/">Hugo</a>. Made with <a href="https://victoria.dev"><i class="fa fa-heart"></i> and <i class="fa fa-coffee"></i></a> by open source contributors. + </span> + + </div> +</div> + + + </div> + </section> + + + + +<script src="http://example.com/js/bundle.e6934e69d06bb8a213134f4c1468f9478bb7755e786dfb60e3c5a917c5335805.js" integrity="sha256-5pNOadBruKITE09MFGj5R4u3dV54bftg48WpF8UzWAU="></script> + + + + + + + + </body> +</html> |