diff --git a/.gitmodules b/.gitmodules new file mode 100644 index 000000000..9923a2c95 --- /dev/null +++ b/.gitmodules @@ -0,0 +1,3 @@ +[submodule "themes/gohugoioTheme"] + path = themes/gohugoioTheme + url = https://github.com/gohugoio/gohugoioTheme.git diff --git a/content/meta/license.md b/LICENSE.md similarity index 97% rename from content/meta/license.md rename to LICENSE.md index a16923bfb..b62a9b5ff 100644 --- a/content/meta/license.md +++ b/LICENSE.md @@ -1,20 +1,3 @@ ---- -aliases: -- /doc/license/ -- /license/ -- /meta/license/ -lastmod: 2015-11-25 -date: 2013-07-01 -menu: - main: - parent: about -title: License -weight: 50 ---- - -Hugo v0.15 and later are released under the Apache 2.0 license. -Earlier releases were under the Simple Public License. - Apache License ============== diff --git a/archetypes/default.md b/archetypes/default.md index 6d6497c4d..e325a7d99 100644 --- a/archetypes/default.md +++ b/archetypes/default.md @@ -1,6 +1,13 @@ -+++ -weight = 5 -[menu] - [menu.main] - parent = "x" -+++ +--- +linktitle: "" +description: "" +godocref: "" +publishdate: "" +lastmod: "" +categories: [] +tags: [] +weight: 00 +slug: "" +aliases: [] +toc: false +--- diff --git a/archetypes/functions.md b/archetypes/functions.md new file mode 100644 index 000000000..0a5dd344f --- /dev/null +++ b/archetypes/functions.md @@ -0,0 +1,17 @@ +--- +linktitle: "" +description: "" +godocref: "" +publishdate: "" +lastmod: "" +categories: [functions] +tags: [] +ns: "" +signature: [] +workson: [] +hugoversion: "" +aliases: [] +relatedfuncs: [] +toc: false +deprecated: false +--- \ No newline at end of file diff --git a/archetypes/showcase.md b/archetypes/showcase.md index ebe87035a..562fb9e8e 100644 --- a/archetypes/showcase.md +++ b/archetypes/showcase.md @@ -1,14 +1,13 @@ --- -date: 2013-07-01T07:32:00Z description: "" +lastmod: "" license: "" licenseLink: "" -sitelink: http://spf13.com/ -sourceLink: https://github.com/spf13/spf13.com -tags: -- personal -- blog -thumbnail: /img/spf13-tn.jpg -title: spf13.com ---- - +sitelink: "" +sourcelink: "" +categories: [showcase] +tags: [] +image: "" +toc: false +notesforauthors: "Go to gohugo.io/contribute/documentation for more info" +--- \ No newline at end of file diff --git a/archetypes/tutorials.md b/archetypes/tutorials.md new file mode 100644 index 000000000..0a3540c0f --- /dev/null +++ b/archetypes/tutorials.md @@ -0,0 +1,16 @@ +--- +linktitle: "" +description: "" +godocref: "" +publishdate: "" +lastmod: "" +categories: [tutorials] +tags: [] +author: "" +authorurl: "" +originalurl: "" +draft: false +aliases: [] +notesforauthors: "Go to gohugo.io/contribute/documentation for more info." +--- + diff --git a/config.toml b/config.toml index a36734186..aafb6aa00 100644 --- a/config.toml +++ b/config.toml @@ -1,13 +1,21 @@ +baseURL = "https://gohugo.io/" +paginate = 100 +defaultContentLanguage = "en" +enableEmoji = true +# Set the unicode character used for the "return" link in page footnotes. +footnotereturnlinkcontents = "↩" +languageCode = "en-us" +metaDataFormat = "yaml" title = "Hugo: A Fast and Flexible Website Generator" -baseurl = "http://gohugo.io/" -MetaDataFormat = "yaml" +theme = "gohugoioTheme" + +googleAnalytics = "UA-7131036-4" + pluralizeListTitles = false + # We do redirects via Netlify's _redirects file, generated by Hugo (see "outputs" below). disableAliases = true -[blackfriday] - plainIDAnchors = true - [outputs] home = [ "HTML", "RSS", "REDIR" ] @@ -23,113 +31,191 @@ baseName = "_redirects" isPlainText = true notAlternative = true + +[social] +twitter = "GoHugoIO" + +#CUSTOM PARAMS [params] - description = "Documentation of Hugo, a fast and flexible static site generator built with love by spf13, bep and friends in Go" - author = "Steve Francia (spf13) and friends" - release = "0.24.1" + description = "The world’s fastest framework for building websites" + ## Used for views in rendered HTML (i.e., rather than using the .Hugo variable) + release = "Hugo-Next" + ## Setting this to true will add a "noindex" to *EVERY* page on the site + removefromexternalsearch = false + ## Gh repo for site footer (include trailing slash) + ghrepo = "https://github.com/gohugoio/hugoDocs/" + ### Edit content repo (set to automatically enter "edit" mode; this is good for "improve this page" links) + ghdocsrepo = "https://github.com/gohugoio/hugoDocs/tree/master/docs" + ## Gitter URL + gitter = "https://gitter.im/spf13/hugo" + ## Discuss Forum URL + forum = "https://discourse.gohugo.io/" + ## Google Tag Manager + gtmid = "" + # First one is picked as the Twitter card image if not set on page. + images = ["images/gohugoio-card.png"] + + flex_box_interior_classes = "flex-auto w-100 w-40-l mr3 mb3 bg-white ba b--moon-gray nested-copy-line-height" + + #sidebar_direction = "sidebar_left" + +# MARKDOWN +## Configuration for BlackFriday markdown parser: https://github.com/russross/blackfriday +[blackfriday] + plainIDAnchors = true + hrefTargetBlank = true + angledQuotes = false + latexDashes = true + +## As of v0.20, all content files include a default "categories" value that's the same as the section. This was a cheap future-proofing method and should/could be changed accordingly. [taxonomies] - tag = "tags" - group = "groups" + category = "categories" -[[menu.main]] - name = "Download Hugo" - pre = "" - url = "https://github.com/gohugoio/hugo/releases" - weight = -200 -[[menu.main]] - name = "Site Showcase" - pre = "" - url = "/showcase/" - weight = -180 -[[menu.main]] - name = "Theme Showcase" - pre = "" - url = "http://themes.gohugo.io" - weight = -170 -[[menu.main]] - name = "Press & Articles" - pre = "" - url = "/community/press/" - weight = -160 -[[menu.main]] - name = "Discuss Hugo" - pre = "" - url = "https://discourse.gohugo.io/" - weight = -150 -[[menu.main]] - name = "About Hugo" - identifier = "about" - pre = "" - weight = -110 -[[menu.main]] - name = "Release Notes" - url = "/release-notes/" - pre = "" - weight = -111 -[[menu.main]] - name = "Getting Started" - identifier = "getting started" - pre = "" - weight = -100 -[[menu.main]] - name = "Content" - identifier = "content" - pre = "" - weight = -90 -[[menu.main]] +# High level items + +[[menu.docs]] + name = "About Hugo" + weight = 1 + identifier = "about" + url = "/about/" + +[[menu.docs]] + name = "Getting Started" + weight = 5 + identifier = "getting-started" + url = "/getting-started/" + + +[[menu.docs]] + name = "Themes" + weight = 15 + identifier = "themes" + post = "break" + url = "/themes/" + +# Core Menus + +[[menu.docs]] + name = "Content Management" + weight = 20 + identifier = "content-management" + post = "expanded" + url = "/content-management/" + +[[menu.docs]] + name = "Templates" + weight = 25 + identifier = "templates" + + url = "/templates/" + +[[menu.docs]] + name = "Functions" + weight = 30 + identifier = "functions" + url = "/functions/" + +[[menu.docs]] + name = "Variables" + weight = 35 + identifier = "variables" + url = "/variables/" + +[[menu.docs]] + name = "CLI" + weight = 40 + post = "break" + identifier = "commands" + url = "/commands/" + + + +# LOW LEVEL ITEMS + + +[[menu.docs]] + name = "Troubleshooting" + weight = 60 + identifier = "troubleshooting" + url = "/troubleshooting/" + +[[menu.docs]] + name = "Tools" + weight = 70 + identifier = "tools" + url = "/tools/" + +[[menu.docs]] + name = "Hosting & Deployment" + weight = 80 + identifier = "hosting-and-deployment" + url = "/hosting-and-deployment/" + +[[menu.docs]] + name = "Contribute" + weight = 100 + post = "break" + identifier = "contribute" + url = "/contribute/" + +#[[menu.docs]] +# name = "Tags" +# weight = 120 +# identifier = "tags" +# url = "/tags/" + + +# [[menu.docs]] +# name = "Categories" +# weight = 140 +# identifier = "categories" +# url = "/categories/" + +######## QUICKLINKS + + [[menu.quicklinks]] + name = "Fundamentals" + weight = 1 + identifier = "fundamentals" + url = "/tags/fundamentals/" + + + + +######## GLOBAL ITEMS TO BE SHARED WITH THE HUGO SITES + +[[menu.global]] + name = "News" + weight = 1 + identifier = "news" + url = "/news/" + + [[menu.global]] + name = "Docs" + weight = 5 + identifier = "docs" + url = "/documentation/" + + [[menu.global]] name = "Themes" + weight = 10 identifier = "themes" - pre = "" - weight = -85 -[[menu.main]] - parent = "themes" - name = "Theme Showcase" - url = "http://themes.gohugo.io" - weight = -170 -[[menu.main]] - name = "Templates" - identifier = "layout" - pre = "" - weight = -80 -[[menu.main]] - name = "Taxonomies" - identifier = "taxonomy" - pre = "" - weight = -70 -[[menu.main]] - name = "Extras" - identifier = "extras" - pre = "" - weight = -60 -[[menu.main]] + url = "https://themes.gohugo.io/" + + # Anything with a weight > 100 gets an external icon + [[menu.global]] name = "Community" - identifier = "community" - pre = "" - weight = -50 -[[menu.main]] - parent = "community" - name = "Discussion Forum" - url = "https://discourse.gohugo.io/" weight = 150 -[[menu.main]] - name = "Tutorials" - identifier = "tutorials" - pre = "" - weight = -40 -[[menu.main]] - name = "Troubleshooting" - identifier = "troubleshooting" - pre = "" - weight = -30 -[[menu.main]] - name = "Tools" - url = "/tools/" - pre = "" - weight = -25 -[[menu.main]] - name = "Hugo Cmd Reference" - identifier = "commands" - pre = "" - weight = -20 - url = "/commands/" + icon = true + identifier = "community" + post = "external" + url = "https://discourse.gohugo.io/" + + + [[menu.global]] + name = "GitHub" + weight = 200 + identifier = "github" + post = "external" + url = "https://github.com/gohugoio/hugo" diff --git a/content/_index.md b/content/_index.md new file mode 100644 index 000000000..f23aa99e9 --- /dev/null +++ b/content/_index.md @@ -0,0 +1,49 @@ +--- +title: "Hugo: A Fast and Flexible Website Generator" +date: 2017-03-02T12:00:00-05:00 +features: + - heading: Blistering Speed + image_path: /images/icon-fast.svg + tagline: What's modern about waiting for your site to build? + copy: Hugo is the fastest tool of its kind. At <1 ms per page, the average site builds in less than a second. + + - heading: Robust Content Management + image_path: /images/icon-content-management.svg + tagline: Flexibility rules. Hugo is a content strategist's dream. + copy: Hugo supports unlimited content types, taxonomies, menus, dynamic API-driven content, and more, all without plugins. + + - heading: Shortcodes + image_path: /images/icon-shortcodes.svg + tagline: Hugo's shortcodes are Markdown's hidden superpower. + copy: We love the beautiful simplicity of markdown’s syntax, but there are times when we want more flexibility. Hugo shortcodes allow for both beauty and flexibility. + + - heading: Built-in Templates + image_path: /images/icon-built-in-templates.svg + tagline: Hugo has common patterns to get your work done quickly. + copy: Hugo ships with pre-made templates to make quick work of SEO, commenting, analytics and other functions. One line of code, and you're done. + + - heading: Multilingual and i18n + image_path: /images/icon-multilingual2.svg + tagline: Polyglot baked in. + copy: Hugo provides full i18n support for multi-language sites with the same straightforward development experience Hugo users love in single-language sites. + + - heading: Custom Outputs + image_path: /images/icon-custom-outputs.svg + tagline: HTML not Enough? + copy: Hugo allows you to output your content in multiple formats, including JSON or AMP, and makes it easy to create your own. +sections: + - heading: "100s of Themes" + cta: Check out the Hugo's themes. + link: http://themes.gohugo.io/ + color_classes: bg-accent-color white + image: /images/homepage-screenshot-hugo-themes.jpg + copy: "Hugo provides a robust theming system that is easy to implement but capable of producing even the most complicated websites." + - heading: "Capable Templating" + cta: Get Started. + link: templates/ + color_classes: bg-primary-color-light black + image: /images/home-page-templating-example.png + copy: "Hugo's Go-based templating provides just the right amount of logic to build anything from the simple to complex. If you prefer Jade/Pug-like syntax, you can also use Amber, Ace, or any combination of the three." +--- + +Hugo is one of the most popular open-source static site generators. With its amazing speed and flexibility, Hugo makes building websites fun again. diff --git a/content/about/_index.md b/content/about/_index.md new file mode 100644 index 000000000..422eb1d05 --- /dev/null +++ b/content/about/_index.md @@ -0,0 +1,20 @@ +--- +title: About Hugo +linktitle: Overview +description: Hugo's features, roadmap, license, and motivation. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [] +#tags: [] +menu: + docs: + parent: "about" + weight: 1 +weight: 1 +draft: false +aliases: [/about-hugo/,/docs/] +toc: false +--- + +Hugo is not your average static site generator. diff --git a/content/about/benefits.md b/content/about/benefits.md new file mode 100644 index 000000000..87d2f23b5 --- /dev/null +++ b/content/about/benefits.md @@ -0,0 +1,43 @@ +--- +title: The Benefits of Static Site Generators +linktitle: The Benefits of Static +description: Improved performance, security and ease of use are just a few of the reasons static site generators are so appealing. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +#tags: [ssg,static,performance,security] +menu: + docs: + parent: "about" + weight: 30 +weight: 30 +sections_weight: 30 +draft: false +aliases: [] +toc: false +--- + +The purpose of website generators is to render content into HTML files. Most are "dynamic site generators." That means the HTTP server---i.e., the program that sends files to the browser to be viewed---runs the generator to create a new HTML file every time an end user requests a page. + +Over time, dynamic site generators were programmed to cache their HTML files to prevent unnecessary delays in delivering pages to end users. A cached page is a static version of a web page. + +Hugo takes caching a step further and all HTML files are rendered on your computer. You can review the files locally before copying them to the computer hosting the HTTP server. Since the HTML files aren't generated dynamically, we say that Hugo is a *static site generator*. + +This has many benefits. The most noticeable is performance. HTTP servers are *very* good at sending files---so good, in fact, that you can effectively serve the same number of pages with a fraction of the memory and CPU needed for a dynamic site. + +## More on Static Site Generators + +* ["An Introduction to Static Site Generators", David Walsh][] +* ["Hugo vs. Wordpress page load speed comparison: Hugo leaves WordPress in its dust", GettingThingsTech][hugovwordpress] +* ["Static Site Generators", O-Reilly][] +* [StaticGen: Top Open-Source Static Site Generators (GitHub Stars)][] +* ["Top 10 Static Website Generators", Netlify blog][] +* ["The Resurgence of Static", dotCMS][dotcms] + + +["An Introduction to Static Site Generators", David Walsh]: https://davidwalsh.name/introduction-static-site-generators +["Static Site Generators", O-Reilly]: /documents/oreilly-static-site-generators.pdf +["Top 10 Static Website Generators", Netlify blog]: https://www.netlify.com/blog/2016/05/02/top-ten-static-website-generators/ +[hugovwordpress]: https://gettingthingstech.com/hugo-vs.-wordpress-page-load-speed-comparison-hugo-leaves-wordpress-in-its-dust/ +[StaticGen: Top Open-Source Static Site Generators (GitHub Stars)]: https://www.staticgen.com/ +[dotcms]: https://dotcms.com/blog/post/the-resurgence-of-static diff --git a/content/about/features.md b/content/about/features.md new file mode 100644 index 000000000..f3f490cba --- /dev/null +++ b/content/about/features.md @@ -0,0 +1,90 @@ +--- +title: Hugo Features +linktitle: Hugo Features +description: Hugo boasts blistering speed, robust content management, and a powerful templating language making it a great fit for all kinds of static websites. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +menu: + docs: + parent: "about" + weight: 20 +weight: 20 +sections_weight: 20 +draft: false +aliases: [/about/features] +toc: true +--- + +## General + +* [Extremely fast][] build times (< 1 ms per page) +* Completely cross platform, with [easy installation][install] on macOS, Linux, Windows, and more +* Renders changes on the fly with [LiveReload][] as you develop +* [Powerful theming][] +* [Host your site anywhere][hostanywhere] + +## Organization + +* Straightforward [organization for your projects][], including website sections +* Customizable [URLs][] +* Support for configurable [taxonomies][], including categories and tags +* [Sort content][] as you desire through powerful template [functions][] +* Automatic [table of contents][] generation +* [Dynamic menu][] creation +* [Pretty URLs][] support +* [Permalink][] pattern support +* Redirects via [aliases][] + +## Content + +* Native Markdown and Emacs Org-Mode support, as well as other languages via *external helpers* (see [supported formats][]) +* TOML, YAML, and JSON metadata support in [front matter][] +* Customizable [homepage][] +* Multiple [content types][] +* Automatic and user defined [content summaries][] +* [Shortcodes][] to enable rich content inside of Markdown +* ["Minutes to Read"][pagevars] functionality +* ["Wordcount"][pagevars] functionality + +## Additional Features + +* Integrated [Disqus][] comment support +* Integrated [Google Analytics][] support +* Automatic [RSS][] creation +* Support for [Go][], [Amber], and [Ace][] HTML templates +* [Syntax highlighting][] powered by [Pygments][] + +See what's coming next in the [Hugo roadmap][]. + +[Ace]: /templates/alternatives/ +[aliases]: /content-management/urls/#aliases +[Amber]: https://github.com/eknkc/amber +[content summaries]: /content-management/summaries/ +[content types]: /content-management/types/ +[Disqus]: https://disqus.com/ +[Dynamic menu]: /templates/menus/ +[Extremely fast]: https://github.com/bep/hugo-benchmark +[front matter]: /content-management/front-matter/ +[functions]: /functions/ +[Go]: http://golang.org/pkg/html/template/ +[Google Analytics]: https://google-analytics.com/ +[homepage]: /templates/homepage/ +[hostanywhere]: /hosting-and-deployment/ +[Hugo roadmap]: /about/roadmap +[install]: /getting-started/installing/ +[LiveReload]: /getting-started/usage/ +[organization for your projects]: /getting-started/directory-structure/ +[pagevars]: /variables/page/ +[Permalink]: /content-management/urls/#permalinks +[Powerful theming]: /themes/ +[Pretty URLs]: /content-management/urls/ +[Pygments]: http://pygments.org/ +[RSS]: /templates/rss/ +[Shortcodes]: /content-management/shortcodes/ +[sort content]: /templates/ +[supported formats]: /content-management/formats/ +[Syntax highlighting]: /tools/syntax-highlighting/ +[table of contents]: /content-management/toc/ +[taxonomies]: /content-management/taxonomies/ +[URLs]: /content-management/urls/ diff --git a/content/about/license.md b/content/about/license.md new file mode 100644 index 000000000..037e62e9b --- /dev/null +++ b/content/about/license.md @@ -0,0 +1,167 @@ +--- +title: Apache License +linktitle: License +description: Hugo v0.15 and later are released under the Apache 2.0 license. +date: 2016-02-01 +publishdate: 2016-02-01 +lastmod: 2016-03-02 +categories: ["about hugo"] +#tags: ["License","apache"] +menu: + docs: + parent: "about" + weight: 60 +weight: 60 +sections_weight: 60 +aliases: [/meta/license] +toc: true +--- + +{{% note %}} +Hugo v0.15 and later are released under the Apache 2.0 license. +Earlier versions of Hugo were released under the [Simple Public License](https://opensource.org/licenses/Simple-2.0). +{{% /note %}} + +_Version 2.0, January 2004_
+ + +*Terms and Conditions for use, reproduction, and distribution* + +## 1. Definitions + +“License” shall mean the terms and conditions for use, reproduction, and +distribution as defined by Sections 1 through 9 of this document. + +“Licensor” shall mean the copyright owner or entity authorized by the copyright +owner that is granting the License. + +“Legal Entity” shall mean the union of the acting entity and all other entities +that control, are controlled by, or are under common control with that entity. +For the purposes of this definition, “control” means **(i)** the power, direct or +indirect, to cause the direction or management of such entity, whether by +contract or otherwise, or **(ii)** ownership of fifty percent (50%) or more of the +outstanding shares, or **(iii)** beneficial ownership of such entity. + +“You” (or “Your”) shall mean an individual or Legal Entity exercising +permissions granted by this License. + +“Source” form shall mean the preferred form for making modifications, including +but not limited to software source code, documentation source, and configuration +files. + +“Object” form shall mean any form resulting from mechanical transformation or +translation of a Source form, including but not limited to compiled object code, +generated documentation, and conversions to other media types. + +“Work” shall mean the work of authorship, whether in Source or Object form, made +available under the License, as indicated by a copyright notice that is included +in or attached to the work (an example is provided in the Appendix below). + +“Derivative Works” shall mean any work, whether in Source or Object form, that +is based on (or derived from) the Work and for which the editorial revisions, +annotations, elaborations, or other modifications represent, as a whole, an +original work of authorship. For the purposes of this License, Derivative Works +shall not include works that remain separable from, or merely link (or bind by +name) to the interfaces of, the Work and Derivative Works thereof. + +“Contribution” shall mean any work of authorship, including the original version +of the Work and any modifications or additions to that Work or Derivative Works +thereof, that is intentionally submitted to Licensor for inclusion in the Work +by the copyright owner or by an individual or Legal Entity authorized to submit +on behalf of the copyright owner. For the purposes of this definition, +“submitted” means any form of electronic, verbal, or written communication sent +to the Licensor or its representatives, including but not limited to +communication on electronic mailing lists, source code control systems, and +issue tracking systems that are managed by, or on behalf of, the Licensor for +the purpose of discussing and improving the Work, but excluding communication +that is conspicuously marked or otherwise designated in writing by the copyright +owner as “Not a Contribution.” + +“Contributor” shall mean Licensor and any individual or Legal Entity on behalf +of whom a Contribution has been received by Licensor and subsequently +incorporated within the Work. + +## 2. Grant of Copyright License + +Subject to the terms and conditions of this License, each Contributor hereby +grants to You a perpetual, worldwide, non-exclusive, no-charge, royalty-free, +irrevocable copyright license to reproduce, prepare Derivative Works of, +publicly display, publicly perform, sublicense, and distribute the Work and such +Derivative Works in Source or Object form. + +## 3. Grant of Patent License + +Subject to the terms and conditions of this License, each Contributor hereby +grants to You a perpetual, worldwide, non-exclusive, no-charge, royalty-free, +irrevocable (except as stated in this section) patent license to make, have +made, use, offer to sell, sell, import, and otherwise transfer the Work, where +such license applies only to those patent claims licensable by such Contributor +that are necessarily infringed by their Contribution(s) alone or by combination +of their Contribution(s) with the Work to which such Contribution(s) was +submitted. If You institute patent litigation against any entity (including a +cross-claim or counterclaim in a lawsuit) alleging that the Work or a +Contribution incorporated within the Work constitutes direct or contributory +patent infringement, then any patent licenses granted to You under this License +for that Work shall terminate as of the date such litigation is filed. + +## 4. Redistribution + +You may reproduce and distribute copies of the Work or Derivative Works thereof +in any medium, with or without modifications, and in Source or Object form, +provided that You meet the following conditions: + +* **(a)** You must give any other recipients of the Work or Derivative Works a copy of +this License; and +* **(b)** You must cause any modified files to carry prominent notices stating that You +changed the files; and +* **\(c)** You must retain, in the Source form of any Derivative Works that You distribute, +all copyright, patent, trademark, and attribution notices from the Source form +of the Work, excluding those notices that do not pertain to any part of the +Derivative Works; and +* **(d)** If the Work includes a “NOTICE” text file as part of its distribution, then any Derivative Works that You distribute must include a readable copy of the attribution notices contained within such NOTICE file, excluding those notices that do not pertain to any part of the Derivative Works, in at least one of the following places: within a NOTICE text file distributed as part of the Derivative Works; within the Source form or documentation, if provided along with the Derivative Works; or, within a display generated by the Derivative Works, if and wherever such third-party notices normally appear. The contents of the NOTICE file are for informational purposes only and do not modify the License. You may add Your own attribution notices within Derivative Works that You distribute, alongside or as an addendum to the NOTICE text from the Work, provided that such additional attribution notices cannot be construed as modifying the License. + +You may add Your own copyright statement to Your modifications and may provide additional or different license terms and conditions for use, reproduction, or distribution of Your modifications, or for any such Derivative Works as a whole, provided Your use, reproduction, and distribution of the Work otherwise complies with the conditions stated in this License. + +## 5. Submission of Contributions + +Unless You explicitly state otherwise, any Contribution intentionally submitted for inclusion in the Work by You to the Licensor shall be under the terms and conditions of this License, without any additional terms or conditions. Notwithstanding the above, nothing herein shall supersede or modify the terms of any separate license agreement you may have executed with Licensor regarding such Contributions. + +## 6. Trademarks + +This License does not grant permission to use the trade names, trademarks, service marks, or product names of the Licensor, except as required for reasonable and customary use in describing the origin of the Work and reproducing the content of the NOTICE file. + +## 7. Disclaimer of Warranty + +Unless required by applicable law or agreed to in writing, Licensor provides the Work (and each Contributor provides its Contributions) on an “AS IS” BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied, including, without limitation, any warranties or conditions of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A PARTICULAR PURPOSE. You are solely responsible for determining the appropriateness of using or redistributing the Work and assume any risks associated with Your exercise of permissions under this License. + +## 8. Limitation of Liability + +In no event and under no legal theory, whether in tort (including negligence), contract, or otherwise, unless required by applicable law (such as deliberate and grossly negligent acts) or agreed to in writing, shall any Contributor be liable to You for damages, including any direct, indirect, special, incidental, or consequential damages of any character arising as a result of this License or out of the use or inability to use the Work (including but not limited to damages for loss of goodwill, work stoppage, computer failure or malfunction, or any and all other commercial damages or losses), even if such Contributor has been advised of the possibility of such damages. + +## 9. Accepting Warranty or Additional Liability + +While redistributing the Work or Derivative Works thereof, You may choose to offer, and charge a fee for, acceptance of support, warranty, indemnity, or other liability obligations and/or rights consistent with this License. However, in accepting such obligations, You may act only on Your own behalf and on Your sole responsibility, not on behalf of any other Contributor, and only if You agree to indemnify, defend, and hold each Contributor harmless for any liability incurred by, or claims asserted against, such Contributor by reason of your accepting any such warranty or additional liability. + +_END OF TERMS AND CONDITIONS_ + +## APPENDIX: How to apply the Apache License to your work + +To apply the Apache License to your work, attach the following boilerplate notice, with the fields enclosed by brackets `[]` replaced with your own identifying information. (Don't include the brackets!) The text should be enclosed in the appropriate comment syntax for the file format. We also recommend that a file or class name and description of purpose be included on the same “printed page” as the copyright notice for easier identification within third-party archives. + +{{% code file="apache-notice.txt" download="apache-notice.txt" %}} +``` +Copyright [yyyy] [name of copyright owner] + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +``` +{{% /code %}} diff --git a/content/about/roadmap.md b/content/about/roadmap.md new file mode 100644 index 000000000..0bc0b02aa --- /dev/null +++ b/content/about/roadmap.md @@ -0,0 +1,51 @@ +--- +title: Roadmap +linktitle: Roadmap +description: Take a look at what's in the pipeline for future versions of the Hugo project. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [about hugo] +#tags: [about,contribute,roadmap] +menu: + docs: + parent: "about" + weight: 50 +weight: 50 +sections_weight: 50 +draft: false +aliases: [/meta/roadmap] +toc: false +--- + +To track Hugo's progress, see our [GitHub Milestones][milestones]. + +In no particular order, here are some other features currently being worked on: + +* Even easier deployment to S3, SSH, GitHub, rsync. Give the [hosting and deployment][] section a shot. +* Import from other website systems. There are already [existing migration tools][migrate], but they don’t cover all major platforms. +* An interactive web-based editor (See the [related forum thread][]) +* Additional [themes][], which are always ongoing and [contributions are welcome][themescontrib]! +* Dynamic image resizing via shortcodes ({{< gh 1014 >}}) +* Native support for additional content formats (AsciiDoc {{< gh 1435>}}, reST {{< gh 1436 >}}) +* And, last but not least, [***your*** best ideas!][] + +## Contributions Welcome + +Feel free to [contribute to Hugo's development][devcontribute], [improve Hugo's documentation][doccontribute], or [open a new issue][newissue] if you have an idea for a new feature. + +[#98]: https://github.com/gohugoio/hugo/issues/98 +[#1014]: https://github.com/gohugoio/hugo/issues/1014 +[#1435]: https://github.com/gohugoio/hugo/issues/1435 +[#1436]: https://github.com/gohugoio/hugo/issues/1436 +[devcontribute]: /contribute/development/ +[doccontribute]: /contribute/documentation/ +[hosting and deployment]: /hosting-and-deployment/ +[migrate]: /tools/migrations/ +[milestones]: https://github.com/gohugoio/hugo/milestone/14 +[newissue]: https://github.com/gohugoio/hugo/issues/ +[related forum thread]: https://disourse.gohugo.io/t/web-based-editor/155 +[themes]: /themes/ +[themescontrib]: /contribute/themes/ +[tutorials]: /tutorials +[***your*** best ideas!]: /contribute/ diff --git a/content/about/what-is-hugo.md b/content/about/what-is-hugo.md new file mode 100644 index 000000000..c61fa2d40 --- /dev/null +++ b/content/about/what-is-hugo.md @@ -0,0 +1,69 @@ +--- +title: What is Hugo +linktitle: What is Hugo +description: Hugo is a fast and modern static site generator written in Go, and designed to make website creation fun again. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +layout: single +menu: + main: + parent: "about" + weight: 10 +weight: 10 +sections_weight: 10 +draft: false +aliases: [/overview/introduction/,/about/why-i-built-hugo/] +toc: true +--- + +Hugo is a general-purpose website framework. Technically speaking, Hugo is a [static site generator][]. Unlike systems that dynamically build a page with each visitor request, Hugo builds pages when you create or update your content. Since websites are viewed far more often than they are edited, Hugo is designed to provide an optimal viewing experience for your website's end users and an ideal writing experience for website authors. + +Websites built with Hugo are extremely fast and secure. Hugo sites can be hosted anywhere, including [Netlify][], [Heroku][], [GoDaddy][], [DreamHost][], [GitHub Pages][], [Surge][], [Aerobatic][], [Firebase][], [Google Cloud Storage][], [Amazon S3][], [Rackspace][], [Azure][], and [CloudFront][] and work well with CDNs. Hugo sites run without the need for a database or dependencies on expensive runtimes like Ruby, Python, or PHP. + +We think of Hugo as the ideal website creation tool with nearly instant build times, able to rebuild whenever a change is made. + +## How Fast is Hugo? + +{{< youtube "CdiDYZ51a2o" >}} + +## What Does Hugo Do? + +In technical terms, Hugo takes a source directory of files and templates and uses these as input to create a complete website. + +## Who Should Use Hugo? + +Hugo is for people that prefer writing in a text editor over a browser. + +Hugo is for people who want to hand code their own website without worrying about setting up complicated runtimes, dependencies and databases. + +Hugo is for people building a blog, a company site, a portfolio site, documentation, a single landing page, or a website with thousands of pages. + + + +[@spf13]: https://twitter.com/@spf13 +[Aerobatic]: https://www.aerobatic.com/ +[Amazon S3]: http://aws.amazon.com/s3/ +[Azure]: https://blogs.msdn.microsoft.com/acoat/2016/01/28/publish-a-static-web-site-using-azure-web-apps/ +[CloudFront]: http://aws.amazon.com/cloudfront/ "Amazon CloudFront" +[contributing to it]: https://github.com/gohugoio/hugo +[DreamHost]: http://www.dreamhost.com/ +[Firebase]: https://firebase.google.com/docs/hosting/ "Firebase static hosting" +[GitHub Pages]: https://pages.github.com/ +[GitLab]: https://about.gitlab.com +[Go language]: https://golang.org/ +[GoDaddy]: https://www.godaddy.com/ "Godaddy.com Hosting" +[Google Cloud Storage]: http://cloud.google.com/storage/ +[Heroku]: https://www.heroku.com/ +[Jekyll]: http://jekyllrb.com/ +[Jekyll]: https://jekyllrb.com/ +[Middleman]: https://middlemanapp.com/ +[Middleman]: https://middlemanapp.com/ +[Nanoc]: http://nanoc.ws/ +[Nanoc]: https://nanoc.ws/ +[Netlify]: https://netlify.com +[rackspace]: https://www.rackspace.com/cloud/files +[static site generator]: /about/benefits/ +[Rackspace]: https://www.rackspace.com/cloud/files +[static site generator]: /about/benefits/ +[Surge]: https://surge.sh diff --git a/content/commands/_index.md b/content/commands/_index.md new file mode 100644 index 000000000..a4ddd54f3 --- /dev/null +++ b/content/commands/_index.md @@ -0,0 +1,22 @@ +--- +title: Command Line Reference +linktitle: CLI Overview +description: Comprehensive list of Hugo templating functions, including basic and advanced usage examples. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [commands] +#tags: [cli,command line] +menu: + docs: + parent: "commands" + weight: 1 +weight: 01 #rem +draft: false +aliases: [/cli/] +--- + +The following list contains auto-generated and up-to-date (thanks to [Cobra][]) documentation for all the CLI commands in Hugo. + + +[Cobra]: https://github.com/spf13/cobra diff --git a/content/commands/hugo.md b/content/commands/hugo.md index 0e02a8a9b..1246f78ca 100644 --- a/content/commands/hugo.md +++ b/content/commands/hugo.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo" slug: hugo url: /commands/hugo/ @@ -74,7 +74,7 @@ hugo [flags] * [hugo list](/commands/hugo_list/) - Listing out various types of content * [hugo new](/commands/hugo_new/) - Create new content for your site * [hugo server](/commands/hugo_server/) - A high performance webserver -* [hugo undraft](/commands/hugo_undraft/) - Undraft changes the content's draft status from 'True' to 'False' +* [hugo undraft](/commands/hugo_undraft/) - Undraft resets the content's draft status * [hugo version](/commands/hugo_version/) - Print the version number of Hugo -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_benchmark.md b/content/commands/hugo_benchmark.md index acef140a3..2a7f9f8f4 100644 --- a/content/commands/hugo_benchmark.md +++ b/content/commands/hugo_benchmark.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo benchmark" slug: hugo_benchmark url: /commands/hugo_benchmark/ @@ -69,4 +69,4 @@ hugo benchmark [flags] ### SEE ALSO * [hugo](/commands/hugo/) - hugo builds your site -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_check.md b/content/commands/hugo_check.md index 1cab62f3e..b7fb2c843 100644 --- a/content/commands/hugo_check.md +++ b/content/commands/hugo_check.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo check" slug: hugo_check url: /commands/hugo_check/ @@ -34,4 +34,4 @@ Contains some verification checks * [hugo](/commands/hugo/) - hugo builds your site * [hugo check ulimit](/commands/hugo_check_ulimit/) - Check system ulimit settings -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_check_ulimit.md b/content/commands/hugo_check_ulimit.md index 33dae348f..c98c85111 100644 --- a/content/commands/hugo_check_ulimit.md +++ b/content/commands/hugo_check_ulimit.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo check ulimit" slug: hugo_check_ulimit url: /commands/hugo_check_ulimit/ @@ -38,4 +38,4 @@ hugo check ulimit [flags] ### SEE ALSO * [hugo check](/commands/hugo_check/) - Contains some verification checks -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_config.md b/content/commands/hugo_config.md index f15d28f04..0dd2052f5 100644 --- a/content/commands/hugo_config.md +++ b/content/commands/hugo_config.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo config" slug: hugo_config url: /commands/hugo_config/ @@ -37,4 +37,4 @@ hugo config [flags] ### SEE ALSO * [hugo](/commands/hugo/) - hugo builds your site -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_convert.md b/content/commands/hugo_convert.md index 62005e6f9..4202534ce 100644 --- a/content/commands/hugo_convert.md +++ b/content/commands/hugo_convert.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo convert" slug: hugo_convert url: /commands/hugo_convert/ @@ -41,4 +41,4 @@ See convert's subcommands toJSON, toTOML and toYAML for more information. * [hugo convert toTOML](/commands/hugo_convert_totoml/) - Convert front matter to TOML * [hugo convert toYAML](/commands/hugo_convert_toyaml/) - Convert front matter to YAML -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_convert_toJSON.md b/content/commands/hugo_convert_toJSON.md index f6136ad4a..36b1ffe2e 100644 --- a/content/commands/hugo_convert_toJSON.md +++ b/content/commands/hugo_convert_toJSON.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo convert toJSON" slug: hugo_convert_toJSON url: /commands/hugo_convert_tojson/ @@ -41,4 +41,4 @@ hugo convert toJSON [flags] ### SEE ALSO * [hugo convert](/commands/hugo_convert/) - Convert your content to different formats -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_convert_toTOML.md b/content/commands/hugo_convert_toTOML.md index 229004e78..29c4f045e 100644 --- a/content/commands/hugo_convert_toTOML.md +++ b/content/commands/hugo_convert_toTOML.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo convert toTOML" slug: hugo_convert_toTOML url: /commands/hugo_convert_totoml/ @@ -41,4 +41,4 @@ hugo convert toTOML [flags] ### SEE ALSO * [hugo convert](/commands/hugo_convert/) - Convert your content to different formats -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_convert_toYAML.md b/content/commands/hugo_convert_toYAML.md index 3c0cafe46..37d305d32 100644 --- a/content/commands/hugo_convert_toYAML.md +++ b/content/commands/hugo_convert_toYAML.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo convert toYAML" slug: hugo_convert_toYAML url: /commands/hugo_convert_toyaml/ @@ -41,4 +41,4 @@ hugo convert toYAML [flags] ### SEE ALSO * [hugo convert](/commands/hugo_convert/) - Convert your content to different formats -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_env.md b/content/commands/hugo_env.md index 857f03701..1d3b45127 100644 --- a/content/commands/hugo_env.md +++ b/content/commands/hugo_env.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo env" slug: hugo_env url: /commands/hugo_env/ @@ -37,4 +37,4 @@ hugo env [flags] ### SEE ALSO * [hugo](/commands/hugo/) - hugo builds your site -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_gen.md b/content/commands/hugo_gen.md index c2521aeba..2aa9e228a 100644 --- a/content/commands/hugo_gen.md +++ b/content/commands/hugo_gen.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo gen" slug: hugo_gen url: /commands/hugo_gen/ @@ -36,4 +36,4 @@ A collection of several useful generators. * [hugo gen doc](/commands/hugo_gen_doc/) - Generate Markdown documentation for the Hugo CLI. * [hugo gen man](/commands/hugo_gen_man/) - Generate man pages for the Hugo CLI -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_gen_autocomplete.md b/content/commands/hugo_gen_autocomplete.md index df89faab6..95002dae8 100644 --- a/content/commands/hugo_gen_autocomplete.md +++ b/content/commands/hugo_gen_autocomplete.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo gen autocomplete" slug: hugo_gen_autocomplete url: /commands/hugo_gen_autocomplete/ @@ -55,4 +55,4 @@ hugo gen autocomplete [flags] ### SEE ALSO * [hugo gen](/commands/hugo_gen/) - A collection of several useful generators. -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_gen_doc.md b/content/commands/hugo_gen_doc.md index 48402d12c..e7dbd7ba3 100644 --- a/content/commands/hugo_gen_doc.md +++ b/content/commands/hugo_gen_doc.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo gen doc" slug: hugo_gen_doc url: /commands/hugo_gen_doc/ @@ -44,4 +44,4 @@ hugo gen doc [flags] ### SEE ALSO * [hugo gen](/commands/hugo_gen/) - A collection of several useful generators. -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_gen_man.md b/content/commands/hugo_gen_man.md index efec000ee..2e03d3714 100644 --- a/content/commands/hugo_gen_man.md +++ b/content/commands/hugo_gen_man.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo gen man" slug: hugo_gen_man url: /commands/hugo_gen_man/ @@ -40,4 +40,4 @@ hugo gen man [flags] ### SEE ALSO * [hugo gen](/commands/hugo_gen/) - A collection of several useful generators. -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_import.md b/content/commands/hugo_import.md index aafe8e4f7..c46b1d0b9 100644 --- a/content/commands/hugo_import.md +++ b/content/commands/hugo_import.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo import" slug: hugo_import url: /commands/hugo_import/ @@ -36,4 +36,4 @@ Import requires a subcommand, e.g. `hugo import jekyll jekyll_root_path target_p * [hugo](/commands/hugo/) - hugo builds your site * [hugo import jekyll](/commands/hugo_import_jekyll/) - hugo import from Jekyll -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_import_jekyll.md b/content/commands/hugo_import_jekyll.md index f3427d04d..5edf76e29 100644 --- a/content/commands/hugo_import_jekyll.md +++ b/content/commands/hugo_import_jekyll.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo import jekyll" slug: hugo_import_jekyll url: /commands/hugo_import_jekyll/ @@ -40,4 +40,4 @@ hugo import jekyll [flags] ### SEE ALSO * [hugo import](/commands/hugo_import/) - Import your site from others. -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_list.md b/content/commands/hugo_list.md index 818c1520e..87d81bd15 100644 --- a/content/commands/hugo_list.md +++ b/content/commands/hugo_list.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo list" slug: hugo_list url: /commands/hugo_list/ @@ -39,4 +39,4 @@ List requires a subcommand, e.g. `hugo list drafts`. * [hugo list expired](/commands/hugo_list_expired/) - List all posts already expired * [hugo list future](/commands/hugo_list_future/) - List all posts dated in the future -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_list_drafts.md b/content/commands/hugo_list_drafts.md index 4ca7319b1..92d9fbc0d 100644 --- a/content/commands/hugo_list_drafts.md +++ b/content/commands/hugo_list_drafts.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo list drafts" slug: hugo_list_drafts url: /commands/hugo_list_drafts/ @@ -38,4 +38,4 @@ hugo list drafts [flags] ### SEE ALSO * [hugo list](/commands/hugo_list/) - Listing out various types of content -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_list_expired.md b/content/commands/hugo_list_expired.md index fcc48085d..697ffe83d 100644 --- a/content/commands/hugo_list_expired.md +++ b/content/commands/hugo_list_expired.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo list expired" slug: hugo_list_expired url: /commands/hugo_list_expired/ @@ -39,4 +39,4 @@ hugo list expired [flags] ### SEE ALSO * [hugo list](/commands/hugo_list/) - Listing out various types of content -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_list_future.md b/content/commands/hugo_list_future.md index 46e472534..51b6089d1 100644 --- a/content/commands/hugo_list_future.md +++ b/content/commands/hugo_list_future.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo list future" slug: hugo_list_future url: /commands/hugo_list_future/ @@ -39,4 +39,4 @@ hugo list future [flags] ### SEE ALSO * [hugo list](/commands/hugo_list/) - Listing out various types of content -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_new.md b/content/commands/hugo_new.md index 25eb3d803..fa4eab688 100644 --- a/content/commands/hugo_new.md +++ b/content/commands/hugo_new.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo new" slug: hugo_new url: /commands/hugo_new/ @@ -47,4 +47,4 @@ hugo new [path] [flags] * [hugo new site](/commands/hugo_new_site/) - Create a new site (skeleton) * [hugo new theme](/commands/hugo_new_theme/) - Create a new theme -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_new_site.md b/content/commands/hugo_new_site.md index 586d4db12..3accfbbea 100644 --- a/content/commands/hugo_new_site.md +++ b/content/commands/hugo_new_site.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo new site" slug: hugo_new_site url: /commands/hugo_new_site/ @@ -42,4 +42,4 @@ hugo new site [path] [flags] ### SEE ALSO * [hugo new](/commands/hugo_new/) - Create new content for your site -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_new_theme.md b/content/commands/hugo_new_theme.md index 355978fc1..928d11b56 100644 --- a/content/commands/hugo_new_theme.md +++ b/content/commands/hugo_new_theme.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo new theme" slug: hugo_new_theme url: /commands/hugo_new_theme/ @@ -41,4 +41,4 @@ hugo new theme [name] [flags] ### SEE ALSO * [hugo new](/commands/hugo_new/) - Create new content for your site -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_server.md b/content/commands/hugo_server.md index 3171a8556..5b58a52f0 100644 --- a/content/commands/hugo_server.md +++ b/content/commands/hugo_server.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo server" slug: hugo_server url: /commands/hugo_server/ @@ -55,6 +55,7 @@ hugo server [flags] -l, --layoutDir string filesystem path to layout directory --meminterval string interval to poll memory usage (requires --memstats), valid time units are "ns", "us" (or "µs"), "ms", "s", "m", "h". (default "100ms") --memstats string log memory usage to this file + --navigateToChanged navigate to changed content file on live browser reload --noChmod don't sync permission mode of files --noTimes don't sync modification time of files --pluralizeListTitles pluralize titles in lists using inflect (default true) @@ -83,4 +84,4 @@ hugo server [flags] ### SEE ALSO * [hugo](/commands/hugo/) - hugo builds your site -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_undraft.md b/content/commands/hugo_undraft.md index 5cac7b401..bb408b80b 100644 --- a/content/commands/hugo_undraft.md +++ b/content/commands/hugo_undraft.md @@ -1,17 +1,17 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo undraft" slug: hugo_undraft url: /commands/hugo_undraft/ --- ## hugo undraft -Undraft changes the content's draft status from 'True' to 'False' +Undraft resets the content's draft status ### Synopsis -Undraft changes the content's draft status from 'True' to 'False' +Undraft resets the content's draft status and updates the date to the current date and time. If the content's draft status is 'False', nothing is done. @@ -39,4 +39,4 @@ hugo undraft path/to/content [flags] ### SEE ALSO * [hugo](/commands/hugo/) - hugo builds your site -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/commands/hugo_version.md b/content/commands/hugo_version.md index d1ee4a4c9..522ff1008 100644 --- a/content/commands/hugo_version.md +++ b/content/commands/hugo_version.md @@ -1,5 +1,5 @@ --- -date: 2017-06-29T08:42:09+02:00 +date: 2017-07-16T23:23:14+02:00 title: "hugo version" slug: hugo_version url: /commands/hugo_version/ @@ -37,4 +37,4 @@ hugo version [flags] ### SEE ALSO * [hugo](/commands/hugo/) - hugo builds your site -###### Auto generated by spf13/cobra on 29-Jun-2017 +###### Auto generated by spf13/cobra on 16-Jul-2017 diff --git a/content/community/contributing.md b/content/community/contributing.md deleted file mode 100644 index 052311911..000000000 --- a/content/community/contributing.md +++ /dev/null @@ -1,111 +0,0 @@ ---- -aliases: -- /doc/contributing/ -- /meta/contributing/ -lastmod: 2015-02-12 -date: 2013-07-01 -menu: - main: - parent: community -next: /tutorials/automated-deployments -prev: /community/mailing-list -title: Contributing to Hugo -weight: 30 ---- - -All contributions to Hugo are welcome. Whether you want to scratch an itch or simply contribute to the project, feel free to pick something from the [roadmap]({{< relref "meta/roadmap.md" >}}) or contact the dev team via the [Forums](https://discourse.gohugo.io/) or [Gitter](https://gitter.im/gohugoio/hugo) about what may make sense to do next. - -You should fork the project and make your changes. *We encourage pull requests to discuss code changes.* - - -When you're ready to create a pull request, be sure to: - - * Have test cases for the new code. If you have questions about how to do it, please ask in your pull request. - * Run `go fmt`. - * Squash your commits into a single commit. `git rebase -i`. It's okay to force update your pull request. - * Run `make check` and ensure it succeeds. [Travis CI](https://travis-ci.org/gohugoio/hugo) and [Appveyor](https://ci.appveyor.com/project/gohugoio/hugo) will runs these checks and fail the build if `make check` fails. - -## Contribution Overview - -We wrote a [detailed guide]({{< relref "tutorials/how-to-contribute-to-hugo.md" >}}) for newcomers that guides you step by step to your first contribution. If you are more experienced, follow the guide below. - - -# Building from source - -## Vendored Dependencies - -Hugo uses [govendor][] to vendor dependencies, but we don't commit the vendored packages themselves to the Hugo git repository. -Therefore, a simple `go get` is not supported since `go get` is not vendor-aware. -You **must use govendor** to fetch Hugo's dependencies. - -## Fetch the Sources - - go get github.com/kardianos/govendor - govendor get github.com/gohugoio/hugo - -## Running Hugo - - cd $HOME/go/src/github.com/gohugoio/hugo - go run main.go - -## Building Hugo - - cd $HOME/go/src/github.com/gohugoio/hugo - make build - # or to install to $HOME/go/bin: - make install - - -# Showcase additions - -You got your new website running and it's powered by Hugo? Great. You can add your website with a few steps to the [showcase](/showcase/). - -First, make sure that you created a [fork](https://help.github.com/articles/fork-a-repo/) of the [`hugoDocs`](https://github.com/gohugoio/hugodocs) repository on GitHub and cloned your fork on your local computer. **Next, create a separate branch for your additions**: - -``` -# You can choose a different descriptive branch name if you like -git checkout -b showcase-addition -``` - -Let's create a new document that contains some metadata of your homepage. Replace `example` in the following examples with something unique like the name of your website. Inside the terminal enter the following commands: - -``` -cd docs -hugo new showcase/example.md -``` - -You should find the new file at `content/showcase/example.md`. Open it in an editor. The file should contain a frontmatter with predefined variables like below: - -``` ---- -date: 2016-02-12T21:01:18+01:00 -description: "" -license: "" -licenseLink: "" -sitelink: http://spf13.com/ -sourceLink: https://github.com/spf13/spf13.com -tags: -- personal -- blog -thumbnail: /img/spf13-tn.jpg -title: example ---- -``` - -Add at least values for `sitelink`, `title`, `description` and a path for `thumbnail`. - -Furthermore, we need to create the thumbnail of your website. **It's important that the thumbnail has the required dimensions of 600px by 400px.** Give your thumbnail a name like `example-tn.png`. Save it under `static/img/`. - -Check a last time that everything works as expected. Start Hugo's built-in server in order to inspect your local copy of the showcase in the browser: - - hugo server - -If everything looks fine, we are ready to commit your additions. For the sake of best practices, please make sure that your commit follows our [code contribution guideline](https://github.com/gohugoio/hugo#code-contribution-guideline). - - git commit -m"Add example.com to the showcase" - -Last but not least, we're ready to create a [pull request](https://github.com/gohugoio/hugoDocs/compare). - -Don't forget to accept the contributor license agreement. Click on the yellow badge in the automatically added comment in the pull request. - -[govendor]: https://github.com/kardianos/govendor diff --git a/content/community/mailing-list.md b/content/community/mailing-list.md deleted file mode 100644 index 3bd9f58bf..000000000 --- a/content/community/mailing-list.md +++ /dev/null @@ -1,51 +0,0 @@ ---- -lastmod: 2015-05-25 -date: 2013-07-01 -menu: - main: - parent: community -next: /community/contributing -prev: /extras/urls -title: Mailing List -weight: 10 ---- - -## Discussion Forum - -Hugo has its own [discussion forum](https://discourse.gohugo.io/) powered by [Discourse](http://www.discourse.org/). - -Please use this for all discussions, questions, etc. - -### Twitter - -Get the latest bite-sized news and themes from the Hugo community on Twitter by following [@gohugoio](http://twitter.com/gohugoio). - -## Mailing List - -Hugo has two mailing lists: - -### Announcements -Very low traffic. Only releases will be emailed here. - -https://groups.google.com/forum/#!forum/hugo-announce - -### Discussion (Archive) - -**This has been replaced with the [Hugo discussion forum](https://discourse.gohugo.io/).** - -It is available for archival purposes. - -https://groups.google.com/forum/#!forum/hugo-discuss - - -## Other Resources - -### GoNuts - -For general Go questions or discussion please refer to the Go mailing list. - -https://groups.google.com/forum/#!forum/golang-nuts - -### GitHub Issues - -https://github.com/gohugoio/hugo/issues diff --git a/content/community/press.md b/content/community/press.md deleted file mode 100644 index c5523d66e..000000000 --- a/content/community/press.md +++ /dev/null @@ -1,141 +0,0 @@ ---- -lastmod: 2017-03-02 -date: 2014-03-24T20:00:00Z -linktitle: Press -notoc: true -title: Press, Blogs and Media Coverage -weight: 20 ---- - -### Help keep this list up to date - -Know of a post, article or tutorial on Hugo? [Add it to this list](https://github.com/gohugoio/hugo/edit/master/docs/content/community/press.md). - -## Press and Articles - -Hugo has been featured in the following Blog Posts, Press and Media. - - -| Title | Author | Date | -| ------ | ------ | -----: | -| [Build, Test, And Deploy Statically Generated Websites With Hugo & CircleCI](https://circleci.com/blog/build-test-deploy-hugo-sites/)| Ricardo N Feliciano | 2017-05-31 | -| [Hugo Easy Gallery - Automagical PhotoSwipe image gallery with a one-line shortcode](https://www.liwen.id.au/heg/)| Li-Wen Yip | 2017-03-25 | -| [Hugo Tutorial: How to Build & Host a (Very Fast) Static E-Commerce Site](https://snipcart.com/blog/hugo-tutorial-static-site-ecommerce) | Snipcart | 2017-03-12 | -| [Automagical image gallery in Hugo with PhotoSwipe and jQuery](https://www.liwen.id.au/photoswipe/)| Li-Wen Yip | 2017-03-04 | -| [Adding Isso Comments to Hugo](https://stiobhart.net/2017-02-24-isso-comments/) | Stíobhart Matulevicz | 2017-02-24 | -| [Zero to HTTP/2 with AWS and Hugo](https://habd.as/zero-to-http-2-aws-hugo/) | Josh Habdas | 2017-02-16 | -| [How to Password Protect a Hugo Site](https://www.aerobatic.com/blog/password-protect-a-hugo-site/) | Aerobatic | 2017-02-19 | -| [Switching from Wordpress to Hugo](http://schnuddelhuddel.de/switching-from-wordpress-to-hugo/) | Mario Martelli | 2017-02-19 | ] -| [Deploy a Hugo site to Aerobatic with CircleCI ](https://www.aerobatic.com/blog/hugo-github-circleci/) | Aerobatic | 2017-02-14 | -| [NPM scripts for building and deploying Hugo site](https://www.aerobatic.com/blog/hugo-npm-buildtool-setup/) | Aerobatic | 2017-02-12 | -| [Getting started with Hugo and the plain-blog theme, on NearlyFreeSpeech.Net](https://www.penwatch.net/cms/get_started_plain_blog/) | Li-aung “Lewis” Yip | 2017-02-12 | -| [Build a Hugo site using Cloud9 IDE and host on App Engine](https://loyall.ch/lab/2017/01/build-a-static-website-with-cloud9-hugo-and-app-engine/)| Pascal Aubort | 2017-02-05 | -| [Hugo Continuous Deployment with Bitbucket Pipelines and Aerobatic](https://www.aerobatic.com/blog/hugo-bitbucket-pipelines/) | Aerobatic | 2017-02-04 | -| [How to use Firebase to host a Hugo site](https://www.m0d3rnc0ad.com/post/static-site-firebase/) | Andrew Cuga | 2017-02-04 | -| [A publishing workflow for teams using static site generators](https://www.keybits.net/post/publishing-workflow-for-teams-using-static-site-generators/) | Tom Atkins | 2017-01-02 | -| [How To Dynamically Use Google Fonts In A Hugo Website](https://stoned.io/web-development/hugo/How-To-Dynamically-Use-Google-Fonts-In-A-Hugo-Website/) | Hash Borgir | 2016-10-27 | -| [Embedding Facebook In A Hugo Template](https://stoned.io/web-development/hugo/Embedding-Facebook-In-A-Hugo-Template/) | Hash Borgir | 2016-10-22 | -| [通过 Gitlab-cl 将 Hugo blog 自动部署至 GitHub](https://zetaoyang.github.io/post/2016/10/17/gitlab-cl.html) (Chinese, Continious integration) | Zetao Yang | 2016-10-17 | -| [A Step-by-Step Guide: Hugo on Netlify](https://www.netlify.com/blog/2016/09/21/a-step-by-step-guide-hugo-on-netlify/) | Eli Williamson | 2016-09-21 | -| [Building our site: From Django & Wordpress to a static generator (Part I)](https://tryolabs.com/blog/2016/09/20/building-our-site-django-wordpress-to-static-part-i/) | Alan Descoins | 2016-09-20 | -| [Webseitenmaschine - Statische Websites mit Hugo erzeugen](http://www.heise.de/ct/ausgabe/2016-12-Statische-Websites-mit-Hugo-erzeugen-3211704.html) (German, $) | Christian Helmbold | 2016-05-27 | -| [Cómo hacer sitios web estáticos con Hugo y Go - Platzi](https://www.youtube.com/watch?v=qaXXpdiCHXE) (Video tutorial) | Verónica López | 2016-04-06 | -| [CDNOverview: A CDN comparison site made with Hugo](https://www.cloakfusion.com/cdnoverview-cdn-comparison-site-made-hugo/) | Thijs de Zoete | 2016-02-23 | -| [Hugo: A Modern WebSite Engine That Just Works](https://github.com/shekhargulati/52-technologies-in-2016/blob/master/07-hugo/README.md) | Shekhar Gulati | 2016-02-14 | -| [Minify Hugo Generated HTML](http://ratson.name/blog/minify-hugo-generated-html/) | Ratson | 2016-02-02 | -| [HugoのデプロイをWerckerからCircle CIに変更した - log](http://log.deprode.net/logs/2016-01-17/) | Deprode | 2016-01-17 | -| [Static site generators: el futuro de las webs estáticas
(Hugo, Jekyll, Flask y otros)](http://sitelabs.es/static-site-generators-futuro-las-webs-estaticas/) | Eneko Sarasola | 2016-01-09 | -| [Writing a Lambda Function for Hugo](https://blog.jolexa.net/post/writing-a-lambda-function-for-hugo/) | Jeremy Olexa | 2016-01-01 | -| [Ein Blog mit Hugo erstellen - Tutorial](http://privat.albicker.org/tags/hugo.html) (Deutsch/German) | Bernhard Albicker | 2015-12-30 | -| [How to host Hugo static website generator on AWS Lambda](http://bezdelev.com/post/hugo-aws-lambda-static-website/) | Ilya Bezdelev | 2015-12-15 | -| [Migrating from Pelican to Hugo](http://www.softinio.com/post/migrating-from-pelican-to-hugo/) | Salar Rahmanian | 2015-11-29 | -| [Static Website Generators Reviewed: Jekyll, Middleman, Roots, Hugo](http://www.smashingmagazine.com/2015/11/static-website-generators-jekyll-middleman-roots-hugo-review/) | Mathias Biilmann Christensen | 2015-11-16 | -| [How To Deploy a Hugo Site to Production with Git Hooks on Ubuntu 14.04](https://www.digitalocean.com/community/tutorials/how-to-deploy-a-hugo-site-to-production-with-git-hooks-on-ubuntu-14-04) | Justin Ellingwood | 2015-11-12 | -| [How To Install and Use Hugo, a Static Site Generator, on Ubuntu 14.04](https://www.digitalocean.com/community/tutorials/how-to-install-and-use-hugo-a-static-site-generator-on-ubuntu-14-04) | Justin Ellingwood | 2015-11-09 | -| [Switching from Wordpress to Hugo](http://justinfx.com/2015/11/08/switching-from-wordpress-to-hugo/) | Justin Israel | 2015-11-08 | -| [Hands-on Experience with Hugo as a Static Site Generator](http://usersnap.com/blog/hands-on-experience-with-hugo-static-site-generator/) | Thomas Peham | 2015 -10-15 | -| [Statische Webseites mit Hugo erstellen/Vortrag mit Foliensatz (deutsch)](http://sfd.koelnerlinuxtreffen.de/2015/HaraldWeidner/) | Harald Weidner | 2015-09-19 | -| [Moving from WordPress to Hugo](http://abhipandey.com/2015/09/moving-to-hugo/) | Abhishek Pandey | 2015-09-15 | -| [通过webhook将Hugo自动部署至GitHub Pages和GitCafe Pages (Automated deployment)](http://blog.coderzh.com/2015/09/13/use-webhook-automated-deploy-hugo/) | CoderZh | 2015-09-13 | -| [使用hugo搭建个人博客站点 (Using Hugo to build a personal blog site)](http://blog.coderzh.com/2015/08/29/hugo/) | CoderZh | 2015-08-29 | -| [Good-Bye Wordpress, Hello Hugo!](http://blog.arminhanisch.de/2015/08/blog-migration-zu-hugo/) (German) | Armin Hanisch | 2015-08-18 | -| [Générer votre site web statique avec Hugo (Generate your static site with Hugo)](http://www.linux-pratique.com/?p=191) | Benoît Benedetti | 2015-06-26 | -| [Hugo向けの新しいテーマを作った (I created a new theme for Hugo)](https://yet.unresolved.xyz/blog/2016/10/03/how-to-make-of-hugo-theme/) | Daisuke Tsuji | 2015-06-20 | -| [Hugo - Gerando um site com conteúdo estático. (Portuguese Brazil)](http://blog.ffrizzo.com/posts/hugo/) | Fabiano Frizzo | 2015-06-02 | -| [An Introduction to Static Site Generators](http://davidwalsh.name/introduction-static-site-generators) | Eduardo Bouças | 2015-05-20 | -| [Hugo Still Rules](http://cheekycoder.com/2015/05/hugo-still-rules/) | Cheeky Coder | 2015-05-18 | -| [hugo - Static Site Generator](http://gscacco.github.io/post/hugo/) | G Scaccoio | 2015-05-04 | -| [WindowsでHugoを使う](http://ureta.net/2015/05/hugo-on-windows/) | うれ太郎 | 2015-05-01 | -| [Hugoのshortcodesを用いてサイトにスライドなどを埋め込む](http://blog.yucchiy.com/2015/04/29/hugo-shortcode/) | Yucchiy | 2015-04-29 | -| [HugoとCircleCIでGitHub PagesにBlogを公開してみたら超簡単だった](http://hori-ryota.github.io/blog/create-blog-with-hugo-and-circleci/) | Hori Ryota | 2015-04-17 | -| [10 Best Static Site Generators](http://beebom.com/2015/04/best-static-site-generators) | Aniruddha Mysore | 2015-04-06 | -| [Goodbye WordPress; Hello Hugo](http://willwarren.com/2015/04/05/goodbye-wordpress-hello-hugo/) | Will Warren | 2015-04-05 | -| [Static Websites with Hugo on Google Cloud Storage](http://www.moxie.io/post/static-websites-with-hugo-on-google-cloud-storage/) | Moxie Input/Output | 2015-04-02 | -| [De nuevo iniciando un blog](https://alvarolizama.net/) | Alvaro Lizama | 2015-03-29 | -| [We moved our blog from Posthaven to Hugo after only three posts. Why?](http://blog.hypriot.com/post/moved-from-posthaven-to-hugo/) | Hypriot | 2015-03-27 | -| [Top Static Site Generators in 2015](http://superdevresources.com/static-site-generators-2015/) | Kanishk Kunal | 2015-03-12 | -| [Moving to Hugo](http://abiosoft.com/moving-to-hugo/) | Abiola Ibrahim | 2015-03-08 | -| [Migrating a blog (yes, this one!) from Wordpress to Hugo](http://justindunham.net/migrating-from-wordpress-to-hugo/) | Justin Dunham | 2015-02-13 | -| [blogをoctopressからHugoに乗り換えたメモ](http://blog.jigyakkuma.org/2015/02/11/hugo/) | jigyakkuma | 2015-02-11 | -| [Hugoでブログをつくった](http://porgy13.github.io/post/new-hugo-blog/) | porgy13 | 2015-02-07 | -| [Hugoにブログを移行した](http://keichi.net/post/first/) | Keichi Takahashi | 2015-02-04 | -| [Hugo静态网站生成器中文教程](http://nanshu.wang/post/2015-01-31/) | Nanshu Wang | 2015-01-31 | -| [Hugo + GitHub Pages + Wercker CI = ¥0（無料）
でコマンド 1 発（自動化）でサイト
・ブログを公開・運営・分析・収益化](http://qiita.com/yoheimuta/items/8a619cac356bed89a4c9) | Yohei Yoshimuta | 2015-01-31 | -| [Running Hugo websites on anynines](http://blog.anynines.com/running-hugo-websites-on-anynines/) | Julian Weber | 2015-01-30 | -| [MiddlemanからHugoへ移行した](http://re-dzine.net/2015/01/hugo/) | Haruki Konishi | 2015-01-21 | -| [WordPress から Hugo に乗り換えました](http://rakuishi.com/archives/wordpress-to-hugo/) | rakuishi | 2015-01-20 | -| [HUGOを使ってサイトを立ち上げる方法](http://qiita.com/syui/items/869538099551f24acbbf) | Syui | 2015-01-17 | -| [Jekyllが許されるのは小学生までだよね](http://t32k.me/mol/log/hugo/) | Ishimoto Koji | 2015-01-16 | -| [Getting started with Hugo](http://anthonyfok.org/post/getting-started-with-hugo/) | Anthony Fok | 2015-01-12 | -| [把这个博客静态化了 (Migrate to Hugo)](http://lich-eng.com/2015/01/03/migrate-to-hugo/)| Li Cheng | 2015-01-03 | -| [Porting my blog with Hugo](http://blog.srackham.com/posts/porting-my-blog-with-hugo/) | Stuart Rackham | 2014-12-30 | -| [Hugoを使ってみたときのメモ](http://machortz.github.io/posts/usinghugo/) | Machortz | 2014-12-29 | -| [OctopressからHugoへ移行した](http://deeeet.com/writing/2014/12/25/hugo/) | Taichi Nakashima | 2014-12-25 | -| [Migrating to Hugo From Octopress](http://nathanleclaire.com/blog/2014/12/22/migrating-to-hugo-from-octopress/) | Nathan LeClaire | 2014-12-22 | -| [Dynamic Pages with GoHugo.io](http://cyrillschumacher.com/2014/12/21/dynamic-pages-with-gohugo.io/) | Cyrill Schumacher | 2014-12-21 | -| [6 Static Blog Generators That Aren’t Jekyll](http://www.sitepoint.com/6-static-blog-generators-arent-jekyll/) | David Turnbull | 2014-12-08 | -| [Travel Blogging Setup](http://www.stou.dk/2014/11/travel-blogging-setup/) | Rasmus Stougaard | 2014-11-23 | -| [Hosting A Hugo Website Behind Nginx](http://www.bigbeeconsultants.co.uk/blog/hosting-hugo-website-behind-nginx) | Rick Beton | 2014-11-20 | -| [使用Hugo搭建免费个人Blog (How to use Hugo)](http://ulricqin.com/post/how-to-use-hugo/) | Ulric Qin 秦晓辉 | 2014-11-11 | -| [Built in Speed and Built for Speed by Hugo](http://cheekycoder.com/2014/10/built-for-speed-by-hugo/) | Cheeky Coder | 2014-10-30 | -| [Hugo para crear sitios web estáticos](http://www.webbizarro.com/noticias/1076/hugo-para-crear-sitios-web-estaticos/) | Web Bizarro | 2014-08-19 | -| [Going with hugo](http://www.markuseliasson.se/article/going-with-hugo/) | Markus Eliasson | 2014-08-18 | -| [Benchmarking Jekyll, Hugo and Wintersmith](http://fredrikloch.me/post/2014-08-12-Jekyll-and-its-alternatives-from-a-site-generation-point-of-view/) | Fredrik Loch | 2014-08-12 | -| [Goodbye Octopress, Hello Hugo!](http://andreimihu.com/blog/2014/08/11/goodbye-octopress-hello-hugo/) | Andrei Mihu | 2014-08-11 | -| [Beautiful sites for Open Source projects](http://beautifulopen.com/2014/08/09/hugo/) | Beautiful Open | 2014-08-09 | -| [Hugo: Beyond the Defaults](http://npf.io/2014/08/hugo-beyond-the-defaults/) | Nate Finch | 2014-08-08 | -| [First Impressions of Hugo](https://peteraba.com/blog/first-impressions-of-hugo/) | Peter Aba | 2014-06-06 | -| [New Site Workflow](http://vurt.co.uk/post/new_website/) | Giles Paterson | 2014-08-05 | -| [How I Learned to Stop Worrying and Love the (Static) Web](http://cognition.ca/post/about-hugo/) | Joshua McKenty | 2014-08-04 | -| [Hugo - Static Site Generator](http://kenwoo.io/blog/hugo---static-site-generator/) | Kenny Woo | 2014-08-03 | -| [Hugo Is Friggin' Awesome](http://npf.io/2014/08/hugo-is-awesome/) | Nate Finch | 2014-08-01 | -| [再次搬家 (Move from WordPress to Hugo)](http://www.chingli.com/misc/move-from-wordpress-to-hugo/) | 青砾 (chingli) | 2014-07-12 | -| [Embedding Gists in Hugo](http://danmux.com/posts/embedded_gists/) | Dan Mull | 2014-07-05 | -| [An Introduction To Hugo](http://www.cirrushosting.com/web-hosting-blog/an-introduction-to-hugo/) | Dan Silber | 2014-07-01 | -| [Moving to Hugo](http://danmux.com/posts/hugo_based_blog/) | Dan Mull | 2014-05-29 | -| [开源之静态站点生成器排行榜
(Leaderboard of open-source static website generators)](http://code.csdn.net/news/2819909) | CSDN.net | 2014-05-23 | -| [Finally, a satisfying and effective blog setup](http://michaelwhatcott.com/now-powered-by-hugo/) | Michael Whatcott | 2014-05-20 | -| [Hugo from scratch](http://zackofalltrades.com/notes/2014/05/hugo-from-scratch/) | Zack Williams | 2014-05-18 | -| [Why I switched away from Jekyll](http://www.jakejanuzelli.com/why-I-switched-away-from-jekyll/) | Jake Januzelli | 2014-05-10 | -| [Welcome our new blog](http://blog.ninya.io/posts/welcome-our-new-blog/) | Ninya.io | 2014-04-11 | -| [Mission Not Accomplished](http://johnsto.co.uk/blog/mission-not-accomplished/) | Dave Johnston | 2014-04-03 | -| [Hugo - A Static Site Builder in Go](http://deepfriedcode.com/post/hugo/) | Deep Fried Code | 2014-03-30 | -| [Adventures in Angular Podcast](http://devchat.tv/adventures-in-angular/003-aia-gdes) | Matias Niemela | 2014-03-28 | -| [Hugo](http://bra.am/post/hugo/) | bra.am | 2014-03-23 | -| [Converting Blogger To Markdown](http://trishagee.github.io/project/atom-to-hugo/) | Trisha Gee | 2014-03-20 | -| [Moving to Hugo Static Web Pages](http://tepid.org/tech/hugo-web/) | Tobias Weingartner | 2014-03-16 | -| [New Blog Engine: Hugo](https://blog.afoolishmanifesto.com/posts/hugo/) | fREW Schmidt | 2014-03-15 | -| [Hugo + gulp.js = Huggle](http://ktmud.github.io/huggle/en/intro/) ([English](http://ktmud.github.io/huggle/en/intro/), [中文](http://ktmud.github.io/huggle/zh/intro/)) | Jesse Yang 杨建超 | 2014-03-08 | -| [Powered by Hugo](http://kieranhealy.org/blog/archives/2014/02/24/powered-by-hugo/) | Kieran Healy | 2014-02-24 | -| [静的サイトを素早く構築するために
GoLangで作られたジェネレータHugo](http://hamasyou.com/blog/2014/02/21/hugo/)|
Shogo Hamada
濱田章吾
| 2014-02-21 | -| [Latest Roundup of Useful Tools For Developers](http://codegeekz.com/latest-roundup-of-useful-tools-for-developers/) | CodeGeekz | 2014-02-13 | -| [Hugo: Static Site Generator written in Go](http://www.braveterry.com/2014/02/06/hugo-static-site-generator-written-in-go/) | Brave Terry | 2014-02-06 | -| [10 Useful HTML5 Tools for Web Designers and Developers](http://designdizzy.com/10-useful-html5-tools-for-web-designers-and-developers/) | Design Dizzy | 2014-02-04 | -| [Hugo – Fast, Flexible Static Site Generator](http://cube3x.com/hugo-fast-flexible-static-site-generator/) | Joby Joseph | 2014-01-18 | -| [Hugo: A new way to build static website](http://www.w3update.com/opensource/hugo-a-new-way-to-build-static-website.html) | w3update | 2014-01-17 | -| [Xaprb now uses Hugo](http://xaprb.com/blog/2014/01/15/using-hugo/) | Baron Schwartz | 2014-01-15 | -| [New jQuery Plugins And Resources That Web Designers Need](http://www.designyourway.net/blog/resources/new-jquery-plugins-and-resources-that-web-designers-need/) | Design Your Way | 2014-01-01 | -| [On Blog Construction](http://alexla.sh/post/on-blog-construction/) | Alexander Lash | 2013-12-27 | -| [Hugo](http://onethingwell.org/post/69070926608/hugo) | One Thing Well | 2013-12-05 | -| [In Praise Of Hugo](http://sound-guru.com/blog/post/hello-world/) | sound-guru.com | 2013-10-19 | -| [Hosting a blog on S3 and Cloudfront](http://www.danesparza.net/2013/07/hosting-a-blog-on-s3-and-cloudfront/) | Dan Esparza | 2013-07-24 | diff --git a/content/content-management/_index.md b/content/content-management/_index.md new file mode 100644 index 000000000..96ff44d2f --- /dev/null +++ b/content/content-management/_index.md @@ -0,0 +1,20 @@ +--- +title: Content Management +linktitle: Content Management Overview +description: Hugo makes managing large static sites easy with support for archetypes, content types, menus, cross references, summaries, and more. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +menu: + docs: + parent: "content-management" + weight: 1 +#tags: [source, organization] +categories: [content management] +weight: 01 #rem +draft: false +aliases: [/content/,/content/organization] +toc: false +--- + +A static site generator needs to extend beyond front matter and a couple templates to be both scalable and *manageable*. Hugo was designed with not only developers in mind, but also content managers and authors. diff --git a/content/content-management/archetypes.md b/content/content-management/archetypes.md new file mode 100644 index 000000000..d6d30b3f3 --- /dev/null +++ b/content/content-management/archetypes.md @@ -0,0 +1,208 @@ +--- +title: Archetypes +linktitle: Archetypes +description: Archetypes allow you to create new instances of content types and set default parameters from the command line. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +#tags: [archetypes,generators,metadata,front matter] +categories: ["content management"] +menu: + docs: + parent: "content-management" + weight: 70 + quicklinks: +weight: 70 #rem +draft: false +aliases: [/content/archetypes/] +toc: true +--- + +{{% note %}} +This section is outdated, see https://github.com/gohugoio/hugoDocs/issues/11 +{{% /note %}} +{{% todo %}} +See above +{{% /todo %}} + +## What are Archetypes? + +**Archetypes** are content files in the [archetypes directory][] of your project that contain preconfigured [front matter][] for your website's [content types][]. Archetypes facilitate consistent metadata across your website content and allow content authors to quickly generate instances of a content type via the `hugo new` command. + +The `hugo new` generator for archetypes assumes your working directory is the content folder at the root of your project. Hugo is able to infer the appropriate archetype by assuming the content type from the content section passed to the CLI command: + +```bash +hugo new / +``` + +We can use this pattern to create a new `.md` file in the `posts` section: + +{{% code file="archetype-example.sh" %}} +```bash +hugo new posts/my-first-post.md +``` +{{% /code %}} + +{{% note "Override Content Type in a New File" %}} +To override the content type Hugo infers from `[content-section]`, add the `--kind` flag to the end of the `hugo new` command. +{{% /note %}} + +Running this command in a new site that does not have default or custom archetypes will create the following file: + +{{% output file="content/posts/my-first-post.md" %}} +```toml ++++ +date = "2017-02-01T19:20:04-07:00" +title = "my first post" +draft = true ++++ +``` +{{% /output %}} + +{{% note %}} +In this example, if you do not already have a `content/posts` directory, Hugo will create both `content/posts/` and `content/posts/my-first-post.md` for you. +{{% /note %}} + +The auto-populated fields are worth examining: + +* `title` is generated from the new content's filename (i.e. in this case, `my-first-post` becomes `"my first post"`) +* `date` and `title` are the variables that ship with Hugo and are therefore included in *all* content files created with the Hugo CLI. `date` is generated in [RFC 3339 format][] by way of Go's [`now()`][] function, which returns the current time. +* The third variable, `draft = true`, is *not* inherited by your default or custom archetypes but is included in Hugo's automatically scaffolded `default.md` archetype for convenience. + +Three variables per content file are often not enough for effective content management of larger websites. Luckily, Hugo provides a simple mechanism for extending the number of variables through custom archetypes, as well as default archetypes to keep content creation DRY. + +## Lookup Order for Archetypes + +Similar to the [lookup order for templates][lookup] in your `layouts` directory, Hugo looks for a section- or type-specific archetype, then a default archetype, and finally an internal archetype that ships with Hugo. For example, Hugo will look for an archetype for `content/posts/my-first-post.md` in the following order: + +1. `archetypes/posts.md` +2. `archetypes/default.md` +3. `themes//archetypes/posts.md` +4. `themes//archetypes/default.md` (Auto-generated with `hugo new site`) + +{{% note "Using a Theme Archetype" %}} +If you wish to use archetypes that ship with a theme, the `theme` field must be specified in your [configuration file](/getting-started/configuration/). +{{% /note %}} + +## Choose Your Archetype's Front Matter Format + +By default, `hugo new` content files include front matter in the TOML format regardless of the format used in `archetypes/*.md`. + +You can specify a different default format in your site [configuration file][] file using the `metaDataFormat` directive. Possible values are `toml`, `yaml`, and `json`. + +## Default Archetypes + +Default archetypes are convenient if your content's front matter stays consistent across multiple [content sections][sections]. + +### Create the Default Archetype + +When you create a new Hugo project using `hugo new site`, you'll notice that Hugo has already scaffolded a file at `archetypes/default.md`. + +The following examples are from a site that's using `tags` and `categories` as [taxonomies][]. If we assume that all content files will require these two key-values, we can create a `default.md` archetype that *extends* Hugo's base archetype. In this example, we are including "golang" and "hugo" as tags and "web development" as a category. + +{{% code file="archetypes/default.md" %}} +```toml ++++ +tags = ["golang", "hugo"] +categories = ["web development"] ++++ +``` +{{% /code %}} + +{{% warning "EOL Characters in Text Editors"%}} +If you get an `EOF error` when using `hugo new`, add a carriage return after the closing `+++` or `---` for your TOML or YAML front matter, respectively. (See the [troubleshooting article on EOF errors](/troubleshooting/eof-error/) for more information.) +{{% /warning %}} + +### Use the Default Archetype + +With an `archetypes/default.md` in place, we can use the CLI to create a new post in the `posts` content section: + +{{% code file="new-post-from-default.sh" %}} +```bash +$ hugo new posts/my-new-post.md +``` +{{% /code %}} + +Hugo then creates a new markdown file with the following front matter: + +{{% output file="content/posts/my-new-post.md" %}} +```toml ++++ +categories = ["web development"] +date = "2017-02-01T19:20:04-07:00" +tags = ["golang", "hugo"] +title = "my new post" ++++ +``` +{{% /output %}} + +We see that the `title` and `date` key-values have been added in addition to the `tags` and `categories` key-values from `archetypes/default.md`. + +{{% note "Ordering of Front Matter" %}} +You may notice that content files created with `hugo new` do not respect the order of the key-values specified in your archetype files. This is a [known issue](https://github.com/gohugoio/hugo/issues/452). +{{% /note %}} + +## Custom Archetypes + +Suppose your site's `posts` section requires more sophisticated front matter than what has been specified in `archetypes/default.md`. You can create a custom archetype for your posts at `archetypes/posts.md` that includes the full set of front matter to be added to the two default archetypes fields. + +### Create a Custom Archetype + +{{% code file="archetypes/posts.md"%}} +```toml ++++ +description = "" +tags = "" +categories = "" ++++ +``` +{{% /code %}} + +### Use a Custom Archetype + +With an `archetypes/posts.md` in place, you can use the Hugo CLI to create a new post with your preconfigured front matter in the `posts` content section: + +{{% code file="new-post-from-custom.sh" %}} +```bash +$ hugo new posts/post-from-custom.md +``` +{{% /code %}} + +This time, Hugo recognizes our custom `archetypes/posts.md` archetype and uses it instead of `archetypes/default.md`. The generated file will now include the full list of front matter parameters, as well as the base archetype's `title` and `date`: + +{{% output file="content/posts/post-from-custom-archetype.md" %}} +```toml ++++ +categories = "" +date = 2017-02-13T17:24:43-08:00 +description = "" +tags = "" +title = "post from custom archetype" ++++ +``` +{{% /output %}} + +### Hugo Docs Custom Archetype + +As an example of archetypes in practice, the following is the `functions` archetype from the Hugo docs: + +{{% code file="archetypes/functions.md" %}} +```yaml +{{< readfile file="/themes/gohugoioTheme/archetypes/functions.md" >}} +``` +{{% /code %}} + +{{% note %}} +The preceding archetype is kept up to date with every Hugo build by using Hugo's [`readFile` function](/functions/readfile/). For similar examples, see [Local File Templates](/templates/files/). +{{% /note %}} + +[archetypes directory]: /getting-started/directory-structure/ +[`now()`]: http://golang.org/pkg/time/#Now +[configuration file]: /getting-started/configuration/ +[sections]: /content-management/sections/ +[content types]: /content-management/types/ +[front matter]: /content-management/front-matter/ +[RFC 3339 format]: https://www.ietf.org/rfc/rfc3339.txt +[taxonomies]: /content-management/taxonomies/ +[lookup]: /templates/lookup/ +[templates]: /templates/ diff --git a/content/content-management/authors.md b/content/content-management/authors.md new file mode 100644 index 000000000..80a783912 --- /dev/null +++ b/content/content-management/authors.md @@ -0,0 +1,193 @@ +--- +title: Authors +linktitle: Authors +description: +date: 2016-08-22 +publishdate: 2017-03-12 +lastmod: 2017-03-12 +#tags: [authors] +categories: ["content management"] +menu: + docs: + parent: "content-management" + weight: 55 +weight: 55 #rem +draft: true +aliases: [/content/archetypes/] +toc: true +comments: Before this page is published, need to also update both site- and page-level variables documentation. +--- + + + +Larger sites often have multiple content authors. Hugo provides standardized author profiles to organize relationships between content and content creators for sites operating under a distributed authorship model. + +## Author Profiles + +You can create a profile containing metadata for each author on your website. These profiles have to be saved under `data/_authors/`. The filename of the profile will later be used as an identifier. This way Hugo can associate content with one or multiple authors. An author's profile can be defined in the JSON, YAML, or TOML format. + +### Example: Author Profile + +Let's suppose Alice Allison is a blogger. A simple unique identifier would be `alice`. Now, we have to create a file called `alice.toml` in the `data/_authors/` directory. The following example is the standardized template written in TOML: + +{{% code file="data/_authors/alice.toml" %}} +```toml +givenName = "Alice" # or firstName as alias +familyName = "Allison" # or lastName as alias +displayName = "Alice Allison" +thumbnail = "static/authors/alice-thumb.jpg" +image = "static/authors/alice-full.jpg" +shortBio = "My name is Alice and I'm a blogger." +bio = "My name is Alice and I'm a blogger... some other stuff" +email = "alice.allison@email.com" +weight = 10 + +[social] + facebook = "alice.allison" + twitter = "alice" + googleplus = "aliceallison1" + website = "www.example.com" + +[params] + random = "whatever you want" +``` +{{% /code %}} + +All variables are optional but it's advised to fill all important ones (e.g. names and biography) because themes can vary in their usage. + +You can store files for the `thumbnail` and `image` attributes in the `static` folder. Then add the path to the photos relative to `static`; e.g., `/static/path/to/thumbnail.jpg`. + +`weight` allows you to define the order of an author in an `.Authors` list and can be accessed on list or via the `.Site.Authors` variable. + +The `social` section contains all the links to the social network accounts of an author. Hugo is able to generate the account links for the most popular social networks automatically. This way, you only have to enter your username. You can find a list of all supported social networks [here](#linking-social-network-accounts-automatically). All other variables, like `website` in the example above remain untouched. + +The `params` section can contain arbitrary data much like the same-named section in the config file. What it contains is up to you. + +## Associate Content Through Identifiers + +Earlier it was mentioned that content can be associated with an author through their corresponding identifier. In our case, blogger Alice has the identifier `alice`. In the front matter of a content file, you can create a list of identifiers and assign it to the `authors` variable. Here are examples for `alice` using YAML and TOML, respectively. + +```yaml +--- +title: Why Hugo is so Awesome +date: 2016-08-22T14:27:502:00 +authors: ["alice"] +--- + +Nothing to read here. Move along... +``` + +```toml ++++ +title = Why Hugo is so Awesome +date = "2016-08-22T14:27:502:00" +authors: ["alice"] ++++ + +Nothing to read here. Move along... +``` + +Future authors who might work on this blog post can append their identifiers to the `authors` array in the front matter as well. + +## Work with Templates + +After a successful setup it's time to give some credit to the authors by showing them on the website. Within the templates Hugo provides a list of the author's profiles if they are listed in the `authors` variable within the front matter. + +The list is accessible via the `.Authors` template variable. Printing all authors of a the blog post is straight forward: + +``` +{{ range .Authors }} + {{ .DisplayName }} +{{ end }} +=> Alice Allison +``` + +Even if there are co-authors you may only want to show the main author. For this case you can use the `.Author` template variable **(note the singular form)**. The template variable contains the profile of the author that is first listed with his identifier in the front matter. + +{{% note %}} +You can find a list of all template variables to access the profile information in [Author Variables](/variables/authors/). +{{% /note %}} + +### Link Social Network Accounts + +As aforementioned, Hugo is able to generate links to profiles of the most popular social networks. The following social networks with their corrersponding identifiers are supported: `github`, `facebook`, `twitter`, `googleplus`, `pinterest`, `instagram`, `youtube` and `linkedin`. + +This is can be done with the `.Social.URL` function. Its only parameter is the name of the social network as they are defined in the profile (e.g. `facebook`, `googleplus`). Custom variables like `website` remain as they are. + +Most articles feature a small section with information about the author at the end. Let's create one containing the author's name, a thumbnail, a (summarized) biography and links to all social networks: + +{{% code file="layouts/partials/author-info.html" download="author-info.html" %}} +```html +{{ with .Author }} +

{{ .DisplayName }}

+ {{ .DisplayName }} +

{{ .ShortBio }}

+
    + {{ range $network, $username := .Social }} +
  • {{ $network }}
    • + {{ end }} +
+{{ end }} +``` +{{% /code %}} + +## Who Published What? + +That question can be answered with a list of all authors and another list containing all articles that they each have written. Now we have to translate this idea into templates. The [taxonomy][] feature allows us to logically group content based on information that they have in common; e.g. a tag or a category. Well, many articles share the same author, so this should sound familiar, right? + +In order to let Hugo know that we want to group content based on their author, we have to create a new taxonomy called `author` (the name corresponds to the variable in the front matter). Here is the snippet in a `config.yaml` and `config.toml`, respectively: + +```yaml +taxonomies: + author: authors +``` + +```toml +[taxonomies] + author = "authors" +``` + + +### List All Authors + +In the next step we can create a template to list all authors of your website. Later, the list can be accessed at `www.example.com/authors/`. Create a new template in the `layouts/taxonomy/` directory called `authors.term.html`. This template will be exclusively used for this taxonomy. + +{{% code file="layouts/taxonomy/author.term.html" download="author.term.html" %}} +```html + +``` +{{% /code %}} + +`.Data.Terms` contains the identifiers of all authors and we can range over it to create a list with all author names. The `$profile` variable gives us access to the profile of the current author. This allows you to generate a nice info box with a thumbnail, a biography and social media links, like at the [end of a blog post](#linking-social-network-accounts-automatically). + +### List Each Author's Publications + +Last but not least, we have to create the second list that contains all publications of an author. Each list will be shown in its own page and can be accessed at `www.example.com/authors/`. Replace `` with a valid author identifier like `alice`. + +The layout for this page can be defined in the template `layouts/taxonomy/author.html`. + +{{% code file="layouts/taxonomy/author.html" download="author.html" %}} +```html +{{ range .Data.Pages }} +

{{ .Title }}

+ written by {{ .Author.DisplayName }} + {{ .Summary }} +{{ end }} +``` +{{% /code %}} + +The example above generates a simple list of all posts written by a single author. Inside the loop you've access to the complete set of [page variables][pagevars]. Therefore, you can add additional information about the current posts like the publishing date or the tags. + +With a lot of content this list can quickly become very long. Consider to use the [pagination][] feature. It splits the list into smaller chunks and spreads them over multiple pages. + +[pagevars]: /variables/page/ +[pagination]: /templates/pagination/ diff --git a/content/content-management/comments.md b/content/content-management/comments.md new file mode 100644 index 000000000..33387e570 --- /dev/null +++ b/content/content-management/comments.md @@ -0,0 +1,84 @@ +--- +title: Comments +linktitle: Comments +description: Hugo ships with an internal Disqus template, but this isn't the only commenting system that will work with your new Hugo website. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-03-09 +#tags: [sections,content,organization] +categories: [project organization, fundamentals] +menu: + docs: + parent: "content-management" + weight: 140 +weight: 140 #rem +draft: false +aliases: [/extras/comments/] +toc: true +--- + +Hugo ships with support for [Disqus](https://disqus.com/), a third-party service that provides comment and community capabilities to websites via JavaScript. + +Your theme may already support Disqus, but if not, it is easy to add to your templates via [Hugo's built-in Disqus partial][disquspartial]. + +## Add Disqus + +Hugo comes with all the code you need to load Disqus into your templates. Before adding Disqus to your site, you'll need to [set up an account][disqussetup]. + +### Configure Disqus + +Disqus comments require you set a single value in your [site's configuration file][configuration]. The following show the configuration variable in a `config.toml` and `config.yml`, respectively: + +```toml +disqusShortname = "yourdiscussshortname" +``` + +```yaml +disqusShortname: "yourdiscussshortname" +``` + +For many websites, this is enough configuration. However, you also have the option to set the following in the [front matter][] of a single content file: + +* `disqus_identifier` +* `disqus_title` +* `disqus_url` + +### Render Hugo's Built-in Disqus Partial Template + +See [Partial Templates][partials] to learn how to add the Disqus partial to your Hugo website's templates. + +## Comments Alternatives + +There are a few alternatives to commenting on static sites for those who do not want to use Disqus: + +* [Static Man](https://staticman.net/) +* [txtpen](https://txtpen.com) +* [IntenseDebate](http://intensedebate.com/) +* [Graph Comment][] +* [Muut](http://muut.com/) +* [isso](http://posativ.org/isso/) (Self-hosted, Python) + * [Tutorial on Implementing Isso with Hugo][issotutorial] + + + + + + + +[configuration]: /getting-started/configuration/ +[disquspartial]: /templates/partials/#disqus +[disqussetup]: https://disqus.com/profile/signup/ +[forum]: https://discourse.gohugo.io +[front matter]: /content-management/front-matter/ +[Graph Comment]: https://graphcomment.com/ +[kaijuissue]: https://github.com/spf13/kaiju/issues/new +[issotutorial]: https://stiobhart.net/2017-02-24-isso-comments/ +[partials]: /templates/partials/ +[MongoDB]: https://www.mongodb.com/ +[tweet]: https://twitter.com/spf13 diff --git a/content/content-management/cross-references.md b/content/content-management/cross-references.md new file mode 100644 index 000000000..9a2795330 --- /dev/null +++ b/content/content-management/cross-references.md @@ -0,0 +1,125 @@ +--- +title: Cross References +description: Hugo makes it easy to link documents together. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-03-31 +categories: [content management] +#tags: ["cross references","references", "anchors", "urls"] +menu: + docs: + parent: "content-management" + weight: 100 +weight: 100 #rem +aliases: [/extras/crossreferences/] +toc: true +--- + + + The `ref` and `relref` shortcodes link documents together, both of which are [built-in Hugo shortcodes][]. These shortcodes are also used to provide links to headings inside of your content, whether across documents or within a document. The only difference between `ref` and `relref` is whether the resulting URL is absolute (`http://1.com/about/`) or relative (`/about/`), respectively. + +## Use `ref` and `relref` + +```md +{{}} +{{}} +{{}} +{{}} +{{}} +{{}} +``` + +The single parameter to `ref` is a string with a content `documentname` (e.g., `about.md`) with or without an appended in-document `anchor` (`#who`) without spaces. + +### Document Names + +The `documentname` is the name of a document, including the format extension; this may be just the filename, or the relative path from the `content/` directory. With a document `content/blog/post.md`, either format will produce the same result: + +```md +{{}} => `/blog/post/` +{{}} => `/blog/post/` +``` + +If you have the same filename used across multiple sections, you should only use the relative path format; otherwise, the behavior will be `undefined`. This is best illustrated with an example `content` directory: + +```bash +. +└── content + ├── events + │   └── my-birthday.md + ├── galleries + │   └── my-birthday.md + ├── meta + │   └── my-article.md + └── posts + └── my-birthday.md +``` + +To be sure to get the correct reference in this case, use the full path: + +{{% code file="content/meta/my-article.md" copy="false" %}} +```md +{{}} => /events/my-birthday/ +``` +{{% /code %}} + +{{< todo >}}Remove this warning when https://github.com/gohugoio/hugo/issues/3703 is released.{{< /todo >}} + +A relative document name must *not* begin with a slash (`/`). +```md +{{}} => "" +``` + +### With Multiple Output Formats + +If the page exists in multiple [output formats][], `ref` or `relref` can be used with a output format name: + +``` + [Neat]({{}}) +``` + +### Anchors + +When an `anchor` is provided by itself, the current page’s unique identifier will be appended; when an `anchor` is provided appended to `documentname`, the found page's unique identifier will be appended: + +```md +{{}} => #anchors:9decaf7 +{{}} => /blog/post/#who:badcafe +``` + +The above examples render as follows for this very page as well as a reference to the "Content" heading in the Hugo docs features pageyoursite + +```md +{{}} => #who:9decaf7 +{{}} => /blog/post/#who:badcafe +``` + +More information about document unique identifiers and headings can be found [below]({{< ref "#hugo-heading-anchors" >}}). + +### Examples + +* `{{}}` => `http://yoursite.com/blog/post/` +* `{{}}` => `http://yoursite.com/blog/post/#tldr:caffebad` +* `{{}}` => `/blog/post/` +* `{{}}` => `/blog/post/#tldr:caffebad` +* `{{}}` => `#tldr:badcaffe` +* `{{}}` => `#tldr:badcaffe` + +## Hugo Heading Anchors + +When using Markdown document types, Hugo generates heading anchors automatically. The generated anchor for this section is `hugo-heading-anchors`. Because the heading anchors are generated automatically, Hugo takes some effort to ensure that heading anchors are unique both inside a document and across the entire site. + +Ensuring heading uniqueness across the site is accomplished with a unique identifier for each document based on its path. Unless a document is renamed or moved between sections *in the filesystem*, the unique identifier for the document will not change: `blog/post.md` will always have a unique identifier of `81df004c333b392d34a49fd3a91ba720`. + +`ref` and `relref` were added so you can make these reference links without having to know the document’s unique identifier. (The links in document tables of contents are automatically up-to-date with this value.) + +```md +{{}} +/content-management/cross-references/#hugo-heading-anchors:77cd9ea530577debf4ce0f28c8dca242 +``` + + +[built-in Hugo shortcodes]: /content-management/shortcodes/#using-the-built-in-shortcodes +[lists]: /templates/lists/ +[output formats]: /templates/output-formats/ +[shortcode]: /content-management/shortcodes/ \ No newline at end of file diff --git a/content/content-management/formats.md b/content/content-management/formats.md new file mode 100644 index 000000000..ae6276db3 --- /dev/null +++ b/content/content-management/formats.md @@ -0,0 +1,249 @@ +--- +title: Supported Content Formats +linktitle: Supported Content Formats +description: Markdown and Emacs Org-Mode have native support, and additional formats (e.g. Asciidoc) come via external helpers. +date: 2017-01-10 +publishdate: 2017-01-10 +lastmod: 2017-04-06 +categories: [content management] +#tags: [markdown,asciidoc,mmark,content format] +menu: + docs: + parent: "content-management" + weight: 20 +weight: 20 #rem +draft: false +aliases: [/content/markdown-extras/,/content/supported-formats/,/doc/supported-formats/,/tutorials/mathjax/] +toc: true +--- + +**Markdown is the main content format** and comes in two flavours: The excellent [Blackfriday project][blackfriday] (name your files `*.md` or set `markup = "markdown"` in front matter) or its fork [Mmark][mmark] (name your files `*.mmark` or set `markup = "mmark"` in front matter), both very fast markdown engines written in Go. + +For Emacs users, [goorgeous](https://github.com/chaseadamsio/goorgeous) provides built-in native support for Org-mode (name your files `*.org` or set `markup = "org"` in front matter) + +{{% note "Deeply Nested Lists" %}} +Before you begin writing your content in markdown, Blackfriday has a known issue [(#329)](https://github.com/russross/blackfriday/issues/329) with handling deeply nested lists. Luckily, there is an easy workaround. Use 4-spaces (i.e., tab) rather than 2-space indentations. +{{% /note %}} + +## Configure BlackFriday Markdown Rendering + +You can configure multiple aspects of Blackfriday as show in the following list. See the docs on [Configuration][config] for the full list of explicit directions you can give to Hugo when rendering your site. + +{{< readfile file="/content/readfiles/bfconfig.md" markdown="true" >}} + +## Extend Markdown + +Hugo provides some convenient methods for extending markdown. + +### Task Lists + +Hugo supports [GitHub-styled task lists (i.e., TODO lists)][gfmtasks] for the Blackfriday markdown renderer. If you do not want to use this feature, you can disable it in your configuration. + +#### Example Task List Input + +{{% code file="content/my-to-do-list.md" %}} +```markdown +- [ ] a task list item +- [ ] list syntax required +- [ ] incomplete +- [x] completed +``` +{{% /code %}} + +#### Example Task List Output + +The preceding markdown produces the following HTML in your rendered website: + +```html +
    +
  • a task list item
    • +
  • list syntax required
    • +
  • incomplete
    • +
  • completed
    • +
+``` + +#### Example Task List Display + +The following shows how the example task list will look to the end users of your website. Note that visual styling of lists is up to you. This list has been styled according to [the Hugo Docs stylesheet][hugocss]. + +- [ ] a task list item +- [ ] list syntax required +- [ ] incomplete +- [x] completed + +### Emojis + +To add emojis directly to content, set `enableEmoji` to `true` in your [site configuration][config]. To use emojis in templates or shortcodes, see [`emojify` function][]. + +For a full list of emojis, see the [Emoji cheat sheet][emojis]. + +### Shortcodes + +If you write in Markdown and find yourself frequently embedding your content with raw HTML, Hugo provides built-in shortcodes functionality. This is one of the most powerful features in Hugo and allows you to create your own Markdown extensions very quickly. + +See [Shortcodes][sc] for usage, particularly for the built-in shortcodes that ship with Hugo, and [Shortcode Templating][sct] to learn how to build your own. + +### Code Blocks + +Hugo supports GitHub-flavored markdown's use of triple back ticks, as well as provides a special [`highlight` nested shortcode][hlsc] to render syntax highlighting via [Pygments][]. For usage examples and a complete explanation, see the [syntax highlighting documentation][hl] in [developer tools][]. + +## Mmark + +Mmark is a [fork of BlackFriday][mmark] and markdown superset that is well suited for writing [IETF documentation][ietf]. You can see examples of the syntax in the [Mmark GitHub repository][mmarkgh] or the full syntax on [Miek Gieben's website][]. + +### Use Mmark + +As Hugo ships with Mmark, using the syntax is as easy as changing the extension of your content files from `.md` to `.mmark`. + +In the event that you want to only use Mmark in specific files, you can also define the Mmark syntax in your content's front matter: + +```yaml +--- +title: My Post +date: 2017-04-01 +markdown: mmark +--- +``` + +{{% warning %}} +Thare are some features not available in Mmark; one example being that shortcodes are not translated when used in an included `.mmark` file ([#3131](https://github.com/gohugoio/hugo/issues/3137)), and `EXTENSION_ABBREVIATION` ([#1970](https://github.com/gohugoio/hugo/issues/1970)) and the aforementioned GFM todo lists ([#2270](https://github.com/gohugoio/hugo/issues/2270)) are not fully supported. Contributions are welcome. +{{% /warning %}} + +## MathJax with Hugo + +[MathJax](http://www.mathjax.org/) is a JavaScript library that allows the display of mathematical expressions described via a LaTeX-style syntax in the HTML (or Markdown) source of a web page. As it is a pure a JavaScript library, getting it to work within Hugo is fairly straightforward, but does have some oddities that will be discussed here. + +This is not an introduction into actually using MathJax to render typeset mathematics on your website. Instead, this page is a collection of tips and hints for one way to get MathJax working on a website built with Hugo. + +### Enable MathJax + +The first step is to enable MathJax on pages that you would like to have typeset math. There are multiple ways to do this (adventurous readers can consult the [Loading and Configuring](http://docs.mathjax.org/en/latest/configuration.html) section of the MathJax documentation for additional methods of including MathJax), but the easiest way is to use the secure MathJax CDN by include a ` +``` +{{% /code %}} + +One way to ensure that this code is included in all pages is to put it in one of the templates that live in the `layouts/partials/` directory. For example, I have included this in the bottom of my template `footer.html` because I know that the footer will be included in every page of my website. + +### Options and Features + +MathJax is a stable open-source library with many features. I encourage the interested reader to view the [MathJax Documentation](http://docs.mathjax.org/en/latest/index.html), specifically the sections on [Basic Usage](http://docs.mathjax.org/en/latest/index.html#basic-usage) and [MathJax Configuration Options](http://docs.mathjax.org/en/latest/index.html#mathjax-configuration-options). + +### Issues with Markdown + +{{% note %}} +The following issues with Markdown assume you are using `.md` for content and BlackFriday for parsing. Using [Mmark](#mmark) as your content format will obviate the need for the following workarounds. + +When using Mmark with MathJax, use `displayMath: [['$$','$$'], ['\\[','\\]']]`. See the [Mmark `README.md`](https://github.com/miekg/mmark/wiki/Syntax#math-blocks) for more information. In addition to MathJax, Mmark has been shown to work well with [KaTeX](https://github.com/Khan/KaTeX). See this [related blog post from a Hugo user](http://nosubstance.me/post/a-great-toolset-for-static-blogging/). +{{% /note %}} + +After enabling MathJax, any math entered between proper markers (see the [MathJax documentation][mathjaxdocs]) will be processed and typeset in the web page. One issue that comes up, however, with Markdown is that the underscore character (`_`) is interpreted by Markdown as a way to wrap text in `emph` blocks while LaTeX (MathJax) interprets the underscore as a way to create a subscript. This "double speak" of the underscore can result in some unexpected and unwanted behavior. + +### Solution + +There are multiple ways to remedy this problem. One solution is to simply escape each underscore in your math code by entering `\_` instead of `_`. This can become quite tedious if the equations you are entering are full of subscripts. + +Another option is to tell Markdown to treat the MathJax code as verbatim code and not process it. One way to do this is to wrap the math expression inside a `
` `
` block. Markdown would ignore these sections and they would get passed directly on to MathJax and processed correctly. This works great for display style mathematics, but for inline math expressions the line break induced by the `
` is not acceptable. The syntax for instructing Markdown to treat inline text as verbatim is by wrapping it in backticks (`` ` ``). You might have noticed, however, that the text included in between backticks is rendered differently than standard text (on this site these are items highlighted in red). To get around this problem, we could create a new CSS entry that would apply standard styling to all inline verbatim text that includes MathJax code. Below I will show the HTML and CSS source that would accomplish this (note this solution was adapted from [this blog post](http://doswa.com/2011/07/20/mathjax-in-markdown.html)---all credit goes to the original author). + +{{% code file="mathjax-markdown-solution.html" %}} +```js + + + +``` +{{% /code %}} + + + +As before, this content should be included in the HTML source of each page that will be using MathJax. The next code snippet contains the CSS that is used to have verbatim MathJax blocks render with the same font style as the body of the page. + +{{% code file="mathjax-style.css" %}} +```css +code.has-jax { + font: inherit; + font-size: 100%; + background: inherit; + border: inherit; + color: #515151; +} +``` +{{% /code %}} + +In the CSS snippet, notice the line `color: #515151;`. `#515151` is the value assigned to the `color` attribute of the `body` class in my CSS. In order for the equations to fit in with the body of a web page, this value should be the same as the color of the body. + +### Usage + +With this setup, everything is in place for a natural usage of MathJax on pages generated using Hugo. In order to include inline mathematics, just put LaTeX code in between `` `$ TeX Code $` `` or `` `\( TeX Code \)` ``. To include display style mathematics, just put LaTeX code in between `
$$TeX Code$$
`. All the math will be properly typeset and displayed within your Hugo generated web page! + +## Additional Formats Through External Helpers + +Hugo has new concept called _external helpers_. It means that you can write your content using [Asciidoc][ascii], [reStructuredText][rest]. If you have files with associated extensions, Hugo will call external commands to generate the content. ([See the Hugo source code for external helpers][helperssource].) + +For example, for Asciidoc files, Hugo will try to call the `asciidoctor` or `asciidoc` command. This means that you will have to install the associated tool on your machine to be able to use these formats. ([See the Asciidoctor docs for installation instructions](http://asciidoctor.org/docs/install-toolchain/)). + +To use these formats, just use the standard extension and the front matter exactly as you would do with natively supported `.md` files. + +{{% warning "Performance of External Helpers" %}} +Because additional formats are external commands generation performance will rely heavily on the performance of the external tool you are using. As this feature is still in its infancy, feedback is welcome. +{{% /warning %}} + +## Learn Markdown + +Markdown syntax is simple enough to learn in a single sitting. The following are excellent resources to get you up and running: + +* [Daring Fireball: Markdown, John Gruber (Creator of Markdown)][fireball] +* [Markdown Cheatsheet, Adam Pritchard][mdcheatsheet] +* [Markdown Tutorial (Interactive), Garen Torikian][mdtutorial] + +[`emojify` function]: /functions/emojify/ +[ascii]: http://asciidoc.org/ +[bfconfig]: /getting-started/configuration/#configuring-blackfriday-rendering +[blackfriday]: https://github.com/russross/blackfriday +[mmark]: https://github.com/miekg/mmark +[config]: /getting-started/configuration/ +[developer tools]: /tools/ +[emojis]: https://www.webpagefx.com/tools/emoji-cheat-sheet/ +[fireball]: https://daringfireball.net/projects/markdown/ +[gfmtasks]: https://guides.github.com/features/mastering-markdown/#syntax +[helperssource]: https://github.com/gohugoio/hugo/blob/77c60a3440806067109347d04eb5368b65ea0fe8/helpers/general.go#L65 +[hl]: /tools/syntax-highlighting/ +[hlsc]: /content-management/shortcodes/#highlight +[hugocss]: /css/style.css +[ietf]: https://tools.ietf.org/html/ +[mathjaxdocs]: https://docs.mathjax.org/en/latest/ +[mdcheatsheet]: https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet +[mdtutorial]: http://www.markdowntutorial.com/ +[Miek Gieben's website]: https://miek.nl/2016/March/05/mmark-syntax-document/ +[mmark]: https://github.com/miekg/mmark +[mmarkgh]: https://github.com/miekg/mmark/wiki/Syntax +[org]: http://orgmode.org/ +[Pygments]: http://pygments.org/ +[rest]: http://docutils.sourceforge.net/rst.html +[sc]: /content-management/shortcodes/ +[sct]: /templates/shortcode-templates/ diff --git a/content/content-management/front-matter.md b/content/content-management/front-matter.md new file mode 100644 index 000000000..104050cf3 --- /dev/null +++ b/content/content-management/front-matter.md @@ -0,0 +1,198 @@ +--- +title: Front Matter +linktitle: +description: Hugo allows you to add front matter in yaml, toml, or json to your content files. +date: 2017-01-09 +publishdate: 2017-01-09 +lastmod: 2017-02-24 +categories: [content management] +#tags: ["front matter", "yaml", "toml", "json", "metadata", "archetypes"] +menu: + docs: + parent: "content-management" + weight: 30 +weight: 30 #rem +draft: false +aliases: [/content/front-matter/] +toc: true +--- + +**Front matter** allows you to keep metadata attached to an instance of a [content type][]---i.e., embedded inside a content file---and is one of the many features that gives Hugo its strength. + +## Front Matter Formats + +Hugo supports three formats for front matter, each with their own identifying tokens. + +TOML +: identified by opening and closing `+++`. + +YAML +: identified by opening and closing `---`. + +JSON +: a single JSON object surrounded by '`{`' and '`}`', followed by a new line. + +### TOML Example + +```toml ++++ +title = "spf13-vim 3.0 release and new website" +description = "spf13-vim is a cross platform distribution of vim plugins and resources for Vim." +tags = [ ".vimrc", "plugins", "spf13-vim", "vim" ] +date = "2012-04-06" +categories = [ + "Development", + "VIM" +] +slug = "spf13-vim-3-0-release-and-new-website" ++++ +``` + +### YAML Example + +```yaml +--- +title: "spf13-vim 3.0 release and new website" +description: "spf13-vim is a cross platform distribution of vim plugins and resources for Vim." +#tags: [ ".vimrc", "plugins", "spf13-vim", "vim" ] +lastmod: 2015-12-23 +date: "2012-04-06" +categories: + - "Development" + - "VIM" +slug: "spf13-vim-3-0-release-and-new-website" +--- +``` + +### JSON Example + +```json +{ + "title": "spf13-vim 3.0 release and new website", + "description": "spf13-vim is a cross platform distribution of vim plugins and resources for Vim.", + "tags": [ ".vimrc", "plugins", "spf13-vim", "vim" ], + "date": "2012-04-06", + "categories": [ + "Development", + "VIM" + ], + "slug": "spf13-vim-3-0-release-and-new-website" +} +``` + +## Front Matter Variables + +### Predefined + +There are a few predefined variables that Hugo is aware of. See [Page Variables][pagevars] for how to call many of these predefined variables in your templates. + +`aliases` +: an array of one or more aliases (e.g., old published paths of renamed content) that will be created in the output directory structure . See [Aliases][aliases] for details. + +`date` +: the datetime at which the content was created; note this value is auto-populated according to Hugo's built-in [archetype][]. + +`description` +: the description for the content. + +`draft` +: if `true`, the content will not be rendered unless the `--buildDrafts` flag is passed to the `hugo` command. + +`expiryDate` +: the datetime at which the content should no longer be published by Hugo; expired content will not be rendered unless the `--buildExpired` flag is passed to the `hugo` command. + +`isCJKLanguage` +: if `true`, Hugo will explicitly treat the content as a CJK language; both `.Summary` and `.WordCount` work properly in CJK languages. + +`keywords` +: the meta keywords for the content. + +`layout` +: the layout Hugo should select from the [lookup order][lookup] when rendering the content. If a `type` is not specified in the front matter, Hugo will look for the layout of the same name in the layout directory that corresponds with a content's section. See ["Defining a Content Type"][definetype] + +`lastmod` +: the datetime at which the content was last modified. + +`linkTitle` +: used for creating links to content; if set, Hugo defaults to using the `linktitle` before the `title`. Hugo can also [order lists of content by `linktitle`][bylinktitle]. + +`markup` +: **experimental**; specify `"rst"` for reStructuredText (requires`rst2html`) or `"md"` (default) for Markdown. + +`outputs` +: allows you to specify output formats specific to the content. See [output formats][outputs]. + +`publishDate` +: if in the future, content will not be rendered unless the `--buildFuture` flag is passed to `hugo`. + +`slug` +: appears as the tail of the output URL. A value specified in front matter will override the segment of the URL based on the filename. + +`taxonomies` +: these will use the field name of the plural form of the index; see the `tags` and `categories` in the above front matter examples. + +`title` +: the title for the content. + +`type` +: the type of the content; this value will be automatically derived from the directory (i.e., the [section][]) if not specified in front matter. + +`url` +: the full path to the content from the web root. It makes no assumptions about the path of the content file. It also ignores any language prefixes of +the multilingual feature. + +`weight` +: used for [ordering your content in lists][ordering]. + +{{% note "Hugo's Default URL Destinations" %}} +If neither `slug` nor `url` is present and [permalinks are not configured otherwise in your site `config` file](/content-management/urls/#permalinks), Hugo will use the filename of your content to create the output URL. See [Content Organization](/content-management/organization) for an explanation of paths in Hugo and [URL Management](/content-management/urls/) for ways to customize Hugo's default behaviors. +{{% /note %}} + +### User-Defined + +You can add fields to your front matter arbitrarily to meet your needs. These user-defined key-values are placed into a single `.Params` variable for use in your templates. + +The following fields can be accessed via `.Params.include_toc` and `.Params.show_comments`, respectively. The [Variables][] section provides more information on using Hugo's page- and site-level variables in your templates. + +```yaml +include_toc: true +show_comments: false +``` + +These two user-defined fields can then be accessed via `.Params.include_toc` and `.Params.show_comments`, respectively. The [Variables][variables] section provides more information on using Hugo's page- and site-level variables in your templates. + + +## Order Content Through Front Matter + +You can assign content-specific `weight` in the front matter of your content. These values are especially useful for [ordering][ordering] in list views. You can use `weight` for ordering of content and the convention of [`_weight`][taxweight] for ordering content within a taxonomy. See [Ordering and Grouping Hugo Lists][lists] to see how `weight` can be used to organize your content in list views. + +## Override Global Markdown Configuration + +It's possible to set some options for Markdown rendering in a content's front matter as an override to the [BlackFriday rendering options set in your project configuration][config]. + +## Front Matter Format Specs + +* [TOML Spec][toml] +* [YAML Spec][yaml] +* [JSON Spec][json] + +[variables]: /variables/ +[aliases]: /content-management/urls/#aliases/ +[archetype]: /content-management/archetypes/ +[bylinktitle]: /templates/lists/#by-link-title +[config]: /getting-started/configuration/ "Hugo documentation for site configuration" +[content type]: /content-management/types/ +[contentorg]: /content-management/organization/ +[definetype]: /content-management/types/#defining-a-content-type "Learn how to specify a type and a layout in a content's front matter" +[json]: /documents/ecma-404-json-spec.pdf "Specification for JSON, JavaScript Object Notation" +[lists]: /templates/lists/#ordering-content "See how to order content in list pages; for example, templates that look to specific _index.md for content and front matter." +[lookup]: /templates/lookup-order/ "Hugo traverses your templates in a specific order when rendering content to allow for DRYer templating." +[ordering]: /templates/lists/ "Hugo provides multiple ways to sort and order your content in list templates" +[outputs]: /templates/output-formats/ "With the release of v22, you can output your content to any text format using Hugo's familiar templating" +[pagevars]: /variables/page/ +[section]: /content-management/sections/ +[taxweight]: /content-management/taxonomies/ +[toml]: https://github.com/toml-lang/toml "Specification for TOML, Tom's Obvious Minimal Language" +[urls]: /content-management/urls/ +[variables]: /variables/ +[yaml]: http://yaml.org/spec/ "Specification for YAML, YAML Ain't Markup Language" diff --git a/content/content-management/menus.md b/content/content-management/menus.md new file mode 100644 index 000000000..ddcf3002e --- /dev/null +++ b/content/content-management/menus.md @@ -0,0 +1,183 @@ +--- +title: Menus +linktitle: Menus +description: Hugo has a simple yet powerful menu system. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-03-31 +categories: [content management] +#tags: [menus] +draft: false +menu: + docs: + parent: "content-management" + weight: 120 +weight: 120 #rem +aliases: [/extras/menus/] +toc: true +--- + +{{% note "Lazy Blogger"%}} +If all you want is a simple menu for your sections, see the ["Section Menu for Lazy Bloggers" in Menu Templates](/templates/menu-templates/#section-menu-for-lazy-blogger). +{{% /note %}} + +You can do this: + +* Place content in one or many menus +* Handle nested menus with unlimited depth +* Create menu entries without being attached to any content +* Distinguish active element (and active branch) + +## What is a Menu in Hugo? + +A **menu** is a named array of menu entries accessible by name via the [`.Site.Menus` site variable][sitevars]. For example, you can access your site's `main` menu via `.Site.Menus.main`. + +{{% note "Menus on Multilingual Sites" %}} +If you make use of the [multilingual feature](/content-management/multilingual/), you can define language-independent menus. +{{% /note %}} + +A menu entry has the following properties (i.e., variables) available to it: + +`.URL` +: string + +`.Name` +: string + +`.Menu` +: string + +`.Identifier` +: string + +`.Pre` +: template.HTML + +`.Post` +: template.HTML + +`.Weight` +: int + +`.Parent` +: string + +`.Children` +: Menu + +Note that menus also have the following functions available as well: + +`.HasChildren` +: boolean + +Additionally, there are some relevant functions available to menus on a page: + +`.IsMenuCurrent` +: (menu string, menuEntry *MenuEntry ) boolean + +`.HasMenuCurrent` +: (menu string, menuEntry *MenuEntry) boolean + +## Add content to menus + +Hugo allows you to add content to a menu via the content's [front matter](/content-management/front-matter/). + +### Simple + +If all you need to do is add an entry to a menu, the simple form works well. + +#### A Single Menu + +```yaml +--- +menu: "main" +--- +``` + +#### Multiple Menus + +```yaml +--- +menu: ["main", "footer"] +--- +``` + +#### Advanced + + +```yaml +--- +menu: + docs: + parent: 'extras' + weight: 20 +--- +``` + +## Add Non-content Entries to a Menu + +You can also add entries to menus that aren’t attached to a piece of content. This takes place in your Hugo project's [`config` file][config]. + +Here’s an example snippet pulled from a `config.toml`: + +{{% code file="config.toml" %}} +```toml +[[menu.main]] + name = "about hugo" + pre = "" + weight = -110 + identifier = "about" + url = "/about/" +[[menu.main]] + name = "getting started" + pre = "" + weight = -100 + url = "/getting-started/" +``` +{{% /code %}} + +Here's the equivalent snippet in a `config.yaml`: + +{{% code file="config.yml" %}} +```yaml +--- +menu: + docs: + - Name: "about hugo" + Pre: "" + Weight: -110 + Identifier: "about" + URL: "/about/" + - Name: "getting started" + Pre: "" + Weight: -100 + URL: "/getting-started/" +--- +``` +{{% /code %}} + +{{% note %}} +The URLs must be relative to the context root. If the `baseURL` is `http://example.com/mysite/`, then the URLs in the menu must not include the context root `mysite`. Using an absolute URL will overide the baseURL. If the value used for `URL` in the above example is `http://subdomain.example.com/`, the output will be `http://subdomain.example.com`. +{{% /note %}} + +## Nesting + +All nesting of content is done via the `parent` field. + +The parent of an entry should be the identifier of another entry. The identifier should be unique (within a menu). + +The following order is used to determine an Identifier: + +`.Name > .LinkTitle > .Title` + +This means that `.Title` will be used unless `.LinkTitle` is present, etc. In practice, `.Name` and `.Identifier` are only used to structure relationships and therefore never displayed. + +In this example, the top level of the menu is defined in your [site `config` file][config]). All content entries are attached to one of these entries via the `.Parent` field. + +## Render Menus + +See [Menu Templates](/templates/menu-templates/) for information on how to render your site menus within your templates. + +[config]: /getting-started/configuration/ +[multilingual]: /content-management/multilingual/ +[sitevars]: /variables/ diff --git a/content/content-management/multilingual.md b/content/content-management/multilingual.md new file mode 100644 index 000000000..58644640d --- /dev/null +++ b/content/content-management/multilingual.md @@ -0,0 +1,300 @@ +--- +title: Multilingual Mode +linktitle: Multilingual and i18n +description: Hugo supports the creation of websites with multiple languages side by side. +date: 2017-01-10 +publishdate: 2017-01-10 +lastmod: 2017-01-10 +categories: [content management] +#tags: [multilingual,i18n, internationalization] +menu: + docs: + parent: "content-management" + weight: 150 +weight: 150 #rem +draft: false +aliases: [/content/multilingual/,/content-management/multilingual/] +toc: true +--- + +You should define the available languages in a `Languages` section in your site configuration. + +## Configure Languages + +The following is an example of a TOML site configuration for a multilingual Hugo project: + +{{% code file="config.toml" download="config.toml" %}} +```toml +DefaultContentLanguage = "en" +copyright = "Everything is mine" + +[params.navigation] +help = "Help" + +[Languages] +[Languages.en] +title = "My blog" +weight = 1 +[Languages.en.params] +linkedin = "english-link" + +[Languages.fr] +copyright = "Tout est à moi" +title = "Mon blog" +weight = 2 +[Languages.fr.params] +linkedin = "lien-francais" +[Languages.fr.navigation] +help = "Aide" +``` +{{% /code %}} + +Anything not defined in a `[Languages]` block will fall back to the global +value for that key (e.g., `copyright` for the English [`en`] language). + +With the configuration above, all content, sitemap, RSS feeds, paginations, +and taxonomy pages will be rendered below `/` in English (your default content language) and then below `/fr` in French. + +When working with front matter `Params` in [single page templates][singles], omit the `params` in the key for the translation. + +If you want all of the languages to be put below their respective language code, enable `defaultContentLanguageInSubdir: true`. + +Only the obvious non-global options can be overridden per language. Examples of global options are `baseURL`, `buildDrafts`, etc. + +## Taxonomies and Blackfriday + +Taxonomies and [Blackfriday configuration][config] can also be set per language: + + +{{% code file="bf-config.toml" %}} +```toml +[Taxonomies] +tag = "tags" + +[blackfriday] +angledQuotes = true +hrefTargetBlank = true + +[Languages] +[Languages.en] +weight = 1 +title = "English" +[Languages.en.blackfriday] +angledQuotes = false + +[Languages.fr] +weight = 2 +title = "Français" +[Languages.fr.Taxonomies] +plaque = "plaques" +``` +{{% /code %}} + +## Translate Your Content + +Translated articles are identified by the name of the content file. + +### Examples of Translated Articles + +1. `/content/about.en.md` +2. `/content/about.fr.md` + +In this eample, the `about.md` will be assigned the configured `defaultContentLanguage`. + +1. `/content/about.md` +2. `/content/about.fr.md` + +This way, you can slowly start to translate your current content without having to rename everything. If left unspecified, the default value for `defaultContentLanguage` is `en`. + +By having the same *base filename*, the content pieces are linked together as translated pieces. + +If you need distinct URLs per language, you can set the slug in the non-default language file. For example, you can define a custom slug for a French translation in the front matter of `content/about.fr.md` as follows: + +```yaml +slug: "a-propos" + +``` + +At render, Hugo will build both `/about/` and `/a-propos/` as properly linked translated pages. + +{{%note %}} +Hugo currently uses the base filename as the translation key, which can be an issue with identical filenames in different sections. +We will fix this in https://github.com/gohugoio/hugo/issues/2699 +{{% /note %}} +{{< todo >}}Rewrite/remove the above one issue is fixed.{{< /todo >}} + +## Link to Translated Content + +To create a list of links to translated content, use a template similar to the following: + +{{% code file="layouts/partials/i18nlist.html" %}} +```html +{{ if .IsTranslated }} +

{{ i18n "translations" }}

+ +{{ end }} +``` +{{% /code %}} + +The above can be put in a `partial` (i.e., inside `layouts/partials/`) and included in any template, be it for a [single content page][contenttemplate] or the [homepage][]. It will not print anything if there are no translations for a given page, or if there are translations---in the case of the homepage, section listing, etc.---a site with only render one language. + +The above also uses the [`i18n` function][i18func] described in the next section. + +## Translation of Strings + +Hugo uses [go-i18n][] to support string translations. [See the project's source repository][go-i18n-source] to find tools that will help you manage your translation workflows. + +Translations are collected from the `themes//i18n/` folder (built into the theme), as well as translations present in `i18n/` at the root of your project. In the `i18n`, the translations will be merged and take precedence over what is in the theme folder. Language files should be named according to [RFC 5646][] with names such as `en-US.toml`, `fr.toml`, etc. + +From within your templates, use the `i18n` function like this: + +``` +{{ i18n "home" }} +``` + +This uses a definition like this one in `i18n/en-US.toml`: + +``` +[home] +other = "Home" +``` + +Often you will want to use to the page variables in the translations strings. To do that, pass on the "." context when calling `i18n`: + +``` +{{ i18n "wordCount" . }} +``` + +This uses a definition like this one in `i18n/en-US.toml`: + +``` +[wordCount] +other = "This article has {{ .WordCount }} words." +``` +An example of singular and plural form: + +``` +[readingTime] +one = "One minute read" +other = "{{.Count}} minutes read" +``` +And then in the template: + +``` +{{ i18n "readingTime" .ReadingTime }} +``` +To track down missing translation strings, run Hugo with the `--i18n-warnings` flag: + +```bash + hugo --i18n-warnings | grep i18n +i18n|MISSING_TRANSLATION|en|wordCount +``` + +## Customize Dates + +At the time of this writing, Golang does not yet have support for internationalized locales, but if you do some work, you can simulate it. For example, if you want to use French month names, you can add a data file like ``data/mois.yaml`` with this content: + +~~~yaml +1: "janvier" +2: "février" +3: "mars" +4: "avril" +5: "mai" +6: "juin" +7: "juillet" +8: "août" +9: "septembre" +10: "octobre" +11: "novembre" +12: "décembre" +~~~ + +... then index the non-English date names in your templates like so: + +~~~html + +~~~ + +This technique extracts the day, month and year by specifying ``.Date.Day``, ``.Date.Month``, and ``.Date.Year``, and uses the month number as a key, when indexing the month name data file. + +## Menus + +You can define your menus for each language independently. The [creation of a menu][menus] works analogous to earlier versions of Hugo, except that they have to be defined in their language-specific block in the configuration file: + +```toml +defaultContentLanguage = "en" + +[languages.en] +weight = 0 +languageName = "English" + +[[languages.en.menu.main]] +url = "/" +name = "Home" +weight = 0 + + +[languages.de] +weight = 10 +languageName = "Deutsch" + +[[languages.de.menu.main]] +url = "/" +name = "Startseite" +weight = 0 +``` + +The rendering of the main navigation works as usual. `.Site.Menus` will just contain the menu of the current language. Pay attention to the generation of the menu links. `absLangURL` takes care that you link to the correct locale of your website. Otherwise, both menu entries would link to the English version as the default content language that resides in the root directory. + +```html +
    + {{- $currentPage := . -}} + {{ range .Site.Menus.main -}} +
  • + {{ .Name }} +
    • + {{- end }} +
+ +``` + +## Missing translations + +If a string does not have a translation for the current language, Hugo will use the value from the default language. If no default value is set, an empty string will be shown. + +While translating a Hugo website, it can be handy to have a visual indicator of missing translations. The [`enableMissingTranslationPlaceholders` configuration option][config] will flag all untranslated strings with the placeholder `[i18n] identifier`, where `identifier` is the id of the missing translation. + +{{% note %}} +Hugo will generate your website with these missing translation placeholders. It might not be suited for production environments. +{{% /note %}} + +## Multilingual Themes support + +To support Multilingual mode in your themes, some considerations must be taken for the URLs in the templates. If there is more than one language, URLs must meet the following criteria: + +* Come from the built-in `.Permalink` or `.URL` +* Be constructed with + * The [`relLangURL` template function][rellangurl] or the [`absLangURL` template function][abslangurl] **OR** + * Prefixed with `{{ .LanguagePrefix }}` + +If there is more than one language defined, the `LanguagePrefix` variable will equal `/en` (or whatever your `CurrentLanguage` is). If not enabled, it will be an empty string and is therefore harmless for single-language Hugo websites. + +[abslangurl]: /functions/abslangurl +[config]: /getting-started/configuration/ +[contenttemplate]: /templates/single-page-templates/ +[go-i18n-source]: https://github.com/nicksnyder/go-i18n +[go-i18n]: https://github.com/nicksnyder/go-i18n +[homepage]: /templates/homepage/ +[i18func]: /functions/i18n/ +[menus]: /content-management/menus/ +[rellangurl]: /functions/rellangurl +[RFC 5646]: https://tools.ietf.org/html/rfc5646 +[singles]: /templates/single-page-templates/ diff --git a/content/content-management/organization.md b/content/content-management/organization.md new file mode 100644 index 000000000..2f6e20740 --- /dev/null +++ b/content/content-management/organization.md @@ -0,0 +1,247 @@ +--- +title: Content Organization +linktitle: Organization +description: Hugo assumes that the same structure that works to organize your source content is used to organize the rendered site. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [content management,fundamentals] +#tags: [sections,content,organization] +menu: + docs: + parent: "content-management" + weight: 10 +weight: 10 #rem +draft: false +aliases: [/content/sections/] +toc: true +--- + +{{% note %}} +This section is not updated with the new nested sections support in Hugo 0.24, see https://github.com/gohugoio/hugoDocs/issues/36 +{{% /note %}} +{{% todo %}} +See above +{{% /todo %}} + +## Organization of Content Source + +In Hugo, your content should be organized in a manner that reflects the rendered website. + +While Hugo supports content nested at any level, the top levels (i.e. `content/`) are special in Hugo and are considered the content [sections][]. Without any additional configuration, the following will just work: + +``` +. +└── content + └── about + | └── _index.md // <- http://yoursite.com/about/ + ├── post + | ├── firstpost.md // <- http://yoursite.com/post/firstpost/ + | ├── happy + | | └── ness.md // <- http://yoursite.com/post/happy/ness/ + | └── secondpost.md // <- http://yoursite.com/post/secondpost/ + └── quote + ├── first.md // <- http://yoursite.com/quote/first/ + └── second.md // <- http://yoursite.com/quote/second/ +``` + +## Path Breakdown in Hugo + +The following demonstrates the relationships between your content organization and the output URL structure for your Hugo website when it renders. These examples assume you are [using pretty URLs][pretty], which is the default behavior for Hugo. The examples also assume a key-value of `baseurl = "http://yoursite.com"` in your [site's configuration file][config]. + +### Index Pages: `_index.md` + +`_index.md` has a special role in Hugo. It allows you to add front matter and content to your [list templates][lists] as of v0.18. These templates include those for [section templates][], [taxonomy templates][], [taxonomy terms templates][], and your [homepage template][]. In your templates, you can grab information from `_index.md` using the [`.Site.GetPage` function][getpage]. + +You can keep one `_index.md` for your homepage and one in each of your content sections, taxonomies, and taxonomy terms. The following shows typical placement of an `_index.md` that would contain content and front matter for a `posts` section list page on a Hugo website: + + +```bash +. url +. ⊢--^-⊣ +. path slug +. ⊢--^-⊣⊢---^---⊣ +. filepath +. ⊢------^------⊣ +content/posts/_index.md +``` + +At build, this will output to the following destination with the associated values: + +```bash + + url ("/posts/") + ⊢-^-⊣ + baseurl section ("posts") +⊢--------^---------⊣⊢-^-⊣ + permalink +⊢----------^-------------⊣ +http://yoursite.com/posts/index.html +``` + +### Single Pages in Sections + +Single content files in each of your sections are going to be rendered as [single page templates][singles]. Here is an example of a single `post` within `posts`: + + +```bash + path ("posts/my-first-hugo-post.md") +. ⊢-----------^------------⊣ +. section slug +. ⊢-^-⊣⊢--------^----------⊣ +content/posts/my-first-hugo-post.md +``` + +At the time Hugo builds your site, the content will be output to the following destination: + +```bash + + url ("/posts/my-first-hugo-post/") + ⊢------------^----------⊣ + baseurl section slug +⊢--------^--------⊣⊢-^--⊣⊢-------^---------⊣ + permalink +⊢--------------------^---------------------⊣ +http://yoursite.com/posts/my-first-hugo-post/index.html +``` + +### Section with Nested Directories + +To continue the example, the following demonstrates destination paths for a file located at `content/events/chicago/lollapalooza.md` in the same site: + + +```bash + section + ⊢--^--⊣ + url + ⊢-------------^------------⊣ + + baseURL path slug +⊢--------^--------⊣ ⊢------^-----⊣⊢----^------⊣ + permalink +⊢----------------------^-----------------------⊣ +http://yoursite.com/events/chicago/lollapalooza/ +``` + +{{% note %}} +As of v0.20, Hugo does not recognize nested sections. While you can nest as many content *directories* as you'd like, any child directory of a section will still be considered the same section as that of its parents. Therefore, in the above example, `{{.Section}}` for `lollapalooza.md` is `events` and *not* `chicago`. See the [related issue on GitHub](https://github.com/gohugoio/hugo/issues/465). +{{% /note %}} + +## Paths Explained + +The following concepts will provide more insight into the relationship between your project's organization and the default behaviors of Hugo when building the output website. + +### `section` + +A default content type is determined by a piece of content's section. `section` is determined by the location within the project's `content` directory. `section` *cannot* be specified or overridden in front matter. + +### `slug` + +A content's `slug` is either `name.extension` or `name/`. The value for `slug` is determined by + +* the name of the content file (e.g., `lollapalooza.md`) OR +* front matter overrides + +### `path` + +A content's `path` is determined by the section's path to the file. The file `path` + +* is based on the path to the content's location AND +* does not include the slug + +### `url` + +The `url` is the relative URL for the piece of content. The `url` + +* is based on the content's location within the directory structure OR +* is defined in front matter and *overrides all the above* + +## Override Destination Paths via Front Matter + +Hugo believes that you organize your content with a purpose. The same structure that works to organize your source content is used to organize the rendered site. As displayed above, the organization of the source content will be mirrored in the destination. + +There are times where you may need more control over your content. In these cases, there are fields that can be specified in the front matter to determine the destination of a specific piece of content. + +The following items are defined in this order for a specific reason: items explained further down in the list will override earlier items, and not all of these items can be defined in front matter: + +### `filename` + +This isn't in the front matter, but is the actual name of the file minus the extension. This will be the name of the file in the destination (e.g., `content/posts/my-post.md` becomes `yoursite.com/posts/my-post/`). + +### `slug` + +When defined in the front matter, the `slug` can take the place of the filename for the destination. + +{{% code file="content/posts/old-post.md" %}} +```yaml +--- +title: New Post +slug: "new-post" +--- +``` +{{% /code %}} + +This will render to the following destination according to Hugo's default behavior: + +``` +yoursite.com/posts/new-post/ +``` + +### `section` + +`section` is determined by a content's location on disk and *cannot* be specified in the front matter. See [sections][] for more information. + +### `type` + +A content's `type` is also determined by its location on disk but, unlike `section`, it *can* be specified in the front matter. See [types][]. This can come in especially handy when you want a piece of content to render using a different layout. In the following example, you can create a layout at `layouts/new/mylayout.html` that Hugo will use to render this piece of content, even in the midst of many other posts. + +{{% code file="content/posts/my-post.md" %}} +```yaml +--- +title: My Post +type: new +layout: mylayout +--- +``` +{{% /code %}} + + + +### `url` + +A complete URL can be provided. This will override all the above as it pertains to the end destination. This must be the path from the baseURL (starting with a `/`). `url` will be used exactly as it provided in the front matter and will ignore the `--uglyURLs` setting in your site configuration: + +{{% code file="content/posts/old-url.md" %}} +```yaml +--- +title: Old URL +url: /blog/new-url/ +--- +``` +{{% /code %}} + +Assuming your `baseURL` is [configured][config] to `https://yoursite.com`, the addition of `url` to the front matter will make `old-url.md` render to the following destination: + +``` +https://yoursite.com/blog/new-url/ +``` + +You can see more information on how to control output paths in [URL Management][urls]. + +[config]: /getting-started/configuration/ +[formats]: /content-management/formats/ +[front matter]: /content-management/front-matter/ +[getpage]: /functions/getpage/ +[homepage template]: /templates/homepage/ +[homepage]: /templates/homepage/ +[lists]: /templates/lists/ +[pretty]: /content-management/urls/#pretty-urls +[section templates]: /templates/section-templates/ +[sections]: /content-management/sections/ +[singles]: /templates/single-page-templates/ +[taxonomy templates]: /templates/taxonomy-templates/ +[taxonomy terms templates]: /templates/taxonomy-templates/ +[types]: /content-management/types/ +[urls]: /content-management/urls/ diff --git a/content/content-management/sections.md b/content/content-management/sections.md new file mode 100644 index 000000000..b7d95d011 --- /dev/null +++ b/content/content-management/sections.md @@ -0,0 +1,73 @@ +--- +title: Content Sections +linktitle: Sections +description: Hugo supports content sections, which according to Hugo's default behavior, will reflect the structure of the rendered website. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [content management] +#tags: [lists,sections,content types,organization] +menu: + docs: + parent: "content-management" + weight: 50 +weight: 50 #rem +draft: false +aliases: [/content/sections/] +toc: true +--- + +{{% note %}} +This section is not updated with the new nested sections support in Hugo 0.24, see https://github.com/gohugoio/hugoDocs/issues/36 +{{% /note %}} +{{% todo %}} +See above +{{% /todo %}} + +Hugo believes that you organize your content with a purpose. The same structure that works to organize your source content is used to organize the rendered site (see [directory structure][]). + +Following this pattern, Hugo uses the top level of your content organization as the content **section**. + +The following example shows a content directory structure for a website that has three sections: "authors," "events," and "posts": + +```bash +. +└── content + ├── authors + | ├── _index.md // <- yoursite.com/authors/ + | ├── john-doe.md // <- yoursite.com/authors/john-doe/ + | └── jane-doe.md // <- yoursite.com/authors/jane-doe/ + └── events + | ├── _index.md // <- yoursite.com/events/ + | ├── event-1.md // <- yoursite.com/events/event-1/ + | ├── event-2.md // <- yoursite.com/events/event-2/ + | └── event-3.md // <- yoursite.com/events/event-3/ + └── posts + | ├── _index.md // <- yoursite.com/posts/ + | ├── event-1.md // <- yoursite.com/posts/event-1/ + | ├── event-2.md // <- yoursite.com/posts/event-2/ + | ├── event-3.md // <- yoursite.com/posts/event-3/ + | ├── event-4.md // <- yoursite.com/posts/event-4/ + | └── event-5.md // <- yoursite.com/posts/event-5/ +``` + +## Content Section Lists + +Hugo will automatically create pages for each section root that list all of the content in that section. See the documentation on [section templates][] for details on customizing the way these pages are rendered. + +As of Hugo v0.18, section pages can also have a content file and front matter. These section content files must be placed in their corresponding section folder and named `_index.md` in order for Hugo to correctly render the front matter and content. + +{{% warning "`index.md` vs `_index.md`" %}} +Hugo themes developed before v0.18 often used an `index.md`(i.e., without the leading underscore [`_`]) in a content section as a hack to emulate the behavior of `_index.md`. The hack may work...*sometimes*; however, the order of page rendering can be unpredictable in Hugo. What works now may fail to render appropriately as your site grows. It is **strongly advised** to use `_index.md` as content for your section index pages. **Note:** `_index.md`'s layout, as representative of a section, is a [list page template](/templates/section-templates/) and *not* a [single page template](/templates/single-page-templates/). If you want to alter the new default behavior for `_index.md`, configure `disableKinds` accordingly in your [site's configuration](/getting-started/configuration/). +{{% /warning %}} + +## Content *Section* vs Content *Type* + +By default, everything created within a section will use the [content type][] that matches the section name. For example, Hugo will assume that `posts/post-1.md` has a `posts` content type. If you are using an [archetype][] for your posts section, Hugo will generate front matter according to what it finds in `archetypes/posts.md`. + +[archetype]: /content-management/archetypes/ +[content type]: /content-management/types/ +[directory structure]: /getting-started/directory-structure/ +[section templates]: /templates/section-templates/ + + diff --git a/content/content-management/shortcodes.md b/content/content-management/shortcodes.md new file mode 100644 index 000000000..2b4467ff8 --- /dev/null +++ b/content/content-management/shortcodes.md @@ -0,0 +1,431 @@ +--- +title: Shortcodes +linktitle: +description: Shortcodes are simple snippets inside your content files calling built-in or custom templates. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-03-31 +menu: + docs: + parent: "content-management" + weight: 35 +weight: 35 #rem +categories: [content management] +#tags: [markdown,content,shortcodes] +draft: false +aliases: [/extras/shortcodes/] +toc: true +--- + +## What a Shortcode is + +Hugo loves Markdown because of its simple content format, but there are times when Markdown falls short. Often, content authors are forced to add raw HTML (e.g., video ``) to Markdown content. We think this contradicts the beautiful simplicity of Markdown's syntax. + +Hugo created **shortcodes** to circumvent these limitations. + +A shortcode is a simple snippet inside a content file that Hugo will render using a predefined template. Note that shortcodes will not work in template files. If you need the type of drop-in functionality that shortcodes provide but in a template, you most likely want a [partial template][partials] instead. + +In addition to cleaner Markdown, shortcodes can be updated any time to reflect new classes, techniques, or standards. At the point of site generation, Hugo shortcodes will easily merge in your changes. You avoid a possibly complicated search and replace operation. + +## Use Shortcodes + +In your content files, a shortcode can be called by calling `{{%/* shortcodename parameters */%}}`. Shortcode parameters are space delimited, and parameters with internal spaces can be quoted. + +The first word in the shortcode declaration is always the name of the shortcode. Parameters follow the name. Depending upon how the shortcode is defined, the parameters may be named, positional, or both, although you can't mix parameter types in a single call. The format for named parameters models that of HTML with the format `name="value"`. + +Some shortcodes use or require closing shortcodes. Again like HTML, the opening and closing shortcodes match (name only) with the closing declaration, which is prepended with a slash. + +Here are two examples of paired shortcodes: + +```md +{{%/* mdshortcode */%}}Stuff to `process` in the *center*.{{%/* /mdshortcode */%}} +``` + +```md +{{}} A bunch of code here {{}} +``` + +The examples above use two different delimiters, the difference being the `%` character in the first and the `<>` characters in the second. + +### Shortcodes with Markdown + +The `%` character indicates that the shortcode's inner content---called in the [shortcode template][sctemps] with the [`.Inner` variable][scvars]---needs further processing by the page's rendering processor (i.e. markdown via Blackfriday). In the following example, Blackfriday would convert `**World**` to `World`: + +```md +{{%/* myshortcode */%}}Hello **World!**{{%/* /myshortcode */%}} +``` + +### Shortcodes Without Markdown + +The `<` character indicates that the shortcode's inner content does *not* need further rendering. Often shortcodes without markdown include internal HTML: + +```md +{{}}

Hello World!

{{}} +``` + +### Nested Shortcodes + +You can call shortcodes within other shortcodes by creating your own templates that leverage the `.Parent` variable. `.Parent` allows you to check the context in which the shortcode is being called. See [Shortcode templates][sctemps]. + +## Use Hugo's Built-in Shortcodes + +Hugo ships with a set of predefined shortcodes that represent very common usage. These shortcodes are provided for author convenience and to keep your markdown content clean. + +### `figure` + +`figure` is an extension of the image syntax in markdown, which does not provide a shorthand for the more semantic [HTML5 `
` element][figureelement]. + +The `figure` shortcode can use the following named parameters: + +* `src` +* `link` +* `title` +* `caption` +* `class` +* `attr` (i.e., attribution) +* `attrlink` +* `alt` + +#### Example `figure` Input + +{{% code file="figure-input-example.md" %}} +```markdown +{{}} +``` +{{% /code %}} + +#### Example `figure` Output + +{{% output file="figure-output-example.html" %}} +```html +
+ +
+

Steve Francia

+
+
+``` +{{% /output %}} + +### `gist` + +Bloggers often want to include GitHub gists when writing posts. Let's suppose we want to use the [gist at the following url][examplegist]: + +```html +https://gist.github.com/spf13/7896402 +``` + +We can embed the gist in our content via username and gist ID pulled from the URL: + +```md +{{}} +``` + +#### Example `gist` Input + +If the gist contains several files and you want to quote just one of them, you can pass the filename (quoted) as an optional third argument: + +{{% code file="gist-input.md" %}} +```md +{{}} +``` +{{% /code %}} + +#### Example `gist` Output + +{{% output file="gist-output.html" %}} +```html +{{< gist spf13 7896402 >}} +``` +{{% /output %}} + +#### Example `gist` Display + +To demonstrate the remarkably efficiency of Hugo's shortcode feature, we have embedded the `spf13` `gist` example in this page. The following simulates the experience for visitors to your website. Naturally, the final display will be contingent on your stylesheets and surrounding markup. + +{{< gist spf13 7896402 >}} + +### `highlight` + +This shortcode will convert the source code provided into syntax-highlighted HTML. Read more on [highlighting](/tools/syntax-highlighting/). `highlight` takes exactly one required `language` parameter and requires a closing shortcode. + +#### Example `highlight` Input + +{{% code file="content/tutorials/learn-html.md" %}} +```html +{{}} +
+
+

{{ .Title }}

+ {{ range .Data.Pages }} + {{ .Render "summary"}} + {{ end }} +
+
+{{}} +``` +{{% /code %}} + +#### Example `highlight` Output + +The `highlight` shortcode example above would produce the following HTML when the site is rendered: + +{{% output file="tutorials/learn-html/index.html" %}} +```html +<section id="main"> + <div> + <h1 id="title">{{ .Title }}</h1> + {{ range .Data.Pages }} + {{ .Render "summary"}} + {{ end }} + </div> +</section> +``` +{{% /output %}} + +{{% note "More on Syntax Highlighting" %}} +To see even more options for adding syntax-highlighted code blocks to your website, see [Syntax Highlighting in Developer Tools](/tools/syntax-highlighting/). +{{% /note %}} + +### `instagram` + +If you'd like to embed a photo from [Instagram][], you only need the photo's ID. You can discern an Instagram photo ID from the URL: + +```html +https://www.instagram.com/p/BWNjjyYFxVx/ +``` + +#### Example `instagram` Input + +{{% code file="instagram-input.md" %}} +```md +{{}} +``` +{{% /code %}} + +You also have the option to hide the caption: + +{{% code file="instagram-input-hide-caption.md" %}} +```md +{{}} +``` +{{% /code %}} + +#### Example `instagram` Output + +By adding the preceding `hidecaption` example, the following HTML will be added to your rendered website's markup: + +{{% output file="instagram-hide-caption-output.html" %}} +```html +{{< instagram BWNjjyYFxVx hidecaption >}} +``` +{{% /output %}} + +#### Example `instagram` Display + +Using the preceding `instagram` with hidecaption` example above, the following simulates the displayed experience for visitors to your website. Naturally, the final display will be contingent on your stylesheets and surrounding markup. + +{{< instagram BWNjjyYFxVx hidecaption >}} + + +### `ref` and `relref` + +These shortcodes will look up the pages by their relative path (e.g., `blog/post.md`) or their logical name (`post.md`) and return the permalink (`ref`) or relative permalink (`relref`) for the found page. + +`ref` and `relref` also make it possible to make fragmentary links that work for the header links generated by Hugo. + +{{% note "More on Cross References" %}} +Read a more extensive description of `ref` and `relref` in the [cross references](/content-management/cross-references/) documentation. +{{% /note %}} + +`ref` and `relref` take exactly one required parameter of _reference_, quoted and in position `0`. + +#### Example `ref` and `relref` Input + +```md +[Neat]({{}}) +[Who]({{}}) +``` + +#### Example `ref` and `relref` Output + +Assuming that standard Hugo pretty URLs are turned on. + +```html +Neat +Who +``` + +### `speakerdeck` + +To embed slides from [Speaker Deck][], click on "< /> Embed" (under Share right next to the template on Speaker Deck) and copy the URL: + +```html + +``` + +#### `speakerdeck` Example Input + +Extract the value from the field `data-id` and pass it to the shortcode: + +{{% code file="speakerdeck-example-input.md" %}} +```md +{{}} +``` +{{% /code %}} + +#### `speakerdeck` Example Output + +{{% output file="speakerdeck-example-input.md" %}} +```html +{{< speakerdeck 4e8126e72d853c0060001f97 >}} +``` +{{% /output %}} + +#### `speakerdeck` Example Display + +For the preceding `speakerdeck` example, the following simulates the displayed experience for visitors to your website. Naturally, the final display will be contingent on your stylesheets and surrounding markup. + +{{< speakerdeck 4e8126e72d853c0060001f97 >}} + +### `tweet` + +You want to include a single tweet into your blog post? Everything you need is the URL of the tweet: + +``` +https://twitter.com/spf13/status/877500564405444608 +``` + +#### Example `tweet` Input + +Pass the tweet's ID from the URL as a parameter to the `tweet` shortcode: + +{{% code file="example-tweet-input.md" %}} +```md +{{}} +``` +{{% /code %}} + +#### Example `tweet` Output + +Using the preceding `tweet` example, the following HTML will be added to your rendered website's markup: + +{{% output file="example-tweet-output.html" %}} +```html +{{< tweet 877500564405444608 >}} +``` +{{% /output %}} + +#### Example `tweet` Display + +Using the preceding `tweet` example, the following simulates the displayed experience for visitors to your website. Naturally, the final display will be contingent on your stylesheets and surrounding markup. + +{{< tweet 877500564405444608 >}} + +### `vimeo` + +Adding a video from [Vimeo][] is equivalent to the YouTube shortcode above. + +``` +https://vimeo.com/channels/staffpicks/146022717 +``` + +#### Example `vimeo` Input + +Extract the ID from the video's URL and pass it to the `vimeo` shortcode: + +{{% code file="example-vimeo-input.md" %}} +```md +{{}} +``` +{{% /code %}} + +#### Example `vimeo` Output + +Using the preceding `vimeo` example, the following HTML will be added to your rendered website's markup: + +{{% output file="example-vimeo-output.html" %}} +```html +{{< vimeo 146022717 >}} +``` +{{% /output %}} + +{{% tip %}} +If you want to further customize the visual styling of the YouTube or Vimeo output, add a `class` named parameter when calling the shortcode. The new `class` will be added to the `
` that wraps the ` -
- -This would be rendered as: - -
- -
- -## Single Named Example: image with caption - - {{}} - -Would load the template /layouts/shortcodes/img.html - - -
- {{ with .Get "link"}}{{ end }} - - {{ if .Get "link"}}{{ end }} - {{ if or (or (.Get "title") (.Get "caption")) (.Get "attr")}} -
{{ if isset .Params "title" }} -

{{ .Get "title" }}

{{ end }} - {{ if or (.Get "caption") (.Get "attr")}}

- {{ .Get "caption" }} - {{ with .Get "attrlink"}} {{ end }} - {{ .Get "attr" }} - {{ if .Get "attrlink"}} {{ end }} -

{{ end }} -
- {{ end }} -
- - -Would be rendered as: - -
- -
-

Steve Francia

-
-
- -## Single Flexible Example: vimeo with defaults - - {{}} - {{}} - -Would load the template /layouts/shortcodes/vimeo.html - - {{ if .IsNamedParams }} -
- -
- {{ else }} -
- -
- {{ end }} - -Would be rendered as: - -
- -
-
- -
- -## Paired Example: Highlight -*Hugo already ships with the `highlight` shortcode* - - {{}} - - This HTML - - {{}} - -The template for this utilizes the following code (already included in Hugo) - - {{ .Get 0 | highlight .Inner }} - -And will be rendered as: - - 
<html>
-        <body> This HTML </body>
-    </html>
-
- -Please notice that this template makes use of a Hugo-specific template function -called `highlight` which uses Pygments to add the highlighting code. - -## Simple Single-word Example: Year - -Let's assume you would like to have a shortcode to be replaced by the current year in your Markdown content files, for a license or copyright statement. Calling a shortcode like this: - - {{}} - -... would load your one-line template ``/layouts/shortcodes/year.html``, which contains: - - {{ .Page.Now.Year }} - -More shortcode examples can be found at [spf13.com](https://github.com/spf13/spf13.com/tree/master/layouts/shortcodes). diff --git a/content/extras/toc.md b/content/extras/toc.md deleted file mode 100644 index 56e093ba7..000000000 --- a/content/extras/toc.md +++ /dev/null @@ -1,37 +0,0 @@ ---- -lastmod: 2015-01-27 -date: 2013-07-09 -menu: - main: - parent: extras -next: /extras/localfiles -prev: /extras/highlighting -title: Table of Contents ---- - -Hugo will automatically parse the Markdown for your content and create -a Table of Contents you can use to guide readers to the sections within -your content. - -## Usage - -Simply create content like you normally would with the appropriate -headers. - -Hugo will take this Markdown and create a table of contents stored in the -[content variable](/layout/variables/) `.TableOfContents` - - -## Template Example - -This is example code of a [single.html template](/layout/content/). - - {{ partial "header.html" . }} -
- {{ .TableOfContents }} -
-

{{ .Title }}

- {{ .Content }} - {{ partial "footer.html" . }} - - diff --git a/content/extras/urls.md b/content/extras/urls.md deleted file mode 100644 index 487e685f3..000000000 --- a/content/extras/urls.md +++ /dev/null @@ -1,70 +0,0 @@ ---- -aliases: -- /doc/urls/ -lastmod: 2016-05-07 -date: 2014-01-03 -menu: - main: - parent: extras -next: /community/mailing-list -notoc: true -prev: /extras/localfiles -title: URLs ---- - -## Pretty URLs - -By default, Hugo creates content with 'pretty' URLs. For example, -content created at `/content/extras/urls.md` will be rendered at -`/public/extras/urls/index.html`, thus accessible from the browser -at http://example.com/extras/urls/. No non-standard server-side -configuration is required for these pretty URLs to work. - -If you would like to have what we call "ugly URLs", -e.g. http://example.com/extras/urls.html, you are in luck. -Hugo supports the ability to create your entire site with ugly URLs. -Simply add `uglyurls = true` to your site-wide `config.toml`, -or use the `--uglyURLs=true` flag on the command line. - -If you want a specific piece of content to have an exact URL, you can -specify this in the front matter under the `url` key. See [Content -Organization](/content/organization/) for more details. - -## Canonicalization - -By default, all relative URLs encountered in the input are left unmodified, -e.g. `/css/foo.css` would stay as `/css/foo.css`, -i.e. `canonifyURLs` defaults to `false`. - -By setting `canonifyURLs` to `true`, all relative URLs would instead -be *canonicalized* using `baseURL`. For example, assuming you have -`baseURL = http://yoursite.example.com/` defined in the site-wide -`config.toml`, the relative URL `/css/foo.css` would be turned into -the absolute URL `http://yoursite.example.com/css/foo.css`. - -Benefits of canonicalization include fixing all URLs to be absolute, which may -aid with some parsing tasks. Note though that all real browsers handle this -client-side without issues. - -Benefits of non-canonicalization include being able to have resource inclusion -be scheme-relative, so that http vs https can be decided based on how this -page was retrieved. - -> Note: In the May 2014 release of Hugo v0.11, the default value of `canonifyURLs` was switched from `true` to `false`, which we think is the better default and should continue to be the case going forward. So, please verify and adjust your website accordingly if you are upgrading from v0.10 or older versions. - -To find out the current value of `canonifyURLs` for your website, you may use the handy `hugo config` command added in v0.13: - - hugo config | grep -i canon - -Or, if you are on Windows and do not have `grep` installed: - - hugo config | FINDSTR /I canon - -## Relative URLs - -By default, all relative URLs are left unchanged by Hugo, -which can be problematic when you want to make your site browsable from a local file system. - -Setting `relativeURLs` to `true` in the site configuration will cause Hugo to rewrite all relative URLs to be relative to the current content. - -For example, if the `/post/first/` page contained a link with a relative URL of `/about/`, Hugo would rewrite that URL to `../../about/`. diff --git a/content/functions/GetPage.md b/content/functions/GetPage.md new file mode 100644 index 000000000..8d659ce16 --- /dev/null +++ b/content/functions/GetPage.md @@ -0,0 +1,67 @@ +--- +title: .GetPage +description: "Gets a `Page` of a given `Kind` and `path`." +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [sections,lists,indexes] +signature: [".GetPage TYPE PATH"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +aliases: [] +--- + +Every `Page` has a `Kind` attribute that shows what kind of page it is. While this attribute can be used to list pages of a certain `kind` using `where`, often it can be useful to fetch a single page by its path. + +`.GetPage` looks up a page of a given `Kind` and `path`. + +``` +{{ with .Site.GetPage "section" "blog" }}{{ .Title }}{{ end }} +``` + +This method wil return `nil` when no page could be found, so the above will not print anything if the blog section isn't found. + +For a regular page: + +``` +{{ with .Site.GetPage "page" "blog" "my-post.md" }}{{ .Title }}{{ end }} +``` + +Note that the path can also be supplied like this: + +``` +{{ with .Site.GetPage "page" "blog/my-post.md" }}{{ .Title }}{{ end }} +``` + +The valid page kinds are: *page, home, section, taxonomy and taxonomyTerm.* + +## `.GetPage` Example + +This code snippet---in the form of a [partial template][partials]---allows you to do the following: + +1. Grab the index object of your `tags` [taxonomy][]. +2. Assign this object to a variable, `$t` +3. Sort the terms associated with the taxonomy by popularity. +4. Grab the top two most popular terms in the taxonomy (i.e., the two most popular tags assigned to content. + +{{% code file="grab-top-two-tags.html" %}} +```html +
    +{{ $t := $.Site.GetPage "taxonomyTerm" "tags" }} +{{ range first 2 $t.Data.Terms.ByCount }} +
  • {{.}}
    • +{{ end }} +
+``` +{{% /code %}} + + +[partials]: /templates/partials/ +[taxonomy]: /content-management/taxonomies/ diff --git a/content/functions/NumFmt.md b/content/functions/NumFmt.md new file mode 100644 index 000000000..6300c8e91 --- /dev/null +++ b/content/functions/NumFmt.md @@ -0,0 +1,34 @@ +--- +title: lang.NumFmt +description: "Formats a number with a given precision using the requested `decimal`, `grouping`, and `negative` characters." +godocref: "" +workson: [] +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +#tags: [numbers] +menu: + docs: + parent: "functions" +toc: false +signature: ["lang.NumFmt "] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +draft: false +aliases: [] +comments: +--- + +The default options value is `- . ,`. + +Numbers greater than or equal to 5 are rounded up. For example, if precision is set to `0`, `1.5` becomes `2`, and `1.4` becomes `1`. + +``` +{{ lang.NumFmt "," "." "-" 2 12345.6789 }} → 12.345,68 +{{ lang.NumFmt "." "" "-" 6 -12345.6789 }} → -12345.678900 +{{ lang.NumFmt "." "," "-" 0 -12345.6789 }} → -12,346 +{{ -98765.4321 | lang.NumFmt "." "," "-" 2 }} → -98,765.43 +``` diff --git a/content/functions/_index.md b/content/functions/_index.md new file mode 100644 index 000000000..7fe800da4 --- /dev/null +++ b/content/functions/_index.md @@ -0,0 +1,20 @@ +--- +title: Functions Quick Reference +linktitle: Functions Quick Reference +description: Comprehensive list of Hugo templating functions, including basic and advanced usage examples. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +#tags: [] +menu: + docs: + parent: "functions" +weight: 01 #rem +draft: false +aliases: [/layout/functions/,/templates/functions] +--- + +Go templates are lightweight but extensible. Go itself supplies built-in functions, including comparison operators and other basic tools. These are listed in the [Go template documentation][gofuncs]. Hugo has added additional functions to the basic template logic. + +[gofuncs]: http://golang.org/pkg/text/template/#hdr-Functions diff --git a/content/functions/abslangurl.md b/content/functions/abslangurl.md new file mode 100644 index 000000000..982508cad --- /dev/null +++ b/content/functions/abslangurl.md @@ -0,0 +1,28 @@ +--- +title: absLangURL +description: Adds the absolute URL with correct language prefix according to site configuration for multilingual. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [multilingual,i18n,urls] +signature: ["absLangURL INPUT"] +workson: [] +hugoversion: +relatedfuncs: [relLangURL] +deprecated: false +aliases: [] +--- + +Both `absLangURL` and [`relLangURL`](/functions/rellangurl/) are similar to their [`absURL`](/functions/absurl/) and [`relURL`](/functions/relurl) relatives but will add the correct language prefix when the site is configured with more than one language. + +So for a site `baseURL` set to `http://yoursite.com/hugo/` and the current language is `en`: + +```golang +{{ "blog/" | absLangURL }} → "http://yoursite.com/hugo/en/blog/" +{{ "blog/" | relLangURL }} → "/hugo/en/blog/" +``` diff --git a/content/functions/absurl.md b/content/functions/absurl.md new file mode 100644 index 000000000..9c08ebf99 --- /dev/null +++ b/content/functions/absurl.md @@ -0,0 +1,53 @@ +--- +title: absURL +description: Creates an absolute URL based on the configured baseURL. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [urls] +signature: ["absURL INPUT"] +workson: [] +hugoversion: +relatedfuncs: [relURL] +deprecated: false +aliases: [] +--- + +Both `absURL` and `relURL` consider the configured value of `baseURL` in your site's [`config` file][configuration]. Given a `baseURL` set to `http://yoursite.com/hugo/`: + +```golang +{{ "mystyle.css" | absURL }} → "http://yoursite.com/hugo/mystyle.css" +{{ "mystyle.css" | relURL }} → "/hugo/mystyle.css" +{{ "http://gohugo.io/" | relURL }} → "http://gohugo.io/" +{{ "http://gohugo.io/" | absURL }} → "http://gohugo.io/" +``` + +The last two examples may look strange but can be very useful. For example, the following shows how to use `absURL` in [JSON-LD structured data (SEO)][jsonld], where some of your images for a piece of content may or may not be hosted locally: + +{{% code file="layouts/partials/schemaorg-metadata.html" download="schemaorg-metadata.html" %}} +```html + +``` +{{% /code %}} + +The above uses the [apply function][] and also exposes how the Go template parser JSON-encodes objects inside ` +``` +{{% /code %}} + +The above uses the [apply function][] and also exposes how the Go template parser JSON-encodes objects inside `` → `` +* `` → `` + diff --git a/content/functions/safeURL.md b/content/functions/safeURL.md new file mode 100644 index 000000000..71fad028b --- /dev/null +++ b/content/functions/safeURL.md @@ -0,0 +1,82 @@ +--- +title: safeURL +description: Declares the provided string as a safe URL or URL substring. +godocref: https://golang.org/pkg/html/template/#HTMLEscape +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +#tags: [strings,urls] +categories: [functions] +menu: + docs: + parent: "functions" +signature: ["safeURL INPUT"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +aliases: [] +--- + +`safeURL` declares the provided string as a "safe" URL or URL substring (see [RFC 3986][]). A URL like `javascript:checkThatFormNotEditedBeforeLeavingPage()` from a trusted source should go in the page, but by default dynamic `javascript:` URLs are filtered out since they are a frequently exploited injection vector. + +Without `safeURL`, only the URI schemes `http:`, `https:` and `mailto:` are considered safe by Go templates. If any other URI schemes (e.g., `irc:` and `javascript:`) are detected, the whole URL will be replaced with `#ZgotmplZ`. This is to "defang" any potential attack in the URL by rendering it useless. + +The following examples use a [site `config.toml`][configuration] with the following [menu entry][menus]: + +{{% code file="config.toml" copy="false" %}} +```toml +[[menu.main]] + name = "IRC: #golang at freenode" + url = "irc://irc.freenode.net/#golang" +``` +{{% /code %}} + +The following is an example of a sidebar partial that may be used in conjunction with the preceding front matter example: + +{{% code file="layouts/partials/bad-url-sidebar-menu.html" copy="false" %}} +```html + +
    + {{ range .Site.Menus.main }} +
  • {{ .Name }}
    • + {{ end }} +
+``` +{{% /code %}} + +This partial would produce the following HTML output: + +{{% output file="bad-url-sidebar-menu-output.html" %}} +```html + + +``` +{{% /output %}} + +The odd output can be remedied by adding ` | safeURL` to our `.Title` page variable: + +{{% code file="layouts/partials/correct-url-sidebar-menu.html" copy="false" %}} +```html + + +``` +{{% /code %}} + +With the `.URL` page variable piped through `safeURL`, we get the desired output: + +{{% output file="correct-url-sidebar-menu-output.html" %}} +```html + +``` +{{% /output %}} + +[configuration]: /getting-started/configuration/ +[menus]: /content-management/menus/ +[RFC 3986]: http://tools.ietf.org/html/rfc3986 diff --git a/content/extras/scratch.md b/content/functions/scratch.md similarity index 64% rename from content/extras/scratch.md rename to content/functions/scratch.md index ae6ea95b6..f69d3b760 100644 --- a/content/extras/scratch.md +++ b/content/functions/scratch.md @@ -1,17 +1,26 @@ --- -aliases: -- /doc/scratch/ -lastmod: 2015-08-02 -date: 2015-01-22 +title: .Scratch +description: Acts as a "scratchpad" to allow for writable page- or shortcode-scoped variables. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +#tags: [iteration] +categories: [functions] menu: - main: - parent: extras -next: /extras/shortcodes -prev: /extras/permalinks -title: Scratch + docs: + parent: "functions" +toc: +signature: [] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +draft: false +aliases: [/extras/scratch/,/doc/scratch/] --- -`Scratch` -- a "scratchpad" for your page-scoped variables. In most cases you can do well without `Scratch`, but there are some use cases that aren't solvable with Go's templates without `Scratch`'s help, due to scoping issues. +In most cases you can do well without `Scratch`, but there are some use cases that aren't solvable with Go's templates without `Scratch`'s help, due to scoping issues. `Scratch` is added to both `Page` and `Shortcode` -- with following methods: @@ -58,6 +67,9 @@ The usage is best illustrated with some samples: {{ $.Scratch.GetSortedMapValues "a3" }} {{/* => []interface {}{"AA", "BB", "CC"} */}} ``` -**Note:** The examples above uses the special `$` variable, which refers to the top-level node. This is the behavior you most likely want, and will help remove some confusion when using `Scratch` inside page range loops -- and you start inadvertently calling the wrong `Scratch`. But there may be use cases for `{{ .Scratch.Add "key" "some value" }}`. +{{% note %}} +The examples above uses the special `$` variable, which refers to the top-level node. This is the behavior you most likely want, and will help remove some confusion when using `Scratch` inside page range loops -- and you start inadvertently calling the wrong `Scratch`. But there may be use cases for `{{ .Scratch.Add "key" "some value" }}`. +{{% /note %}} +[pagevars]: /variables/page/ diff --git a/content/functions/seq.md b/content/functions/seq.md new file mode 100644 index 000000000..f1085326a --- /dev/null +++ b/content/functions/seq.md @@ -0,0 +1,51 @@ +--- +title: seq +# linktitle: +description: Creates a sequence of integers. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [] +signature: ["seq LAST", "seq FIRST LAST", "seq FIRST INCREMENT LAST"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +draft: false +aliases: [] +--- + +It's named and used in the model of [GNU's seq][]. + +``` +3 → 1, 2, 3 +1 2 4 → 1, 3 +-3 → -1, -2, -3 +1 4 → 1, 2, 3, 4 +1 -2 → 1, 0, -1, -2 +``` + +## Example: `seq` with `range` and `after` + +You can use `seq` in combination with `range` and `after`. The following will return 19 elements: + +```golang +{{ range after 1 (seq 20)}} +{{ end }} +``` + +However, when ranging with an index, the following may be less confusing in that `$indexStartingAt1` and `$num` will return `1,2,3 ... 20`: + +```golang +{{ range $index, $num := (seq 20) }} +$indexStartingAt1 := (add $index 1) +{{ end }} +``` + + +[GNU's seq]: http://www.gnu.org/software/coreutils/manual/html_node/seq-invocation.html#seq-invocation diff --git a/content/functions/sha.md b/content/functions/sha.md new file mode 100644 index 000000000..0f15be6aa --- /dev/null +++ b/content/functions/sha.md @@ -0,0 +1,34 @@ +--- +title: sha +# linktitle: sha +description: Hashes the given input and returns either an SHA1 or SHA256 checksum. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [sha,checksum] +signature: ["sha1 INPUT", "sha256 INPUT"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +aliases: [] +--- + +`sha1` hashes the given input and returns its SHA1 checksum. + +```html +{{ sha1 "Hello world, gophers!" }} + +``` + +`sha256` hashes the given input and returns its SHA256 checksum. + +```html +{{ sha256 "Hello world, gophers!" }} + +``` diff --git a/content/functions/shuffle.md b/content/functions/shuffle.md new file mode 100644 index 000000000..b2ba14571 --- /dev/null +++ b/content/functions/shuffle.md @@ -0,0 +1,43 @@ +--- +title: shuffle +# linktitle: +description: Returns a random permutation of a given array or slice. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-04-30 +#tags: [ordering] +categories: [functions] +menu: + docs: + parent: "functions" +signature: ["shuffle COLLECTION"] +workson: [] +hugoversion: +relatedfuncs: [seq] +deprecated: false +draft: false +aliases: [] +--- + +{{% code file="shuffle-input.html" %}} +```html + +
{{ shuffle (seq 1 5) }}
+ +
{{ shuffle (slice "foo" "bar" "buzz") }}
+``` +{{% /code %}} + +This example would return the following: + +{{% output file="shuffle-output.html" %}} +```html + +
2 5 3 1 4
+ +
buzz foo bar
+``` +{{% /output %}} + +This example also makes use of the [slice](/functions/slice/) and [seq](/functions/seq/) functions. diff --git a/content/functions/singularize.md b/content/functions/singularize.md new file mode 100644 index 000000000..6214cc914 --- /dev/null +++ b/content/functions/singularize.md @@ -0,0 +1,25 @@ +--- +title: singularize +# linktitle: singularize +description: Converts a word according to a set of common English singularization rules. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [strings,singular] +signature: ["singularize INPUT"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +aliases: [] +--- + +`{{ "cats" | singularize }}` → "cat" + +See also the `.Data.Singular` [taxonomy variable](/variables/taxonomy/) for singularizing taxonomy names. + diff --git a/content/functions/slice.md b/content/functions/slice.md new file mode 100644 index 000000000..0d5182ba7 --- /dev/null +++ b/content/functions/slice.md @@ -0,0 +1,34 @@ +--- +title: slice +# linktitle: slice +description: Creates a alice (array) of all passed arguments. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [slice, array, interface] +signature: ["slice ITEM..."] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +draft: false +aliases: [] +toc: false +--- + +One use case is the concatenation of elements in combination with the [`delimit` function][]: + +{{% code file="slice.html" %}} +```html +{{ delimit (slice "foo" "bar" "buzz") ", " }} + +``` +{{% /code %}} + + +[`delimit` function]: /functions/delimit/ diff --git a/content/functions/slicestr.md b/content/functions/slicestr.md new file mode 100644 index 000000000..38f4ba086 --- /dev/null +++ b/content/functions/slicestr.md @@ -0,0 +1,27 @@ +--- +title: slicestr +# linktitle: +description: Creates a slice of a half-open range, including start and end indices. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [strings] +signature: ["slicestr STRING START [END]"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +aliases: [] +--- + +For example, 1 and 4 creates a slice including elements 1 through 3. +The `end` index can be omitted; it defaults to the string's length. + +* `{{slicestr "BatMan" 3}}` → "Man" +* `{{slicestr "BatMan" 0 3}}` → "Bat" + diff --git a/content/functions/sort.md b/content/functions/sort.md new file mode 100644 index 000000000..42f5d1e3c --- /dev/null +++ b/content/functions/sort.md @@ -0,0 +1,65 @@ +--- +title: sort +# linktitle: sort +description: Sorts maps, arrays, and slices and returns a sorted slice. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [ordering,sorting,lists] +signature: [] +workson: [lists,taxonomies,terms,groups] +hugoversion: +relatedfuncs: [] +deprecated: false +aliases: [] +--- + +A sorted array of map values will be returned with the keys eliminated. There are two optional arguments: `sortByField` and `sortAsc`. If left blank, sort will sort by keys (for maps) in ascending order as its default behavior. + +```toml ++++ +#tags: [ "tag3", "tag1", "tag2" ] ++++ + +// Site config ++++ +[params.authors] + [params.authors.Derek] + "firstName" = "Derek" + "lastName" = "Perkins" + [params.authors.Joe] + "firstName" = "Joe" + "lastName" = "Bergevin" + [params.authors.Tanner] + "firstName" = "Tanner" + "lastName" = "Linsley" ++++ +``` + +``` +// Use default sort options - sort by key / ascending +Tags: {{ range sort .Params.tags }}{{ . }} {{ end }} + +→ Outputs Tags: tag1 tag2 tag3 + +// Sort by value / descending +Tags: {{ range sort .Params.tags "value" "desc" }}{{ . }} {{ end }} + +→ Outputs Tags: tag3 tag2 tag1 + +// Use default sort options - sort by value / descending +Authors: {{ range sort .Site.Params.authors }}{{ .firstName }} {{ end }} + +→ Outputs Authors: Derek Joe Tanner + +// Use default sort options - sort by value / descending +Authors: {{ range sort .Site.Params.authors "lastName" "desc" }}{{ .lastName }} {{ end }} + +→ Outputs Authors: Perkins Linsley Bergevin +``` + diff --git a/content/functions/split.md b/content/functions/split.md new file mode 100644 index 000000000..cc95aedd4 --- /dev/null +++ b/content/functions/split.md @@ -0,0 +1,24 @@ +--- +title: split +# linktitle: split +description: splits a string into substrings separated by a delimiter +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [strings] +signature: ["split STRING DELIM"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +aliases: [] +--- + +* `{{split "tag1,tag2,tag3" "," }}` → ["tag1" "tag2" "tag3"] + + diff --git a/content/functions/string.md b/content/functions/string.md new file mode 100644 index 000000000..963647ae3 --- /dev/null +++ b/content/functions/string.md @@ -0,0 +1,23 @@ +--- +title: string +# linktitle: string +description: Creates a string from the argument passed to the function +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [strings] +signature: ["string INPUT"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +aliases: [] +--- + +* `{{string "BatMan"}}` → "BatMan" + diff --git a/content/functions/substr.md b/content/functions/substr.md new file mode 100644 index 000000000..089698bb0 --- /dev/null +++ b/content/functions/substr.md @@ -0,0 +1,31 @@ +--- +title: substr +# linktitle: +description: Extracts parts of a string from a specified character's position and returns the specified number of characters. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [strings] +aliases: [] +signature: ["substr STRING START [LENGTH]"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +--- + +It normally takes two parameters: `start` and `length`. It can also take one parameter: `start`, i.e. `length` is omitted, in which case the substring starting from start until the end of the string will be returned. + +To extract characters from the end of the string, use a negative start number. + +In addition, borrowing from the extended behavior described at http://php.net substr, if `length` is given and is negative, that number of characters will be omitted from the end of string. + +``` +{{substr "BatMan" 0 -3}} → "Bat" +{{substr "BatMan" 3 3}} → "Man" +``` diff --git a/content/functions/time.md b/content/functions/time.md new file mode 100644 index 000000000..2d105a3d4 --- /dev/null +++ b/content/functions/time.md @@ -0,0 +1,50 @@ +--- +title: time +linktitle: +description: Converts a timestamp string into a `time.Time` structure. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [dates,time] +signature: ["time INPUT"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +aliases: [] +--- + +`time` converts a timestamp string into a [`time.Time`](https://godoc.org/time#Time) structure so you can access its fields: + +``` +{{ time "2016-05-28" }} → "2016-05-28T00:00:00Z" +{{ (time "2016-05-28").YearDay }} → 149 +{{ mul 1000 (time "2016-05-28T10:30:00.00+10:00").Unix }} → 1464395400000, or Unix time in milliseconds +``` + +## Example: Using `time` to get Month Index + +The following example takes a UNIX timestamp---set as `utimestamp: "1489276800"` in a content's front matter---converts the timestamp (string) to an integer using the [`int` function][int], and then uses [`printf`][] to convert the `Month` property of `time` into an index. + +The following example may be useful when setting up [multilingual sites][multilingual]: + +{{% code file="unix-to-month-integer.html" %}} +```html +{{$time := time (int .Params.addDate)}} +=> $time = 1489276800 +{{$time.Month}} +=> "March" +{{$monthindex := printf "%d" $time.Month }} +=> $monthindex = 3 +``` +{{% /code %}} + + +[int]: /functions/int/ +[multilingual]: /content-management/multilingual/ +[`printf`]: /functions/printf/ diff --git a/content/functions/title.md b/content/functions/title.md new file mode 100644 index 000000000..3ecf1ac34 --- /dev/null +++ b/content/functions/title.md @@ -0,0 +1,25 @@ +--- +title: title +# linktitle: +description: Converts all characters in the provided string to title case. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions,fundamentals] +menu: + docs: + parent: "functions" +#tags: [strings] +signature: ["title INPUT"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +aliases: [] +--- + + +``` +{{title "BatMan"}}` → "Batman" +``` diff --git a/content/functions/trim.md b/content/functions/trim.md new file mode 100644 index 000000000..448b5e23f --- /dev/null +++ b/content/functions/trim.md @@ -0,0 +1,42 @@ +--- +title: trim +# linktitle: +description: Returns a slice of a passed string with all leading and trailing characters from cutset removed. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [strings] +signature: ["trim INPUT CUTSET"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +--- + +``` +{{ trim "++Batman--" "+-" }} → "Batman" +``` + +`trim` *requires* the second argument, which tells the function specifically what to remove from the first argument. There is no default value for the second argument, so **the following usage will not work**: + +``` +{{ trim .Inner}} +``` + +Instead, the following example tells `trim` to remove extra new lines from the content contained in the [shortcode `.Inner` variable][shortcodevars]: + +``` +{{ trim .Inner "\n" }} +``` + +{{% note %}} +Go templates also provide a simple [method for trimming whitespace](/templates/introduction/#whitespace) from either side of a Go tag by including a hyphen (`-`). +{{% /note %}} + + +[shortcodevars]: /variables/shortcodes/ diff --git a/content/functions/truncate.md b/content/functions/truncate.md new file mode 100644 index 000000000..911133fa1 --- /dev/null +++ b/content/functions/truncate.md @@ -0,0 +1,29 @@ +--- +title: truncate +# linktitle: truncate +description: Truncates a text to a max length without cutting words or leaving unclosed HTML tags. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [strings] +signature: ["truncate SIZE INPUT", "truncate SIZE ELLIPSIS INPUT"] +workson: [] +hugoversion: 19 +relatedfuncs: [] +deprecated: false +--- + +Since Go templates are HTML-aware, `truncate` will intelligently handle normal strings vs HTML strings: + +``` +{{ "Keep my HTML" | safeHTML | truncate 10 }}` → Keep my …` +``` + +{{% note %}} +If you have a raw string that contains HTML tags you want to remain treated as HTML, you will need to convert the string to HTML using the [`safeHTML` template function](/functions/safehtml) before sending the value to truncate. Otherwise, the HTML tags will be escaped when passed through the `truncate` function. +{{% /note %}} diff --git a/content/functions/union.md b/content/functions/union.md new file mode 100644 index 000000000..4792fdabf --- /dev/null +++ b/content/functions/union.md @@ -0,0 +1,49 @@ +--- +title: union +# linktitle: union +description: Given two arrays or slices, returns a new array that contains the elements or objects that belong to either or both arrays/slices. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-03-12 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [filtering,lists] +signature: ["union SET1 SET2"] +workson: [] +hugoversion: 0.20 +relatedfuncs: [intersect,where] +deprecated: false +aliases: [] +--- + +Given two arrays (or slices) A and B, this function will return a new array that contains the elements or objects that belong to either A or to B or to both. The elements supported are strings, integers, and floats (only float64). + +```golang +{{ union (slice 1 2 3) (slice 3 4 5) }} + + +{{ union (slice 1 2 3) nil }} + + +{{ union nil (slice 1 2 3) }} + + +{{ union nil nil }} + +``` + + +This is also very useful to use as `OR` filters when combined with where: + +```html +{{ $pages := where .Site.RegularPages "Type" "not in" (slice "page" "about") }} +{{ $pages := $pages | union (where .Site.RegularPages "Params.pinned" true) }} +{{ $pages := $pages | intersect (where .Site.RegularPages "Params.images" "!=" nil) }} +``` + +The above fetches regular pages not of `page` or `about` type unless they are pinned. And finally, we exclude all pages with no `images` set in Page params. + +See [intersect](/functions/intersect) for `AND`. diff --git a/content/functions/uniq.md b/content/functions/uniq.md new file mode 100644 index 000000000..467daeb18 --- /dev/null +++ b/content/functions/uniq.md @@ -0,0 +1,31 @@ +--- +title: uniq +linktitle: uniq +description: Takes in a slice or array and returns a slice with subsequent duplicate elements removed. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [multilingual,i18n,urls] +signature: ["uniq SET"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +aliases: [] +needsexamples: false +--- + +```html +{{ uniq (slice 1 2 3 2) }} +{{ slice 1 2 3 2 | uniq }} + +``` + + + + diff --git a/content/functions/unix.md b/content/functions/unix.md new file mode 100644 index 000000000..2477d5437 --- /dev/null +++ b/content/functions/unix.md @@ -0,0 +1,40 @@ +--- +title: .Unix +draft: false +description: .Unix returns the local Time corresponding to the given Unix time, sec seconds and nsec nanoseconds since January 1, 1970 UTC. +godocref: https://golang.org/search?q=Unix#Functions +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +#tags: [dates,time] +categories: [functions] +menu: + docs: + parent: "functions" +signature: [".Unix"] +workson: [times] +hugoversion: +relatedfuncs: [Format,dateFormat,now,time] +deprecated: false +aliases: [] +--- + +## Example: Time Passed Since Last Modification + +This very simple one-liner uses `now.Unix` to calculate the amount of time that has passed between the `.LastMod` for the current page and the last build of the current page. + +{{% code file="time-passed.html" %}} +```golang +{{ div (sub now.Unix .Lastmod.Unix) 86400 }} +``` +{{% /code %}} + +Since both values are integers, they can be subtracted and then divided by the number of seconds in a day (i.e., `60 * 60 * 24 == 86400`). + +{{% note %}} +Hugo's output is *static*. For the example above to be realistic, the site needs to be built every day. + {{% /note %}} + + + +[partial template]: /templates/partials/ diff --git a/content/functions/upper.md b/content/functions/upper.md new file mode 100644 index 000000000..f12044663 --- /dev/null +++ b/content/functions/upper.md @@ -0,0 +1,30 @@ +--- +title: upper +# linktitle: upper +description: Converts all characters in a string to uppercase +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +#tags: [] +categories: [functions] +menu: + docs: + parent: "functions" +toc: +signature: ["upper INPUT"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +draft: false +aliases: [] +--- + +Note that `upper` can be applied in your templates in more than one way: + +``` +{{ upper "BatMan" }} → "BATMAN" +{{ "BatMan" | upper }} → "BATMAN" +``` + diff --git a/content/functions/urlize.md b/content/functions/urlize.md new file mode 100644 index 000000000..3f57b0211 --- /dev/null +++ b/content/functions/urlize.md @@ -0,0 +1,79 @@ +--- +title: urlize +# linktitle: urlize +description: Takes a string, sanitizes it for usage in URLs, and converts spaces to hyphens. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [urls,strings] +godocref: +signature: ["urlize INPUT"] +hugoversion: +deprecated: false +workson: [] +relatedfuncs: [] +--- + +The following examples pull from a content file with the following front matter: + +{{% code file="content/blog/greatest-city.md" copy="false"%}} +```toml ++++ +title = "The World's Greatest City" +location = "Chicago IL" +tags = ["pizza","beer","hot dogs"] ++++ +``` +{{% /code %}} + +The following might be used as a partial within a [single page template][singletemplate]: + +{{% code file="layouts/partials/content-header.html" download="content-header.html" %}} +```html +
+

{{.Title}}

+ {{ with .Params.location }} + + {{ end }} + + {{ with .Params.tags }} +
    + {{range .}} +
  • + {{ . }} +
    • + {{end}} +
+ {{ end }} +
+``` +{{% /code %}} + +The preceding partial would then output to the rendered page as follows, assuming the page is being built with Hugo's default pretty URLs. + +{{% output file="/blog/greatest-city/index.html" %}} +```html +
+

The World's Greatest City

+ + +
+``` +{{% /output %}} + + +[singletemplate]: /templates/single-page-templates/ diff --git a/content/functions/where.md b/content/functions/where.md new file mode 100644 index 000000000..3b98b13ba --- /dev/null +++ b/content/functions/where.md @@ -0,0 +1,141 @@ +--- +title: where +# linktitle: where +description: Filters an array to only the elements containing a matching value for a given field. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [functions] +menu: + docs: + parent: "functions" +#tags: [filtering] +signature: ["where COLLECTION KEY [OPERATOR] MATCH"] +workson: [lists,taxonomies,terms,groups] +hugoversion: +relatedfuncs: [intersect,first,after,last] +deprecated: false +toc: true +needsexample: true +--- + +`where` filters an array to only the elements containing a matching value for a given field. + +```html +{{ range where .Data.Pages "Section" "post" }} + {{ .Content }} +{{ end }} +``` + +It can be used by dot-chaining the second argument to refer to a nested element of a value. + +```toml ++++ +series: golang ++++ +``` + +```html +{{ range where .Site.Pages "Params.series" "golang" }} + {{ .Content }} +{{ end }} +``` + +It can also be used with the logical operators `!=`, `>=`, `in`, etc. Without an operator, `where` compares a given field with a matching value equivalent to `=`. + +```html +{{ range where .Data.Pages "Section" "!=" "post" }} + {{ .Content }} +{{ end }} +``` + +The following logical operators are vailable with `where`: + +`=`, `==`, `eq` +: `true` if a given field value equals a matching value + +`!=`, `<>`, `ne` +: `true` if a given field value doesn't equal a matching value + +`>=`, `ge` +: `true` if a given field value is greater than or equal to a matching value + +`>`, `gt` +: `true` if a given field value is greater than a matching value + +`<=`, `le` +: `true` if a given field value is lesser than or equal to a matching value + +`<`, `lt` +: `true` if a given field value is lesser than a matching value + +`in` +: `true` if a given field value is included in a matching value; a matching value must be an array or a slice + +`not in` +: `true` if a given field value isn't included in a matching value; a matching value must be an array or a slice + +`intersect` +: `true` if a given field value that is a slice/array of strings or integers contains elements in common with the matching value; it follows the same rules as the [`intersect` function][intersect]. + +## Use `where` with `intersect` + +```html +{{ range where .Site.Pages ".Params.tags" "intersect" .Params.tags }} + {{ if ne .Permalink $.Permalink }} + {{ .Render "summary" }} + {{ end }} +{{ end }} +``` + +You can also put the returned value of the `where` clauses into a variable: + +{{% code file="where-intersect-variables.html" %}} +```html +{{ $v1 := where .Site.Pages "Params.a" "v1" }} +{{ $v2 := where .Site.Pages "Params.b" "v2" }} +{{ $filtered := $v1 | intersect $v2 }} +{{ range $filtered }} +{{ end }} +``` +{{% /code %}} + +## Use `where` with `first` + +The following grabs the first five content files in `post` using the [default ordering](/templates/lists/) for lists (i.e., `weight => date`): + +{{% code file="where-with-first.html" %}} +```html +{{ range first 5 (where .Data.Pages "Section" "post") }} + {{ .Content }} +{{ end }} +``` +{{% /code %}} + +## Nest `where` Clauses + +You can also nest `where` clauses to drill down on lists of content by more than one parameter. The following first grabs all pages in the "blog" section and then ranges through the result of the first `where` clause and finds all pages that are *not* featured: + +```html +{{ range where (where .Data.Pages "Section" "blog" ) ".Params.featured" "!=" "true" }} +``` + +## Unset Fields + +Filtering only works for set fields. To check whether a field is set or exists, you can use the operand `nil`. + +This can be useful to filter a small amount of pages from a large pool. Instead of set field on all pages, you can set field on required pages only. + +Only the following operators are available for `nil` + +* `=`, `==`, `eq`: True if the given field is not set. +* `!=`, `<>`, `ne`: True if the given field is set. + +```html +{{ range where .Data.Pages ".Params.specialpost" "!=" nil }} + {{ .Content }} +{{ end }} +``` + +[intersect]: /functions/intersect/ diff --git a/content/functions/with.md b/content/functions/with.md new file mode 100644 index 000000000..42abcbbbf --- /dev/null +++ b/content/functions/with.md @@ -0,0 +1,33 @@ +--- +title: with +# linktitle: with +description: Rebinds the context (`.`) within its scope and skips the block if the variable is absent. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-03-12 +categories: [functions,fundamentals] +menu: + docs: + parent: "functions" +#tags: [conditionals] +signature: ["with INPUT"] +workson: [] +hugoversion: +relatedfuncs: [] +deprecated: false +--- + +An alternative way of writing an `if` statement and then referencing the same value is to use `with` instead. `with` rebinds the context (`.`) within its scope and skips the block if the variable is absent or unset. + +The following example checks for a [user-defined site variable](/variables/site/) called `twitteruser`. If the key-value is not set, the following will render nothing: + +{{% code file="layouts/partials/twitter.html" %}} +```html +{{with .Site.Params.twitteruser}}{{end}} +``` +{{% /code %}} diff --git a/content/getting-started/_index.md b/content/getting-started/_index.md new file mode 100644 index 000000000..7946fdb26 --- /dev/null +++ b/content/getting-started/_index.md @@ -0,0 +1,23 @@ +--- +title: Getting Started +linktitle: Getting Started Overview +description: Quick start and guides for installing Hugo on your preferred operating system. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [getting started] +#tags: [usage,docs] +menu: + docs: + parent: "getting-started" + weight: 1 +weight: 0001 #rem +draft: false +aliases: [/overview/introduction/] +toc: false +--- + +If this is your first time using Hugo and you've [already installed Hugo on your machine][installed], we recommend the [quick start][]. + +[installed]: /getting-started/installing/ +[quick start]: /getting-started/quick-start/ diff --git a/content/getting-started/configuration.md b/content/getting-started/configuration.md new file mode 100644 index 000000000..43baa0f0c --- /dev/null +++ b/content/getting-started/configuration.md @@ -0,0 +1,401 @@ +--- +title: Configuring Hugo +linktitle: Configuration +description: Often the default settings are good enough, but the config file can provide highly granular control over how your site is rendered. +date: 2013-07-01 +publishdate: 2017-01-02 +lastmod: 2017-03-05 +categories: [getting started,fundamentals] +#tags: [configuration,toml,yaml,json] +menu: + docs: + parent: "getting-started" + weight: 60 +weight: 60 +sections_weight: 60 +draft: false +aliases: [/overview/source-directory/,/overview/configuration/] +toc: true +--- + +The [directory structure][] of a Hugo website—or more precisely, the source organization of files containing the website's content and templates—provides most of the configuration information that Hugo needs in order to generate a finished website. + +Because of Hugo's sensible defaults, many websites may not need a configuration file. Hugo is designed to recognize certain typical usage patterns. + +## Configuration Lookup Order + +Similar to the template [lookup order][], Hugo has a default set of rules for searching for a configuration file in the root of your website's source directory as a default behavior: + +1. `./config.toml` +2. `./config.yaml` +3. `./config.json` + +In your `config` file, you can direct Hugo as to how you want your website rendered, control your website's menus, and arbitrarily define site-wide parameters specific to your project. + +## YAML Configuration + +The following is a typical example of a YAML configuration file. Note the document opens with 3 hyphens and closes with 3 periods. The values nested under `params:` will populate the [`.Site.Params`][] variable for use in [templates][]: + +{{% code file="config.yml"%}} +```yaml +--- +baseURL: "https://yoursite.example.com/" +title: "My Hugo Site" +footnoteReturnLinkContents: "↩" +permalinks: + post: /:year/:month/:title/ +params: + Subtitle: "Hugo is Absurdly Fast!" + AuthorName: "Jon Doe" + GitHubUser: "spf13" + ListOfFoo: + - "foo1" + - "foo2" + SidebarRecentLimit: 5 +... +``` +{{% /code %}} + +### All Variables, YAML + +The following is the full list of Hugo-defined variables in an example YAML file. The values provided in this example represent the default values used by Hugo. + +{{% code file="config.yml" download="config.yml" %}} +```yaml +--- +archetypeDir: "archetypes" +# hostname (and path) to the root, e.g. http://spf13.com/ +baseURL: "" +# include content marked as draft +buildDrafts: false +# include content with publishdate in the future +buildFuture: false +# include content already expired +buildExpired: false +# enable this to make all relative URLs relative to content root. Note that this does not affect absolute URLs. See the "URL Management" page +relativeURLs: false +canonifyURLs: false +# config file (default is path/config.yaml|json|toml) +config: "config.toml" +contentDir: "content" +dataDir: "data" +defaultExtension: "html" +defaultLayout: "post" +# Missing translations will default to this content language +defaultContentLanguage: "en" +# Renders the default content language in subdir, e.g. /en/. The root directory / will redirect to /en/ +defaultContentLanguageInSubdir: false +disableLiveReload: false +# Do not build RSS files +disableRSS: false +# Do not build Sitemap file +disableSitemap: false +# Enable GitInfo feature +enableGitInfo: false +# Build robots.txt file +enableRobotsTXT: false +# Do not render 404 page +disable404: false +# Do not inject generator meta tag on homepage +disableHugoGeneratorInject: false +# Allows you to disable all page types and will render nothing related to 'kind'; +# values = "page", "home", "section", "taxonomy", "taxonomyTerm", "RSS", "sitemap", "robotsTXT", "404" +disableKinds: [] +# Do not make the url/path to lowercase +disablePathToLower: false "" +# Enable Emoji emoticons support for page content; see emoji-cheat-sheet.com +enableEmoji: false +# Show a placeholder instead of the default value or an empty string if a translation is missing +enableMissingTranslationPlaceholders: false +footnoteAnchorPrefix: "" +footnoteReturnLinkContents: "" +# google analytics tracking id +googleAnalytics: "" +# if true, auto-detect Chinese/Japanese/Korean Languages in the content. (.Summary and .WordCount can work properly in CJKLanguage) +hasCJKLanguage: false +languageCode: "" +layoutDir: "layouts" +# Enable Logging +log: false +# Log File path (if set, logging enabled automatically) +logFile: "" +# "toml","yaml", or "json" +metaDataFormat: "toml" +newContentEditor: "" +# Don't sync permission mode of files +noChmod: false +# Don't sync modification time of files +noTimes: false +# Pagination +paginate: 10 +paginatePath: "page" +# See "content-management/permalinks" +permalinks: +# Pluralize titles in lists using inflect +pluralizeListTitles: true +# Preserve special characters in taxonomy names ("Gérard Depardieu" vs "Gerard Depardieu") +preserveTaxonomyNames: false +# filesystem path to write files to +publishDir: "public" +# enables syntax guessing for code fences without specified language +pygmentsCodeFencesGuessSyntax: false +# color-codes for highlighting derived from this style +pygmentsStyle: "monokai" +# true use pygments-css or false will color code directly +pygmentsUseClasses: false +# maximum number of items in the RSS feed +rssLimit: 15 +# see "Section Menu for Lazy Bloggers", /templates/menu-templates for more info +SectionPagesMenu: "" +# default sitemap configuration map +sitemap: +# filesystem path to read files relative from +source: "" +staticDir: "static" +# display memory and timing of different steps of the program +stepAnalysis: false +# theme to use (located by default in /themes/THEMENAME/) +themesDir: "themes" +theme: "" +title: "" +# if true, use /filename.html instead of /filename/ +uglyURLs: false +# verbose output +verbose: false +# verbose logging +verboseLog: false +# watch filesystem for changes and recreate as needed +watch: true +taxonomies: + - category: "categories" + - tag: "tags" +--- +``` +{{% /code %}} + +## TOML Configuration + +The following is an example of a TOML configuration file. The values under `[params]` will populate the `.Site.Params` variable for use in [templates][]: + +```toml +contentDir = "content" +layoutDir = "layouts" +publishDir = "public" +buildDrafts = false +baseURL = "https://yoursite.example.com/" +canonifyURLs = true +title = "My Hugo Site" + +[taxonomies] + category = "categories" + tag = "tags" + +[params] + subtitle = "Hugo is Absurdly Fast!" + author = "John Doe" +``` + +### All Variables, TOML + +The following is the full list of Hugo-defined variables in an example TOML file. The values provided in this example represent the default values used by Hugo. + +{{% code file="config.toml" download="config.toml"%}} +```toml ++++ +archetypeDir = "archetypes" +# hostname (and path) to the root, e.g. http://spf13.com/ +baseURL = "" +# include content marked as draft +buildDrafts = false +# include content with publishdate in the future +buildFuture = false +# include content already expired +buildExpired = false +# enable this to make all relative URLs relative to content root. Note that this does not affect absolute URLs. +relativeURLs = false +canonifyURLs = false +# config file (default is path/config.yaml|json|toml) +config = "config.toml" +contentDir = "content" +dataDir = "data" +defaultExtension = "html" +defaultLayout = "post" +# Missing translations will default to this content language +defaultContentLanguage = "en" +# Renders the default content language in subdir, e.g. /en/. The root directory / will redirect to /en/ +defaultContentLanguageInSubdir = false +disableLiveReload = false +# Do not build RSS files +disableRSS = false +# Do not build Sitemap file +disableSitemap = false +# Enable GitInfo feature +enableGitInfo = false +# Build robots.txt file +enableRobotsTXT = false +# Do not render 404 page +disable404 = false +# Do not inject generator meta tag on homepage +disableHugoGeneratorInject = false +# Allows you to disable all page types and will render nothing related to 'kind'; +# values = "page", "home", "section", "taxonomy", "taxonomyTerm", "RSS", "sitemap", "robotsTXT", "404" +disableKinds = [] +# Do not make the url/path to lowercase +disablePathToLower = false +# Enable Emoji emoticons support for page content; see emoji-cheat-sheet.com +enableEmoji = false +# Show a placeholder instead of the default value or an empty string if a translation is missing +enableMissingTranslationPlaceholders = false +footnoteAnchorPrefix = "" +footnoteReturnLinkContents = "" +# google analytics tracking id +googleAnalytics = "" +# if true, auto-detect Chinese/Japanese/Korean Languages in the content. (.Summary and .WordCount can work properly in CJKLanguage) +hasCJKLanguage = false +languageCode = "" +layoutDir = "layouts" +# Enable Logging +log = false +# Log File path (if set, logging enabled automatically) +logFile = +# maximum number of items in the RSS feed +rssLimit = 15 +# "toml","yaml", or "json" +metaDataFormat = "toml" +newContentEditor = "" +# Don't sync permission mode of files +noChmod = false +# Don't sync modification time of files +noTimes = false +# Pagination +paginate = 10 +paginatePath = "page" +# See "content-management/permalinks" +permalinks = +# Pluralize titles in lists using inflect +pluralizeListTitles = true +# Preserve special characters in taxonomy names ("Gérard Depardieu" vs "Gerard Depardieu") +preserveTaxonomyNames = false +# filesystem path to write files to +publishDir = "public" +# enables syntax guessing for code fences without specified language +pygmentsCodeFencesGuessSyntax = false +# color-codes for highlighting derived from this style +pygmentsStyle = "monokai" +# true: use pygments-css or false: color-codes directly +pygmentsUseClasses = false +# see "Section Menu for Lazy Bloggers", /templates/menu-templates for more info +SectionPagesMenu = +# default sitemap configuration map +sitemap = +# filesystem path to read files relative from +source = "" +staticDir = "static" +# display memory and timing of different steps of the program +stepAnalysis = false +# theme to use (located by default in /themes/THEMENAME/) +themesDir = "themes" +theme = "" +title = "" +# if true, use /filename.html instead of /filename/ +uglyURLs = false +# verbose output +verbose = false +# verbose logging +verboseLog = false +# watch filesystem for changes and recreate as needed +watch = true +[taxonomies] + category = "categories" + tag = "tags" ++++ +``` +{{% /code %}} + +{{% note %}} +If you are developing your site on a \*nix machine, here is a handy shortcut for finding a configuration option from the command line: +```bash +~/sites/yourhugosite +hugo config | grep emoji +enableemoji: true +``` +{{% /note %}} + +## Environmental Variables + +In addition to the 3 config options already mentioned, configuration key-values can be defined through operating system environment variables. + +For example, the following command will effectively set a website's title on Unix-like systems: + +```bash +$ env HUGO_TITLE="Some Title" hugo +``` + +{{% note "Setting Environment Variables" %}} +Names must be prefixed with `HUGO_` and the configuration key must be set in uppercase when setting operating system environment variables. +{{% /note %}} + +## Ignore Files When Rendering + +The following statement inside `./config.toml` will cause Hugo to ignore files ending with `.foo` and `.boo` when rendering: + +```toml +ignoreFiles = [ "\\.foo$", "\\.boo$" ] +``` + +The above is a list of regular expressions. Note that the backslash (`\`) character is escaped in this example to keep TOML happy. + +## Configure Blackfriday + +[Blackfriday](https://github.com/russross/blackfriday) is Hugo's built-in Markdown rendering engine. + +Hugo typically configures Blackfriday with sane default values that should fit most use cases reasonably well. + +However, if you have specific needs with respect to Markdown, Hugo exposes some of its Blackfriday behavior options for you to alter. The following table lists these Hugo options, paired with the corresponding flags from Blackfriday's source code ( [html.go](https://github.com/russross/blackfriday/blob/master/html.go) and [markdown.go](https://github.com/russross/blackfriday/blob/master/markdown.go)). + +{{< readfile file="/content/readfiles/bfconfig.md" markdown="true" >}} + +{{% note %}} +1. Blackfriday flags are *case sensitive* as of Hugo v0.15. +2. Blackfriday flags must be grouped under the `blackfriday` key and can be set on both the site level *and* the page level. Any setting on a page will override its respective site setting. +{{% /note %}} + +{{% code file="bf-config.toml" %}} +```toml +[blackfriday] + angledQuotes = true + fractions = false + plainIDAnchors = true + extensions = ["hardLineBreak"] +``` +{{% /code %}} + +{{% code file="bf-config.yml" %}} +```yaml +blackfriday: + angledQuotes: true + fractions: false + plainIDAnchors: true + extensions: + - hardLineBreak +``` +{{% /code %}} + +## Configure Additional Output Formats + +Hugo v0.20 introduced the ability to render your content to multiple output formats (e.g., to JSON, AMP html, or CSV). See [Output Formats][] for information on how to add these values to your Hugo project's configuration file. + +## Configuration Format Specs + +* [TOML Spec][toml] +* [YAML Spec][yaml] +* [JSON Spec][json] + +[`.Site.Params`]: /variables/site/ +[directory structure]: /getting-started/directory-structure +[json]: /documents/ecma-404-json-spec.pdf +[lookup order]: /templates/lookup-order/ +[Output Formats]: /templates/output-formats/ +[templates]: /templates/ +[toml]: https://github.com/toml-lang/toml +[yaml]: http://yaml.org/spec/ \ No newline at end of file diff --git a/content/getting-started/directory-structure.md b/content/getting-started/directory-structure.md new file mode 100644 index 000000000..7a6536f0e --- /dev/null +++ b/content/getting-started/directory-structure.md @@ -0,0 +1,82 @@ +--- +title: Directory Structure +linktitle: Directory Structure +description: Hugo's CLI scaffolds a project directory structure and then takes that single directory and uses it as the input to create a complete website. +date: 2017-01-02 +publishdate: 2017-02-01 +lastmod: 2017-03-09 +categories: [getting started,fundamentals] +#tags: [source, organization, directories] +menu: + docs: + parent: "getting-started" + weight: 50 +weight: 50 +sections_weight: 50 +draft: false +aliases: [/overview/source-directory/] +toc: true +--- + +## New Site Scaffolding + +Running the `hugo new site` generator from the command line will create a directory structure with the following elements: + +```bash +. +├── archetypes +├── config.toml +├── content +├── data +├── layouts +├── static +└── themes +``` + + +## Directory Structure Explained + +The following is a high-level overview of each of the directories with links to each of their respective sections with in the Hugo docs. + +[`archetypes`](/content-management/archetypes/) +: You can create new content files in Hugo using the `hugo new` command. +By default, hugo will create new content files with at least `date`, `title` (inferred from the file name), and `draft = true`. This saves time and promotes consistency for sites using multiple content types. You can create your own [archetypes][] with custom preconfigured front matter fields as well. + +[`config.toml`](/getting-started/configuration/) +: Every Hugo project should have a configuration file in TOML, YAML, or JSON format at the root. Many sites may need little to no configuration, but Hugo ships with a large number of [configuration directives][] for more granular directions on how you want Hugo to build your website. + +[`content`][] +: All content for your website will live inside this directory. Each top-level folder in Hugo is considered a [content section][]. For example, if your site has three main sections---`blog`, `articles`, and `tutorials`---you will have three directories at `content/blog`, `content/articles`, and `content/tutorials`. Hugo uses sections to assign default [content types][]. + +[`data`](/templates/data-templates/) +: This directory is used to store configuration files that can be +used by Hugo when generating your website. You can write these files in YAML, JSON, or TOML format. In addition to the files you add to this folder, you can also create [data templates][] that pull from dynamic content. + +[`layouts`][] +: Stores templates in the form of `.html` files that specify how views of your content will be rendered into a static website. Templates include [list pages][lists], your [homepage][], [taxonomy templates][], [partials][], [single page templates][singles], and more. + +`static` +: stores all the static content for your future website: images, CSS, JavaScript, etc. When Hugo builds your site, all assets inside your static directory are copied over as-is. A good example of using the `static` folder is for [verifying site ownership on Google Search Console][searchconsole], where you want Hugo to copy over a complete HTML file without modifying its content. + +{{% note %}} +Hugo does not currently ship with an asset pipeline ([#3207](https://github.com/gohugoio/hugo/issues/3207)). You can solicit support from the community in the [Hugo forums](https://discourse.gohugo.io) or check out a few of the [Hugo starter kits](/tools/starter-kits/) for examples of how Hugo developers are managing static assets. +{{% /note %}} + + +[archetypes]: /content-management/archetypes/ +[configuration directives]: /getting-started/configuration/#all-variables-yaml +[`content`]: /content-management/organization/ +[content section]: /content-management/sections/ +[content types]: /content-management/types/ +[data templates]: /templates/data-templates/ +[homepage]: /templates/homepage/ +[`layouts`]: /templates/ +[lists]: /templates/list/ +[pagevars]: /variables/page/ +[partials]: /templates/partials/ +[searchconsole]: https://support.google.com/analytics/answer/1142414?hl=en +[singles]: /templates/single-page-templates/ +[starters]: /tools/starter-kits/ +[taxonomies]: /content-management/taxonomies/ +[taxonomy templates]: /templates/taxonomy-templates/ +[types]: /content-management/types/ diff --git a/content/getting-started/installing.md b/content/getting-started/installing.md new file mode 100644 index 000000000..a880788f1 --- /dev/null +++ b/content/getting-started/installing.md @@ -0,0 +1,502 @@ +--- +title: Install Hugo +linktitle: Install Hugo +description: Install Hugo on macOS, Windows, Linux, FreeBSD, and on any machine where the Go compiler tool chain can run. +date: 2016-11-01 +publishdate: 2016-11-01 +lastmod: 2017-02-20 +categories: [getting started,fundamentals] +authors: ["Michael Henderson"] +#tags: [install,pc,windows,linux,macos,binary,tarball] +menu: + docs: + parent: "getting-started" + weight: 30 +weight: 30 +sections_weight: 30 +draft: false +aliases: [/tutorials/installing-on-windows/,/tutorials/installing-on-mac/,/overview/installing/,/getting-started/install,/install/] +toc: true +--- + + +{{% note %}} +There is lots of talk about "Hugo being written in Go", but you don't need to install Go to enjoy Hugo. Just grab a precompiled binary! +{{% /note %}} + +Hugo is written in [Go](https://golang.org/) with support for multiple platforms. The latest release can be found at [Hugo Releases][releases]. + +Hugo currently provides pre-built binaries for the following: + +* macOS (Darwin) for x64, i386, and ARM architectures +* Windows +* Linux +* FreeBSD + +Hugo may also be compiled from source wherever the Go compiler tool chain can run; e.g., on other operating systems such as DragonFly BSD, OpenBSD, Plan 9, Solaris, and others. See for the full set of supported combinations of target operating systems and compilation architectures. + +## Quick Install + +### Binary (Cross-platform) + +Download the appropriate version for your platform from [Hugo Releases][releases]. Once downloaded, the binary can be run from anywhere. You don't need to install it into a global location. This works well for shared hosts and other systems where you don't have a privileged account. + +Ideally, you should install it somewhere in your `PATH` for easy use. `/usr/local/bin` is the most probable location. + +### Homebrew (macOS) + +If you are on macOS and using [Homebrew][brew], you can install Hugo with the following one-liner: + +{{% code file="install-with-homebrew.sh" %}} +```bash +brew install hugo +``` +{{% /code %}} + +For more detailed explanations, read the installation guides that follow for installing on macOS and Windows. + +### Chocolatey (Windows) + +If you are on a Windows machine and use [Chocolatey][] for package management, you can install Hugo with the following one-liner: + +{{% code file="install-with-chocolatey.ps1" %}} +```powershell +choco install hugo -confirm +``` +{{% /code %}} + +### Source + +#### Prerequisite Tools + +* [Git][installgit] +* [Go 1.5+][installgo] +* [govendor][] + +#### Vendored Dependencies + +Hugo uses [govendor][] to vendor dependencies, but we don't commit the vendored packages themselves to the Hugo git repository. Therefore, a simple `go get` is *not* supported because the command is not vendor aware. *You must use `govendor` to fetch Hugo's dependencies.* + +#### Fetch from GitHub + +{{% code file="from-gh.sh" %}} +```sh +go get github.com/kardianos/govendor +govendor get github.com/gohugoio/hugo +go install github.com/gohugoio/hugo +``` +{{% /code %}} + +`govendor get` will fetch Hugo and all its dependent libraries to `$GOPATH/src/github.com/gohugoio/hugo`, and `go install` compiles everything into a final `hugo` (or `hugo.exe`) executable inside `$GOPATH/bin/`. + +{{% note %}} +If you are a Windows user, substitute the `$HOME` environment variable above with `%USERPROFILE%`. +{{% /note %}} + +## macOS + +### Assumptions + +1. You know how to open the macOS terminal. +2. You're running a modern 64-bit Mac. +3. You will use `~/Sites` as the starting point for your site. (`~/Sites` is used for example purposes. If you are familiar enough with the command line and file system, you should have no issues following along with the instructions.) + +### Pick Your Method + +There are three ways to install Hugo on your Mac + +1. The [Homebrew][brew] `brew` utility +2. Distribution (i.e., tarball) +3. Building from Source + +There is no "best" way to install Hugo on your Mac. You should use the method that works best for your use case. + +#### Pros and Cons + +There are pros and cons to each of the aforementioned methods: + +1. **Homebrew.** Homebrew is the simplest method and will require the least amount of work to maintain. The drawbacks aren't severe. The default package will be for the most recent release, so it will not have bug fixes until the next release (i.e., unless you install it with the `--HEAD` option). Hugo `brew` releases may lag a few days behind because it has to be coordinated with another team. Nevertheless, `brew` is the recommended installation method if you want to work from a stable, widely used source. Brew works well and is easy to update. + +2. **Tarball.** Downloading and installing from the tarball is also easy, although it requires a few more command line skills than does Homebrew. Updates are easy as well: you just repeat the process with the new binary. This gives you the flexibility to have multiple versions on your computer. If you don't want to use `brew`, then the tarball/binary is a good choice. + +3. **Building from Source.** Building from source is the most work. The advantage of building from source is that you don't have to wait for a release to add features or bug fixes. The disadvantage is that you need to spend more time managing the setup, which is manageable but requires more time than the preceding two options. + +{{% note %}} +Since building from source is appealing to more seasoned command line users, this guide will focus more on installing Hugo via Homebrew and Tarball. +{{% /note %}} + +### Install Hugo with Brew + +#### Step 1: Install `brew` if you haven't already + +Go to the `brew` website, , and follow the directions there. The most important step is the installation from the command line: + +{{% code file="install-brew.sh" %}} +```bash +ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" +``` +{{% /code %}} + +#### Step 2: Run the `brew` Command to Install `hugo` + +Installing Hugo using `brew` is as easy as the following: + +{{% code file="install-brew.sh" %}} +```bash +brew install hugo +``` +{{% /code %}} + +If Homebrew is working properly, you should see something similar to the following: + +```sh +==> Downloading https://homebrew.bintray.com/bottles/hugo-0.21.sierra.bottle.tar.gz +######################################################################### 100.0% +==> Pouring hugo-0.21.sierra.bottle.tar.gz +🍺 /usr/local/Cellar/hugo/0.21: 32 files, 17.4MB +``` + +{{% note "Installing the Latest Hugo with Brew" %}} +Replace `brew install hugo` with `brew install hugo --HEAD` if you want the absolute latest in-development version. +{{% /note %}} + +`brew` should have updated your path to include Hugo. You can confirm by opening a new terminal window and running a few commands: + +```bash +$ # show the location of the hugo executable +which hugo +/usr/local/bin/hugo + +# show the installed version +ls -l $( which hugo ) +lrwxr-xr-x 1 mdhender admin 30 Mar 28 22:19 /usr/local/bin/hugo -> ../Cellar/hugo/0.13_1/bin/hugo + +# verify that hugo runs correctly +hugo version +Hugo Static Site Generator v0.13 BuildDate: 2015-03-09T21:34:47-05:00 +``` + +### Install Hugo from Tarball + +#### Step 1: Decide on the location + +When installing from the tarball, you have to decide if you're going to install the binary in `/usr/local/bin` or in your home directory. There are three camps on this: + +1. Install it in `/usr/local/bin` so that all the users on your system have access to it. This is a good idea because it's a fairly standard place for executables. The downside is that you may need elevated privileges to put software into that location. Also, if there are multiple users on your system, they will all run the same version. Sometimes this can be an issue if you want to try out a new release. + +2. Install it in `~/bin` so that only you can execute it. This is a good idea because it's easy to do, easy to maintain, and doesn't require elevated privileges. The downside is that only you can run Hugo. If there are other users on your site, they have to maintain their own copies. That can lead to people running different versions. Of course, this does make it easier for you to experiment with different releases. + +3. Install it in your `Sites` directory. This is not a bad idea if you have only one site that you're building. It keeps every thing in a single place. If you want to try out new releases, you can make a copy of the entire site and update the Hugo executable. + +All three locations will work for you. In the interest of brevity, this guide focuses on option #2. + +#### Step 2: Download the Tarball + +1. Open in your browser. + +2. Find the current release by scrolling down and looking for the green tag that reads "Latest Release." + +3. Download the current tarball for the Mac. The name will be something like `hugo_X.Y_osx-64bit.tgz`, where `X.YY` is the release number. + +4. By default, the tarball will be saved to your `~/Downloads` directory. If you choose to use a different location, you'll need to change that in the following steps. + +#### Step 3: Confirm your download + +Verify that the tarball wasn't corrupted during the download: + +```bash +tar tvf ~/Downloads/hugo_X.Y_osx-64bit.tgz +-rwxrwxrwx 0 0 0 0 Feb 22 04:02 hugo_X.Y_osx-64bit/hugo_X.Y_osx-64bit.tgz +-rwxrwxrwx 0 0 0 0 Feb 22 03:24 hugo_X.Y_osx-64bit/README.md +-rwxrwxrwx 0 0 0 0 Jan 30 18:48 hugo_X.Y_osx-64bit/LICENSE.md +``` + +The `.md` files are documentation for Hugo. The other file is the executable. + +#### Step 4: Install Into Your `bin` Directory + +```bash +# create the directory if needed +mkdir -p ~/bin + +# make it the working directory +cd ~/bin + +# extract the tarball +tar -xvzf ~/Downloads/hugo_X.Y_osx-64bit.tgz +Archive: hugo_X.Y_osx-64bit.tgz + x ./ + x ./hugo + x ./LICENSE.md + x ./README.md + +# verify that it runs +./hugo version +Hugo Static Site Generator v0.13 BuildDate: 2015-02-22T04:02:30-06:00 +``` + +You may need to add your bin directory to your `PATH` variable. The `which` command will check for us. If it can find `hugo`, it will print the full path to it. Otherwise, it will not print anything. + +```bash +# check if hugo is in the path +which hugo +/Users/USERNAME/bin/hugo +``` + +If `hugo` is not in your `PATH`, add it by updating your `~/.bash_profile` file. First, start up an editor: + +```bash +nano ~/.bash_profile +``` + +Add a line to update your `PATH` variable: + +```bash +export PATH=$PATH:$HOME/bin +``` + +Then save the file by pressing Control-X, then Y to save the file and return to the prompt. + +Close the terminal and open a new terminal to pick up the changes to your profile. Verify your success by running the `which hugo` command again. + +You've successfully installed Hugo. + +### Build from Source on Mac + +If you want to compile Hugo yourself, you'll need to install Go (aka Golang). You can [install Go directly from the Go website](https://golang.org/dl/) or via Homebrew using the following command: + +```bash +brew install go +``` + +#### Step 1: Get the Source + +If you want to compile a specific version of Hugo, go to and download the source code for the version of your choice. If you want to compile Hugo with all the latest changes (which might include bugs), clone the Hugo repository: + +```bash +git clone https://github.com/gohugoio/hugo +``` + +{{% warning "Sometimes \"Latest\" = \"Bugs\""%}} +Cloning the Hugo repository directly means taking the good with the bad. By using the bleeding-edge version of Hugo, you make your development susceptible to the latest features, as well as the latest bugs. Your feedback is appreciated. If you find a bug in the latest release, [please create an issue on GitHub](https://github.com/gohugoio/hugo/issues/new). +{{% /warning %}} + +#### Step 2: Compiling + +Make the directory containing the source your working directory and then fetch Hugo's dependencies: + +```bash +mkdir -p src/github.com/gohugoio +ln -sf $(pwd) src/github.com/gohugoio/hugo + +# set the build path for Go +export GOPATH=$(pwd) + +go get +``` + +This will fetch the absolute latest version of the dependencies. If Hugo fails to build, it may be the result of a dependency's author introducing a breaking change. + +Once you have properly configured your directory, you can compile Hugo using the following command: + +```bash +go build -o hugo main.go +``` + +Then place the `hugo` executable somewhere in your `$PATH`. You're now ready to start using Hugo. + +## Windows + +The following aims to be a complete guide to installing Hugo on your Windows PC. + +### Assumptions + +1. You will use `C:\Hugo\Sites` as the starting point for your new project. +2. You will use `C:\Hugo\bin` to store executable files. + +### Set up Your Directories + +You'll need a place to store the Hugo executable, your [content][], and the generated Hugo website: + +1. Open Windows Explorer. +2. Create a new folder: `C:\Hugo`, assuming you want Hugo on your C drive, although this can go anywhere +3. Create a subfolder in the Hugo folder: `C:\Hugo\bin` +4. Create another subfolder in Hugo: `C:\Hugo\Sites` + +### Technical Users + +1. Download the latest zipped Hugo executable from [Hugo Releases][releases]. +2. Extract all contents to your `..\Hugo\bin` folder. +3. The `hugo` executable will be named as `hugo_hugo-version_platform_arch.exe`. Rename the executable to `hugo.exe` for ease of use. +4. In PowerShell or your preferred CLI, add the `hugo.exe` executable to your PATH by navigating to `C:\Hugo\bin` (or the location of your hugo.exe file) and use the command `set PATH=%PATH%;C:\Hugo\bin`. If the `hugo` command does not work after a reboot, you may have to run the command prompt as administrator. + +### Less-technical Users + +1. Go to the [Hugo Releases][releases] page. +2. The latest release is announced on top. Scroll to the bottom of the release announcement to see the downloads. They're all ZIP files. +3. Find the Windows files near the bottom (they're in alphabetical order, so Windows is last) – download either the 32-bit or 64-bit file depending on whether you have 32-bit or 64-bit Windows. (If you don't know, [see here](https://esupport.trendmicro.com/en-us/home/pages/technical-support/1038680.aspx).) +4. Move the ZIP file into your `C:\Hugo\bin` folder. +5. Double-click on the ZIP file and extract its contents. Be sure to extract the contents into the same `C:\Hugo\bin` folder – Windows will do this by default unless you tell it to extract somewhere else. +6. You should now have three new files: hugo executable (e.g. `hugo_0.18_windows_amd64.exe`), `license.md`, and `readme.md`. (You can delete the ZIP download now.) Rename that hugo executable (`hugo_hugo-version_platform_arch.exe`) to `hugo.exe` for ease of use. + +Now you need to add Hugo to your Windows PATH settings: + +#### For Windows 10 Users: + +* Right click on the **Start** button. +* Click on **System**. +* Click on **Advanced System Settings** on the left. +* Click on the **Environment Variables...** button on the bottom. +* In the User variables section, find the row that starts with PATH (PATH will be all caps). +* Double-click on **PATH**. +* Click the **New...** button. +* Type in the folder where `hugo.exe` was extracted, which is `C:\Hugo\bin` if you went by the instructions above. *The PATH entry should be the folder where Hugo lives and not the binary.* Press Enter when you're done typing. +* Click OK at every window to exit. + +{{% note "Path Editor in Windows 10"%}} +The path editor in Windows 10 was added in the large [November 2015 Update](https://blogs.windows.com/windowsexperience/2015/11/12/first-major-update-for-windows-10-available-today/). You'll need to have that or a later update installed for the above steps to work. You can see what Windows 10 build you have by clicking on the  Start button → Settings → System → About. See [here](https://www.howtogeek.com/236195/how-to-find-out-which-build-and-version-of-windows-10-you-have/) for more.) +{{% /note %}} + +#### For Windows 7 and 8.x users: + +Windows 7 and 8.1 do not include the easy path editor included in Windows 10, so non-technical users on those platforms are advised to install a free third-party path editor like [Windows Environment Variables Editor][Windows Environment Variables Editor] or [Path Editor](https://patheditor2.codeplex.com/). + +### Verify the Executable + +Run a few commands to verify that the executable is ready to run, and then build a sample site to get started. + +#### 1. Open a Command Prompt + +At the prompt, type `hugo help` and press the Enter key. You should see output that starts with: + +```powershell +hugo is the main command, used to build your Hugo site. + +Hugo is a Fast and Flexible Static Site Generator +built with love by spf13 and friends in Go. + +Complete documentation is available at https://gohugo.io/. +``` + +If you do, then the installation is complete. If you don't, double-check the path that you placed the `hugo.exe` file in and that you typed that path correctly when you added it to your `PATH` variable. If you're still not getting the output, search the [Hugo discussion forum][forum] to see if others have already figured out our problem. If not, add a note---in the "Support" category---and be sure to include your command and the output. + +At the prompt, change your directory to the `Sites` directory. + +```powershell +C:\Program Files> cd C:\Hugo\Sites +C:\Hugo\Sites> +``` + +#### 2. Run the Command + +Run the command to generate a new site. I'm using `example.com` as the name of the site. + +```powershell +C:\Hugo\Sites> hugo new site example.com +``` + +You should now have a directory at `C:\Hugo\Sites\example.com`. Change into that directory and list the contents. You should get output similar to the following: + +```powershell +C:\Hugo\Sites>cd example.com +C:\Hugo\Sites\example.com>dir + Directory of C:\hugo\sites\example.com +  +04/13/2015 10:44 PM . +04/13/2015 10:44 PM .. +04/13/2015 10:44 PM archetypes +04/13/2015 10:44 PM 83 config.toml +04/13/2015 10:44 PM content +04/13/2015 10:44 PM data +04/13/2015 10:44 PM layouts +04/13/2015 10:44 PM static + 1 File(s) 83 bytes + 7 Dir(s) 6,273,331,200 bytes free +``` + +### Troubleshoot Windows Installation + +[@dhersam][] has created a nice video on common issues: + +{{< youtube c8fJIRNChmU >}} + +## Linux + +### Debian and Ubuntu + +In any of the [Linux distributions that support snaps](https://snapcraft.io/docs/core/install): + +```sh +sudo apt install hugo +``` + +#### Pros + +* Native Debian/Ubuntu package maintained by Debian Developers +* Pre-installed bash completion script and `man` pages + +#### Cons + +* Might not be the latest version, especially if you are using an older, stable version (e.g., Ubuntu 16.04 LTS). Until backports and PPA are available, you may consider installing the Hugo snap package to get the latest version of Hugo, as described below. + +### Arch + +You can also install Hugo from the [Arch user repository](https://aur.archlinux.org/) on Arch Linux or derivatives such as Manjaro. + +Be aware that Hugo is built from source. This means that additional tools like [Git](https://git-scm.com) and [Go](https://golang.org/doc/install) will be installed as well. + +```bash +sudo pacman -S yaourt +yaourt -S hugo +``` + +### Fedora, CentOS, and Red Hat + +* (updated to Hugo v0.16) +* (updated to Hugo v0.22); usually released a few days after the official Hugo release. + +See the [related discussion in the Hugo forums][redhatforum]. + +### Snap Package + +In any of the [Linux distributions that support snaps][snaps]: + +```bash +snap install hugo +``` + +{{% note %}} +Hugo-as-a-snap can write only inside the user’s `$HOME` directory---and gvfs-mounted directories owned by the user---because of Snaps’ confinement and security model. More information is also available [in this related GitHub issue](https://github.com/gohugoio/hugo/issues/3143). +{{% /note %}} + +## Upgrade Hugo + +Upgrading Hugo is as easy as downloading and replacing the executable you’ve placed in your `PATH`. + +## Install Pygments (Optional) + +The Hugo executable has one *optional* external dependency for source code highlighting ([Pygments][pygments]). + +If you want to have source code highlighting using the [highlight shortcode][], you need to install the Python-based Pygments program. The procedure is outlined on the [Pygments homepage][pygments]. + +## Next Steps + +Now that you've installed Hugo, read the [Quick Start guide][quickstart] and explore the rest of the documentation. If you have questions, ask the Hugo community directly by visiting the [Hugo Discussion Forum][forum]. + +[brew]: https://brew.sh/ +[Chocolatey]: https://chocolatey.org/ +[content]: /content-management/ +[@dhersam]: https://github.com/dhersam +[forum]: https://discourse.gohugo.io +[govendor]: https://github.com/kardianos/govendor +[highlight shortcode]: /content-management/shortcodes/#highlight +[installgit]: http://git-scm.com/ +[installgo]: https://golang.org/dl/ +[Path Editor]: https://patheditor2.codeplex.com/ +[pygments]: https://pygments.org +[quickstart]: /getting-started/quick-start/ +[redhatforum]: https://discourse.gohugo.io/t/solved-fedora-copr-repository-out-of-service/2491 +[releases]: https://github.com/gohugoio/hugo/releases +[snaps]: http://snapcraft.io/docs/core/install +[windowsarch]: https://esupport.trendmicro.com/en-us/home/pages/technical-support/1038680.aspx +[Windows Environment Variables Editor]: http://eveditor.com/ diff --git a/content/getting-started/quick-start.md b/content/getting-started/quick-start.md new file mode 100644 index 000000000..850bd107e --- /dev/null +++ b/content/getting-started/quick-start.md @@ -0,0 +1,574 @@ +--- +title: Quick Start +linktitle: Quick Start +description: Build an online bookshelf that taps into Hugo's CLI, directory structure, configuration, and theming. +date: 2013-07-01 +publishdate: 2013-07-01 +lastmod: 2017-06-22 +categories: [getting started] +#tags: [quick start,usage] +authors: [Shekhar Gulati, Ryan Watters] +menu: + docs: + parent: "getting-started" + weight: 10 +weight: 10 +sections_weight: 10 +draft: false +aliases: [/overview/quickstart/] +toc: true +wip: true +--- + +{{% note %}} +This Quick Start was originally written by [Shekhar Gulati](https://twitter.com/shekhargulati) in his [52 Technologies in 2016](https://github.com/shekhargulati/52-technologies-in-2016) blog series but has been heavily modified to represent additional features and other changes to Hugo. +{{% /note %}} + +In this Quick Start, we will build an online bookshelf that lists books and their reviews. + +## Step 1. Install Hugo + +[Install Hugo][install]. If installing from [Hugo releases][releases], you'll need to save the main executable as `hugo` (or `hugo.exe` on Windows) somewhere in your `PATH`. You will need the `hugo` command in the following steps. + +{{% note "Windows Users and Git Bash" %}} +If you're on Windows, this Quick Start will assume you're using [Git Bash](https://git-for-windows.github.io/) (aka Git for Windows). +{{% /note %}} + +Once `hugo` is installed, make sure to run the `help` command to verify `hugo` installation. The following is an abridged version of what will write to the console when entering the command: + +```bash +hugo help + +hugo is the main command, used to build your Hugo site. + +Hugo is a Fast and Flexible Static Site Generator +built with love by spf13 and friends in Go. + +Complete documentation is available at http://gohugo.io/. +``` + +You can check the version of Hugo you're currently using with the `hugo version` command: + +```bash +hugo version +``` + +```bash +Hugo Static Site Generator v0.18.1 BuildDate: 2016-12-30T05:02:43-05:00 +``` + +## Step 2. Scaffold Your Hugo Bookshelf Website + +Hugo's CLI has commands that allow you to quickly scaffold a new website. Navigate to your preferred location on your file system and create a new Hugo site `bookshelf` by executing the `hugo new` command: + +```bash +hugo new site bookshelf +``` + +Change into the newly created `bookshelf` directory. Listing the new directory's content will show the following: + +```bash +. +├── archetypes +├── config.toml +├── content +├── data +├── layouts +├── static +└── themes + +6 directories, 1 file +``` + +You'll see the `bookshelf` directory has 6 subdirectories and 1 file. Let's look at each of them quickly. (See [Directory Structure][hugodirectories].) + +* `archetypes`: [Archetypes][archetypes] allow you to preconfigure [front matter][fm] for content files for easier scaffolding of content from the command line using `hugo new`. +* `config.toml`: Hugo uses `.toml` as its default configuration format but also accepts `.yml` and `.json`. The configuration settings mentioned in the `config.toml` are applied to the full website an include important global variables such as the `baseURL` and `title` of your website. (See [Configuration][configuration].) +* `content`: This single directory houses all of the content for your website. Each subdirectory in content is considered a [section][]. If your website has sections for posts, events, and tutorials, you would create `content/posts`, `content/events`, and `content/tutorials`. +* `data`: This directory is used to store files of serialized data (YAML, TOML, or JSON) that can be used in [data templates][datatemplates] and your [website's menu][sitemenu]. +* `layouts`: This is the hub for all your [templating][templating], including [list and section templates](/templates/lists/) and [shortcodes](/templates/shortcode-templates/). +* `static`: This houses all your static content; i.e., images, JavaScript, and CSS. Everything in `/static` is copied over *as is* to your finished website. +* `themes`: This is where you will download themes for Hugo. You can see a showcase of all themes at . + +## Step 3. Add Content + +Let's now add a post to our "bookshelf." We will use the `hugo new` command to add a post. This first post will be on the book [*Good To Great*][bookurl]. Make sure you are inside the `bookshelf` directory. + +{{% code file="create-new-book-review-post.sh" %}} +```bash +hugo new post/good-to-great.md +``` +{{% /code %}} + +You should then see the following output: + +```bash +/Users/yourusername/bookshelf/content/post/good-to-great.md created +``` + +The above command will create a new directory `post` inside the `content` directory and create `content/post/good-to-great.md`. The directory for your Hugo project will now look like the following: + +```bash +. +├── archetypes +├── config.toml +├── content +│   └── post +│   └── good-to-great.md +├── data +├── layouts +├── static +└── themes +``` + +Open `good-to-great.md` in your preferred text editor: + +```toml ++++ +date = "2017-02-19T21:09:05-06:00" +title = "good to great" +draft = true + ++++ +``` + +The text bracketed by `+++` is the TOML [front matter][fm] for the content. Front matter enables you to define embedded metadata that travels with the content file. Since we have not configured any [archetypes][archetypes] for our project, Hugo has used its built-in base archetype, which includes the following three values in the front matter: + +* `date` specifies the date and time at which post was created from the command line +* `title` specifies the title for the post, which Hugo will infer from the file name +* `draft`, when set to `true`, tells Hugo the content is not yet ready to be published + +Let's update `good-to-great.md` with a short review of *Good to Great*: + +{{% code file="good-to-great-start.md" %}} +```markdown ++++ +date = "2016-02-14T16:11:58+05:30" +draft = true +title = "Good to Great Book Review" ++++ + +I read **Good to Great in January 2016**. An awesome read sharing detailed analysis on how good companies became great. Although this book is about how companies became great but we could apply a lot of the learnings on ourselves. Concepts like level 5 leader, hedgehog concept, the stockdale paradox are equally applicable to individuals. +``` +{{% /code %}} + +## Step 4. Serve Content + +Hugo has a built-in server that can serve your website locally for easy previewing and development. To serve content, execute the following command inside the `bookshelf` directory: + +```bash +hugo server +``` + +You should see something similar to the following output: + +```bash +Built site for language en: +0 of 1 draft rendered +0 future content +0 expired content +0 regular pages created +1 other pages created +0 non-page files copied +0 paginator pages created +0 tags created +0 categories created +total in 1 ms +Watching for changes in /Users/yourusername/bookshelf/{data,content,layouts,static} +Serving pages from memory +Web Server is available at http://localhost:1313/ (bind address 127.0.0.1) +Press Ctrl+C to stop +``` + +This will start the server on port `1313`. You can view your blog at . However, when you go to the link, you will see nothing. This is for a couple reasons: + +1. As you can see in the `hugo server` command output, Hugo did *not* render the draft. Hugo will only render drafts if you pass the `buildDrafts` flag to the `hugo server` command. +2. We have not specified how Markdown content should be rendered. We need to create our own layouts via templates or specify a theme, the latter of which we will do in the next step. + +Kill the server using Ctrl + C and then rerun the server with the `--buildDrafts` flag appended to the command: + +```bash +hugo server --buildDrafts +``` + +You should now see something similar to the following: + +```bash +Built site for language en: +1 of 1 draft rendered +0 future content +0 expired content +1 regular pages created +2 other pages created +0 non-page files copied +0 paginator pages created +0 tags created +0 categories created +total in 2 ms +Watching for changes in /Users/yourusername/bookshelf/{data,content,layouts,static} +Serving pages from memory +Web Server is available at http://localhost:1313/ (bind address 127.0.0.1) +Press Ctrl+C to stop +``` + +Okay, so we now have our single page "built," but we're not seeing anything in the browser at . This was only to demonstrate the utility of the `--buildDrafts` flag. + +While we are getting closer, we still need to specific a theme for Hugo to use when building our site. + +## Step 5. Add A Theme + +[Themes][themessection] provide Hugo with layout and templates to render your website. You can see the full selection of open-source themes at . + +{{% note "No Default Hugo Theme" %}} +Hugo currently doesn’t ship with a default theme, thus allowing end users to pick whichever theme best suits their projects. +{{% /note %}} + +Themes should be added in the `themes` directory, one of the directories scaffolded with the `hugo new site` command we used to start our Hugo project. To install our themes, first change into the `themes` directory: + +```bash +cd themes +``` + +You can clone one or more themes from within the `themes` directory. We will use the [Robust theme][robusttheme] but at the most recent commit as of this Quick Start's last update. + +Once inside the `themes` directory, you can use the following one-liner to clone Robust, check out the specific commit, and then return to your project's root directory: + +{{% code file="clone-robust-theme" %}} +```bash +git clone https://github.com/dim0627/hugo_theme_robust.git && cd hugo_theme_robust && git checkout 3baae29 && cd ../.. +``` +{{% /code %}} + +Now let's start Hugo's server again but with the addition of the `-theme` flag for Robust: + +{{% code file="hugo-server-with-theme.sh" %}} +```bash +hugo server --theme=hugo_theme_robust --buildDrafts +``` +{{% /code %}} + +You should see an output to the console similar to the following: + +```bash +Built site for language en: +1 of 1 draft rendered +0 future content +0 expired content +1 regular pages created +2 other pages created +0 non-page files copied +2 paginator pages created +0 tags created +0 categories created +total in 8 ms +Watching for changes in /Users/yourusername/bookshelf/{data,content,layouts,static,themes} +Serving pages from memory +Web Server is available at http://localhost:1313/ (bind address 127.0.0.1) +Press Ctrl+C to stop +``` + +If Hugo doesn't find the specified theme in the `themes` directory, +it will throw an exception: + +```bash +FATAL: 2016/02/14 Unable to find theme Directory: /Users/yourusername/bookshelf/themes/robust +``` + +To view your website, you can go to . You should see something similar to the following image: + +![](/images/quickstart/bookshelf-robust-theme.png) + +Similar to the way we looked at the scaffolding for our new Hugo website, let's take a look at what comprises a typical Hugo theme. The following is only a selection of what you would see if you were to list out the contents of the Robust theme directory. These are also some of the default files created by Hugo as of v0.23. (See [Creating a Theme][createtheme]) + +```bash +. +├── LICENSE.md +├── archetypes +│   └── default.md +├── layouts +│   ├── 404.html +│   ├── _default +│   │   ├── list.html +│   │   └── single.html +│   ├── index.html +│   └── partials +│   ├── footer.html +│   └── header.html +├── static +│   ├── css +│   └── js +└── theme.toml +``` + +* `theme.toml` is the theme configuration file that provides information about the theme; e.g., theme name, theme description, theme author, theme license, and minimum Hugo version, which will default to your locally installed version of Hugo. +* `layouts` contains different views (i.e., [templates][templating]) for different content types. In this quick start, we see that each content type has a `single.html` and `list.html`. `single.html` is used for rendering a single piece of content. `list.html` is used to view a list of content items. For example, you will use `list.html` to view `*.md` in the posts [section][listsectiontemplates]. Think of `list.html` as `example.com/posts` and `single.html` as `example.com/posts/my-single-post/`. +* `static` has the same purpose as that of the `static` in our original scaffolding. This directory stores all the static assets used by the theme and is copied over *as is* at build time. + +## Step 6. Use Multiple Themes + +You can very easily switch between different themes in Hugo. Let's suppose we want to try out the [`bleak` theme][bleaktheme]. Kill the Hugo server if you are still running it from the command line. + +From your project root, you can use this one-liner to change into `themes`, clone Bleak, and go back to your project's root directory: + +{{% code file="clone-bleak-theme.sh" %}} +```bash +cd themes && git clone https://github.com/Zenithar/hugo-theme-bleak.git && cd .. +``` +{{% /code %}} + +Now restart the server with our new theme flag: + +{{% code file="run-server-with-bleak.sh" %}} +```bash +hugo server --theme=hugo-theme-bleak --buildDrafts +``` +{{% /code %}} + +Our website is now using the `bleak` theme at , which should look similar to the following screenshot: + +![Screenshot of the Quick Start website's homepage running with the Bleak Hugo theme.](/images/quickstart/bookshelf-bleak-theme.png) + +## Step 7. Update Your Configuration + +Kill the Hugo server if you are still running it with the Bleak theme, and then restart the server with the `robust` theme. We will use Robust for the duration of this Quick Start: + +{{% code file="restart-with-robust-sh" %}} +```bash +hugo server --theme=hugo_theme_robust --buildDrafts +``` +{{% /code %}} + +### Update Our `config.toml` + +Our website is currently using the dummy values specified in `bookshelf/config.toml`, which were auto-generated with `hugo new site bookshelf`. Let's update the configuration: + +{{% code file="updated-config.toml" %}} +```toml +baseURL = "http://example.org/" +languageCode = "en-us" +title = "Shekhar Gulati Book Reviews" + +[Params] + Author = "Shekhar Gulati" +``` +{{% /code %}} + +### Watch Your Site Reload Instantly + +Hugo has built-in support for LiveReload. This means that Hugo will rebuild and reload your site every time you save a change to content, templates, static assets, and even your configuration. You should see something similar to the following screenshot at once you save the above changes to your `config.toml`: + +![](/images/quickstart/bookshelf-updated-config.png) + +The change is also reflected in the console. As soon as you changed the configuration file, Hugo applied those changes to the affected pages and rebuilt the site: + +``` +Config file changed: /Users/yourusername/bookshelf/config.toml +Started building sites ... +Built site for language en: +1 of 1 draft rendered +0 future content +0 expired content +1 regular pages created +2 other pages created +0 non-page files copied +2 paginator pages created +0 tags created +0 categories created +total in 20 ms +``` + +## Step 8. Customize the Robust Theme + +The `robust` theme is a good start towards our online bookshelf, but we want to customize it a bit to meet our desired look and feel. Hugo makes it very easy to [customize existing themes or create your own][themes] themes as well. For the purpose of the Quick Start, we will focus on customization. + +The first change that we have to make is to use a different default image instead of the one used in the theme. The theme's default image used in both the `list.html` and `single.html` views resides inside `themes/hugo_theme_robust/static/images/default.jpg`. We can easily override it by creating a simple directory structure inside our repository's `static` directory. + +Create an images directory inside of `bookshelf/static` and copy an image with name `default.jpg` inside of it. We will use the default image shown below. + +![](/images/quickstart/default.jpg) + +Hugo will sync the changes and reload the website to use the new image: + +![](/images/quickstart/bookshelf-new-default-image.png) + +Now we need to change the layout of the index page so that only images are shown instead of the text. The file at `themes/hugo_theme_robust/layouts/index.html` refers to a partial `li.html` template that renders the following list view: + +```html + +``` + +Create a new file for `li.html` inside the `bookshelf/layouts/_default` directory. If you are in your project root, you can use the following one-liner to both create the file and return to the project root: + +{{% code file="create-new-li-html.sh" %}} +```bash +cd layouts && mkdir _default && cd _default && touch li.html && cd ../.. +``` +{{% /code %}} + +Copy the content shown below into the new `li.html`. When contrasting this with the `li.html` that ships with the Robust theme, you'll notice we have removed details of the book so that only the image is shown: + +{{% code file="layouts/_default/li.html" %}} +```html + +``` +{{% /code %}} + +Now, the website should render similar to the following screenshot: + +![](/images/quickstart/bookshelf-only-picture.png) + +Next, we want to remove information related to the theme from the footer. Let's create a new directory at `bookshelf/layouts/partials`. This will hold our new file called `default_foot.html`. + +This is a new [partial template][partials]. If you are still in the project's root directory, you can use the following one-liner to create the partial before returning to the project root: + +{{% code file="create-new-default-foot.sh" %}} +```bash +cd layouts && mkdir partials && cd partials && touch default_foot.html && cd ../.. +``` +{{% /code %}} + +Now add the following to our new `default_foot.html` partial template: + +{{% code file="layouts/partials/default_foot.html" %}} +```html +
+

{{ with .Site.Copyright | safeHTML }}{{ . }}{{ else }}© {{ $.Site.LastChange.Year }} {{ if isset $.Site.Params "Author" }}{{ $.Site.Params.Author }}{{ else }}{{ .Site.Title }}{{ end }}{{ end }}

+

Powered by Hugo,

+
+``` +{{% /code %}} + +So far we are using the default image, but we would like to use the book image so that we can relate to the book. Every book review will define a configuration setting in its front matter. Update the content and front matter of `good-to-great.md` as shown below. + +{{% code file="content/post/good-to-great.md" %}} +```markdown ++++ +date = "2017-02-19T21:09:05-06:00" +draft = true +title = "Good to Great Book Review" +image = "good-to-great.jpg" ++++ + +I read **Good to Great in January 2016**. An awesome read sharing detailed analysis on how good companies became great. Although this book is about how companies became great but we could apply a lot of the learnings on ourselves. Concepts like level 5 leader, hedgehog concept, the stockdale paradox are equally applicable to individuals. +``` +{{% /code %}} + +Grab a (legal) image from somewhere, name it `good-to-great.jpg`, and place it in the `bookshelf/static/images` directory. + +After adding a few more books to our shelf, the shelf appears as shown below. + +![](/images/quickstart/bookshelf.png) + + +## Step 9. Make Your Posts Public + +So far, all the posts that we have written are in draft status (i.e., `draft = true`). To make a draft public, you can run a Hugo CLI command or manually change the draft status in the post's front matter to `false`. Hugo provides a handy command line argument called `undraft` to do this for us: + +```bash +hugo undraft content/post/good-to-great.md +``` + +If we check the front matter of `good-to-great.md` after running this command, we'll notice that Hugo has written the change of draft status to the file: + +```toml ++++ +date = "2017-02-19T22:42:53-06:00" +draft = false +title = "Good to Great Book Review" +image = "good-to-great.jpg" ++++ +``` + +Now, we can start the server *without* the `buildDrafts` option. + +```bash +hugo server --theme=hugo_theme_robust +``` + + +## Step 10. Build Your Website + +To generate a website that can be deployed to GitHub pages, we first need to change the `baseURL` in our configuration as follows: + +```toml +baseURL = "https://.github.io/bookshelf/" +``` + +Then type the following command while in the root directory of your Hugo project: + +```bash +hugo --theme=hugo_theme_robust +0 draft content +0 future content +5 pages created +2 paginator pages created +0 tags created +0 categories created +in 17 ms +``` + +After you run the `hugo` command, a `bookshelf/public` directory will be created containing the generated website source. + +## Step 11. What Next? + +**Congratulations!** Your new `bookshelf`/public directory is a fully generated, deployable Hugo website. Since all your files are *static*, you have innumerable options for hosting, and your new directory structure and simple content format are going to make scaling your website a breeze. + +Here's what you should look into next: + +1. [See hosting and deployment options][hostinganddeploy] for sharing your newly created Hugo website with the world. +2. [Learn more about Hugo's powerful templating][templating] to tailor your new Hugo website to your specific needs and keep it scaling accordingly. +3. [Visit the Hugo Discussion Forum][forum] to ask questions, answer questions, and become an active member of the Hugo community. + +[archetypes]: /content-management/archetypes/ +[bookurl]: https://www.amazon.com/Good-Great-Some-Companies-Others/dp/0066620996/ +[bleaktheme]: http://themes.gohugo.io/bleak/ +[configuration]: /getting-started/configuration/ +[createtheme]: /themes/creating/ +[datatemplates]: /templates/data-templates/ +[forum]: https://discourse.gohugo.io +[fm]: /content-management/front-matter/ +[hostinganddeploy]: /hosting-and-deployment/ +[hugodirectories]: /getting-started/directory-structure/ +[install]: /getting-started/installing/ +[lists]: /templating/lists/ +[partials]: /templates/partials/ +[quickinstall]: /getting-started/installing/#quick-install +[releases]: https://github.com/gohugoio/hugo/releases +[robusttheme]: https://github.com/dim0627/hugo_theme_robust +[section]: /content-management/sections/ +[sectiontemplates]: /templates/section-templates/ +[shortcodetemplates]: /templates/shortcode-templates/ +[sitemenu]: /content-management/menus/ +[templating]: /templates/introduction/ +[themessection]: /themes/ +[themes]: /themes/ diff --git a/content/getting-started/usage.md b/content/getting-started/usage.md new file mode 100644 index 000000000..9db972d48 --- /dev/null +++ b/content/getting-started/usage.md @@ -0,0 +1,228 @@ +--- +title: Basic Usage +linktitle: Basic Usage +description: Hugo's CLI is fully featured but simple to use, even for those who have very limited experience working from the command line. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [getting started] +#tags: [usage,livereload,command line,flags] +menu: + docs: + parent: "getting-started" + weight: 40 +weight: 40 +sections_weight: 40 +draft: false +aliases: [/overview/usage/,/extras/livereload/,/doc/usage/,/usage/] +toc: true +--- + +The following is a description of the most command commands you will use while developing your Hugo project. See the [Command Line Reference][commands] for a comprehensive view of Hugo's CLI. + +## Test Installation + +Once you have [installed Hugo][install], make sure it is in your `PATH`. You can test that Hugo has been installed correctly via the `help` command: + +```bash +hugo help +``` + +The output you see in your console should be similar to the following: + +```bash +hugo is the main command, used to build your Hugo site. + +Hugo is a Fast and Flexible Static Site Generator +built with love by spf13 and friends in Go. + +Complete documentation is available at http://gohugo.io/. + +Usage: + hugo [flags] + hugo [command] + +Available Commands: + benchmark Benchmark Hugo by building a site a number of times. + check Contains some verification checks + config Print the site configuration + convert Convert your content to different formats + env Print Hugo version and environment info + gen A collection of several useful generators. + help Help about any command + import Import your site from others. + list Listing out various types of content + new Create new content for your site + server A high performance webserver + undraft Undraft changes the content's draft status from 'True' to 'False' + version Print the version number of Hugo + +Flags: + -b, --baseURL string hostname (and path) to the root, e.g. http://spf13.com/ + -D, --buildDrafts include content marked as draft + -E, --buildExpired include expired content + -F, --buildFuture include content with publishdate in the future + --cacheDir string filesystem path to cache directory. Defaults: $TMPDIR/hugo_cache/ + --canonifyURLs if true, all relative URLs will be canonicalized using baseURL + --cleanDestinationDir remove files from destination not found in static directories + --config string config file (default is path/config.yaml|json|toml) + -c, --contentDir string filesystem path to content directory + -d, --destination string filesystem path to write files to + --disable404 do not render 404 page + --disableKinds stringSlice disable different kind of pages (home, RSS etc.) + --disableRSS do not build RSS files + --disableSitemap do not build Sitemap file + --enableGitInfo add Git revision, date and author info to the pages + --forceSyncStatic copy all files when static is changed. + -h, --help help for hugo + --i18n-warnings print missing translations + --ignoreCache ignores the cache directory + -l, --layoutDir string filesystem path to layout directory + --log enable Logging + --logFile string log File path (if set, logging enabled automatically) + --noChmod don't sync permission mode of files + --noTimes don't sync modification time of files + --pluralizeListTitles pluralize titles in lists using inflect (default true) + --preserveTaxonomyNames preserve taxonomy names as written ("Gérard Depardieu" vs "gerard-depardieu") + --quiet build in quiet mode + --renderToMemory render to memory (only useful for benchmark testing) + -s, --source string filesystem path to read files relative from + --stepAnalysis display memory and timing of different steps of the program + -t, --theme string theme to use (located in /themes/THEMENAME/) + --themesDir string filesystem path to themes directory + --uglyURLs if true, use /filename.html instead of /filename/ + -v, --verbose verbose output + --verboseLog verbose logging + -w, --watch watch filesystem for changes and recreate as needed +``` + +## The `hugo` Command + +The most common usage is probably to run `hugo` with your current directory being the input directory. + +This generates your website to the `public/` directory by default, although you can customize the output directory in your [site configuration][config] by changing the `publishDir` field. + +The site Hugo renders into `public/` is ready to be deployed to your web server: + +```bash +hugo +0 draft content +0 future content +99 pages created +0 paginator pages created +16 tags created +0 groups created +in 90 ms +``` + +## Draft, Future, and Expired Content + +Hugo allows you to set `draft`, `publishdate`, and even `expirydate` in your content's [front matter][]. By default, Hugo will not publish: + +1. Content with a future `publishdate` value +2. Content with `draft: true` status +3. Content with a past `expirydate` value + +All three of these can be overridden during both local development *and* deployment by adding the following flags to `hugo` and `hugo server`, respectively, or by changing the boolean values assigned to the fields of the same name (without `--`) in your [configuration][config]: + +1. `--buildFuture` +2. `--buildDrafts` +3. `--buildExpired` + +## LiveReload + +Hugo comes with [LiveReload](https://github.com/livereload/livereload-js) built in. There are no additional packages to install. A common way to use Hugo while developing a site is to have Hugo run a server with the `hugo server` command and watch for changes: + +```bash +hugo server +0 draft content +0 future content +99 pages created +0 paginator pages created +16 tags created +0 groups created +in 120 ms +Watching for changes in /Users/yourname/sites/yourhugosite/{data,content,layouts,static} +Serving pages from /Users/yourname/sites/yourhugosite/public +Web Server is available at http://localhost:1313/ +Press Ctrl+C to stop +``` + +This will run a fully functioning web server while simultaneously watching your file system for additions, deletions, or changes within the following areas of your [project organization][dirs]: + +* `/static/*` +* `/content/*` +* `/data/*` +* `/i18n/*` +* `/layouts/*` +* `/themes//*` +* `config` + +Whenever you make changes, Hugo will simultaneously rebuild the site and continue to serve content. As soon as the build is finished, LiveReload tells the browser to silently reload the page. + +Most Hugo builds are so fast that you may not notice the change unless looking directly at the site in your browser. This means that keeping the site open on a second monitor (or another half of your current monitor) allows you to see the most up-to-date version of your website without the need to leave your text editor. + +{{% note "Closing `` Tag"%}} +Hugo injects the LiveReload `` ⇒ `` (Good!) -* `` ⇒ `` (Bad!) - -### singularize -Singularize the given word with a set of common English singularization rules. - -e.g. `{{ "cats" | singularize }}` → "cat" - -### slicestr - -Slicing in `slicestr` is done by specifying a half-open range with two indices, `start` and `end`. -For example, 1 and 4 creates a slice including elements 1 through 3. -The `end` index can be omitted; it defaults to the string's length. - -e.g. - -* `{{slicestr "BatMan" 3}}` → "Man" -* `{{slicestr "BatMan" 0 3}}` → "Bat" - -### truncate - -Truncate a text to a max length without cutting words or leaving unclosed HTML tags. Since Go templates are HTML-aware, truncate will handle normal strings vs HTML strings intelligently. It's important to note that if you have a raw string that contains HTML tags that you want treated as HTML, you will need to convert the string to HTML using the safeHTML template function before sending the value to truncate; otherwise, the HTML tags will be escaped by truncate. - -e.g. - -* `{{ "this is a text" | truncate 10 " ..." }}` → `this is a ...` -* `{{ "Keep my HTML" | safeHTML | truncate 10 }}` → `Keep my …` -* `{{ "With [Markdown](#markdown) inside." | markdownify | truncate 10 }}` → `With Markdown …` - -### split - -Split a string into substrings separated by a delimiter. - -e.g. - -* `{{split "tag1,tag2,tag3" "," }}` → ["tag1" "tag2" "tag3"] - -### string - -Creates a `string`. - -e.g. - -* `{{string "BatMan"}}` → "BatMan" - -### substr - -Extracts parts of a string, beginning at the character at the specified -position, and returns the specified number of characters. - -It normally takes two parameters: `start` and `length`. -It can also take one parameter: `start`, i.e. `length` is omitted, in which case -the substring starting from start until the end of the string will be returned. - -To extract characters from the end of the string, use a negative start number. - -In addition, borrowing from the extended behavior described at http://php.net/substr, -if `length` is given and is negative, then that many characters will be omitted from -the end of string. - -e.g. - -* `{{substr "BatMan" 0 -3}}` → "Bat" -* `{{substr "BatMan" 3 3}}` → "Man" - -### hasPrefix - -HasPrefix tests whether a string begins with prefix. - -* `{{ hasPrefix "Hugo" "Hu" }}` → true - -### title -Converts all characters in string to titlecase. - -e.g. `{{title "BatMan"}}` → "Batman" - - -### trim -Returns a slice of the string with all leading and trailing characters contained in cutset removed. - -e.g. `{{ trim "++Batman--" "+-" }}` → "Batman" - - -### upper -Converts all characters in string to uppercase. - -e.g. `{{upper "BatMan"}}` → "BATMAN" - - -### countwords - -`countwords` tries to convert the passed content to a string and counts each word -in it. The template functions works similar to [.WordCount]({{< relref "templates/variables.md#page-variables" >}}). - -```html -{{ "Hugo is a static site generator." | countwords }} - -``` - - -### countrunes - -Alternatively to counting all words , `countrunes` determines the number of runes in the content and excludes any whitespace. This can become useful if you have to deal with -CJK-like languages. - -```html -{{ "Hello, 世界" | countrunes }} - -``` - -### md5 - -`md5` hashes the given input and returns its MD5 checksum. - -```html -{{ md5 "Hello world, gophers!" }} - -``` - -This can be useful if you want to use Gravatar for generating a unique avatar: - -```html - -``` - - -### sha1 - -`sha1` hashes the given input and returns its SHA1 checksum. - -```html -{{ sha1 "Hello world, gophers!" }} - -``` - - -### sha256 - -`sha256` hashes the given input and returns its SHA256 checksum. - -```html -{{ sha256 "Hello world, gophers!" }} - -``` - - -## Internationalization - -### i18n - -This translates a piece of content based on your `i18n/en-US.yaml` -(and friends) files. You can use the [go-i18n](https://github.com/nicksnyder/go-i18n) tools to manage your translations. The translations can exist in both the theme and at the root of your repository. - -e.g.: `{{ i18n "translation_id" }}` - -For more information about string translations, see [Translation of strings]({{< relref "content/multilingual.md#translation-of-strings">}}). - -### T - -`T` is an alias to `i18n`. E.g. `{{ T "translation_id" }}`. - -## Times - -### time - -`time` converts a timestamp string into a [`time.Time`](https://godoc.org/time#Time) structure so you can access its fields. E.g. - -* `{{ time "2016-05-28" }}` → "2016-05-28T00:00:00Z" -* `{{ (time "2016-05-28").YearDay }}` → 149 -* `{{ mul 1000 (time "2016-05-28T10:30:00.00+10:00").Unix }}` → 1464395400000 (Unix time in milliseconds) - -### now - -`now` returns the current local time as a [`time.Time`](https://godoc.org/time#Time). - -## URLs -### absLangURL, relLangURL -These are similar to the `absURL` and `relURL` relatives below, but will add the correct language prefix when the site is configured with more than one language. - -So for a site `baseURL` set to `http://mysite.com/hugo/` and the current language is `en`: - -* `{{ "blog/" | absLangURL }}` → "http://mysite.com/hugo/en/blog/" -* `{{ "blog/" | relLangURL }}` → "/hugo/en/blog/" - -### absURL, relURL - -Both `absURL` and `relURL` considers the configured value of `baseURL`, so given a `baseURL` set to `http://mysite.com/hugo/`: - -* `{{ "mystyle.css" | absURL }}` → "http://mysite.com/hugo/mystyle.css" -* `{{ "mystyle.css" | relURL }}` → "/hugo/mystyle.css" -* `{{ "http://gohugo.io/" | relURL }}` → "http://gohugo.io/" -* `{{ "http://gohugo.io/" | absURL }}` → "http://gohugo.io/" - -The last two examples may look funky, but is useful if you, say, have a list of images, some of them hosted externally, some locally: - -``` - -``` - -The above also exploits the fact that the Go template parser JSON-encodes objects inside `script` tags. - - - -**Note:** These functions are smart about missing slashes, but will not add one to the end if not present. - - -### ref, relref -Looks up a content page by relative path or logical name to return the permalink (`ref`) or relative permalink (`relref`). Requires a `Page` object (usually satisfied with `.`). Used in the [`ref` and `relref` shortcodes]({{% ref "extras/crossreferences.md" %}}). - -e.g. {{ ref . "about.md" }} - -### safeURL -Declares the provided string as a "safe" URL or URL substring (see [RFC 3986][]). -A URL like `javascript:checkThatFormNotEditedBeforeLeavingPage()` from a trusted -source should go in the page, but by default dynamic `javascript:` URLs are -filtered out since they are a frequently exploited injection vector. - -[RFC 3986]: http://tools.ietf.org/html/rfc3986 - -Without `safeURL`, only the URI schemes `http:`, `https:` and `mailto:` -are considered safe by Go. If any other URI schemes, e.g. `irc:` and -`javascript:`, are detected, the whole URL would be replaced with -`#ZgotmplZ`. This is to "defang" any potential attack in the URL, -rendering it useless. - -Example: Given a site-wide `config.toml` that contains this menu entry: - - [[menu.main]] - name = "IRC: #golang at freenode" - url = "irc://irc.freenode.net/#golang" - -The following template: - -
    - {{ range .Site.Menus.main }} -
  • {{ .Name }}
    • - {{ end }} -
- -would produce `
  • IRC: #golang at freenode
    • ` -for the `irc://…` URL. - -To fix this, add ` | safeURL` after `.URL` on the 3rd line, like this: - -
  • {{ .Name }}
    • - -With this change, we finally get `
  • IRC: #golang at freenode
    • ` -as intended. - - -### urlize -Takes a string and sanitizes it for usage in URLs, converts spaces to "-". - -e.g. `{{ . }}` - - -### querify - -Takes a set of key-value pairs and returns a [query string](https://en.wikipedia.org/wiki/Query_string) that can be appended to a URL. E.g. - - Search - -will be rendered as - - Search - - -## Content Views - -### Render -Takes a view to render the content with. The view is an alternate layout, and should be a file name that points to a template in one of the locations specified in the documentation for [Content Views](/templates/views). - -This function is only available on a piece of content, and in list context. - -This example could render a piece of content using the content view located at `/layouts/_default/summary.html`: - - {{ range .Data.Pages }} - {{ .Render "summary"}} - {{ end }} - - - -## Advanced - -### apply - -Given a map, array, or slice, returns a new slice with a function applied over it. Expects at least three parameters, depending on the function being applied. The first parameter is the sequence to operate on; the second is the name of the function as a string, which must be in the Hugo function map (generally, it is these functions documented here). After that, the parameters to the applied function are provided, with the string `"."` standing in for each element of the sequence the function is to be applied against. An example is in order: - - +++ - names: [ "Derek Perkins", "Joe Bergevin", "Tanner Linsley" ] - +++ - - {{ apply .Params.names "urlize" "." }} → [ "derek-perkins", "joe-bergevin", "tanner-linsley" ] - -This is roughly equivalent to: - - {{ range .Params.names }}{{ . | urlize }}{{ end }} - -However, it isn’t possible to provide the output of a range to the `delimit` function, so you need to `apply` it. A more complete example should explain this. Let's say you have two partials for displaying tag links in a post, "post/tag/list.html" and "post/tag/link.html", as shown below. - - - {{ with .Params.tags }} -
    - Tags: - {{ $len := len . }} - {{ if eq $len 1 }} - {{ partial "post/tag/link" (index . 0) }} - {{ else }} - {{ $last := sub $len 1 }} - {{ range first $last . }} - {{ partial "post/tag/link" . }}, - {{ end }} - {{ partial "post/tag/link" (index . $last) }} - {{ end }} -
    - {{ end }} - - - - {{ . }} - -This works, but the complexity of "post/tag/list.html" is fairly high; the Hugo template needs to perform special behaviour for the case where there’s only one tag, and it has to treat the last tag as special. Additionally, the tag list will be rendered something like "Tags: tag1 , tag2 , tag3" because of the way that the HTML is generated and it is interpreted by a browser. - -This is Hugo. We have a better way. If this were your "post/tag/list.html" instead, all of those problems are fixed automatically (this first version separates all of the operations for ease of reading; the combined version will be shown after the explanation). - - - {{ with .Params.tags }} -
    - Tags: - {{ $sort := sort . }} - {{ $links := apply $sort "partial" "post/tag/link" "." }} - {{ $clean := apply $links "chomp" "." }} - {{ delimit $clean ", " }} -
    - {{ end }} - -In this version, we are now sorting the tags, converting them to links with "post/tag/link.html", cleaning off stray newlines, and joining them together in a delimited list for presentation. That can also be written as: - - - {{ with .Params.tags }} -
    - Tags: - {{ delimit (apply (apply (sort .) "partial" "post/tag/link" ".") "chomp" ".") ", " }} -
    - {{ end }} - -`apply` does not work when receiving the sequence as an argument through a pipeline. - -*** - -### base64Encode and base64Decode - -`base64Encode` and `base64Decode` let you easily decode content with a base64 encoding and vice versa through pipes. Let's take a look at an example: - - - {{ "Hello world" | base64Encode }} - - - {{ "SGVsbG8gd29ybGQ=" | base64Decode }} - - -You can also pass other datatypes as argument to the template function which tries -to convert them. Now we use an integer instead of a string: - - - {{ 42 | base64Encode | base64Decode }} - - -**Tip:** Using base64 to decode and encode becomes really powerful if we have to handle -responses of APIs. - - {{ $resp := getJSON "https://api.github.com/repos/gohugoio/hugo/readme" }} - {{ $resp.content | base64Decode | markdownify }} - -The response of the GitHub API contains the base64-encoded version of the [README.md](https://github.com/gohugoio/hugo/blob/master/README.md) in the Hugo repository. Now we can decode it and parse the Markdown. The final output will look similar to the rendered version on GitHub. - -*** - -### partialCached - -See [Template Partials]({{< relref "templates/partials.md#cached-partials" >}}) for an explanation of the `partialCached` template function. - - -## .Site.GetPage -Every `Page` has a `Kind` attribute that shows what kind of page it is. While this attribute can be used to list pages of a certain `kind` using `where`, often it can be useful to fetch a single page by its path. - -`GetPage` looks up an index page of a given `Kind` and `path`. This method may support regular pages in the future, but currently it is a convenient way of getting the index pages, such as the home page or a section, from a template: - - {{ with .Site.GetPage "section" "blog" }}{{ .Title }}{{ end }} - -This method wil return `nil` when no page could be found, so the above will not print anything if the blog section isn't found. - -The valid page kinds are: *home, section, taxonomy and taxonomyTerm.* diff --git a/content/templates/go-templates.md b/content/templates/go-templates.md deleted file mode 100644 index bb7c71606..000000000 --- a/content/templates/go-templates.md +++ /dev/null @@ -1,443 +0,0 @@ ---- -aliases: -- /layout/go-templates/ -- /layouts/go-templates/ -lastmod: 2015-11-30 -date: 2013-07-01 -menu: - main: - parent: layout -next: /templates/ace -prev: /templates/overview -title: Go Template Primer -weight: 15 -toc: true ---- - -Hugo uses the excellent [Go][] [html/template][gohtmltemplate] library for -its template engine. It is an extremely lightweight engine that provides a very -small amount of logic. In our experience it is just the right amount of -logic to be able to create a good static website. If you have used other -template systems from different languages or frameworks, you will find a lot of -similarities in Go templates. - -This document is a brief primer on using Go templates. The [Go docs][gohtmltemplate] -go into more depth and cover features that aren't mentioned here. - -## Introduction to Go Templates - -Go templates provide an extremely simple template language. It adheres to the -belief that only the most basic of logic belongs in the template or view layer. -One consequence of this simplicity is that Go templates parse very quickly. - -A unique characteristic of Go templates is they are content aware. Variables and -content will be sanitized depending on the context of where they are used. More -details can be found in the [Go docs][gohtmltemplate]. - -## Basic Syntax - -Go lang templates are HTML files with the addition of variables and -functions. - -**Go variables and functions are accessible within {{ }}** - -Accessing a predefined variable "foo": - - {{ foo }} - -**Parameters are separated using spaces** - -Calling the `add` function with input of 1, 2: - - {{ add 1 2 }} - -**Methods and fields are accessed via dot notation** - -Accessing the Page Parameter "bar" - - {{ .Params.bar }} - -**Parentheses can be used to group items together** - - {{ if or (isset .Params "alt") (isset .Params "caption") }} Caption {{ end }} - - -## Variables - -Each Go template has a struct (object) made available to it. In Hugo, each -template is passed page struct. More details are available on the -[variables](/layout/variables/) page. - -A variable is accessed by referencing the variable name. - - {{ .Title }} - -Variables can also be defined and referenced. - - {{ $address := "123 Main St."}} - {{ $address }} - - -## Functions - -Go template ships with a few functions which provide basic functionality. The Go -template system also provides a mechanism for applications to extend the -available functions with their own. [Hugo template -functions](/layout/functions/) provide some additional functionality we believe -are useful for building websites. Functions are called by using their name -followed by the required parameters separated by spaces. Template -functions cannot be added without recompiling Hugo. - -**Example 1: Adding numbers** - - {{ add 1 2 }} - -**Example 2: Comparing numbers** - - {{ lt 1 2 }} - -(There are more boolean operators, detailed in the -[template documentation](http://golang.org/pkg/text/template/#hdr-Functions).) - -## Includes - -When including another template, you will pass to it the data it will be -able to access. To pass along the current context, please remember to -include a trailing dot. The templates location will always be starting at -the /layout/ directory within Hugo. - -**Example:** - - {{ template "partials/header.html" . }} - -And, starting with Hugo v0.12, you may also use the `partial` call -for [partial templates](/templates/partials/): - - {{ partial "header.html" . }} - - -## Logic - -Go templates provide the most basic iteration and conditional logic. - -### Iteration - -Just like in Go, the Go templates make heavy use of `range` to iterate over -a map, array or slice. The following are different examples of how to use -range. - -**Example 1: Using Context** - - {{ range array }} - {{ . }} - {{ end }} - -**Example 2: Declaring value variable name** - - {{range $element := array}} - {{ $element }} - {{ end }} - -**Example 2: Declaring key and value variable name** - - {{range $index, $element := array}} - {{ $index }} - {{ $element }} - {{ end }} - -### Conditionals - -`if`, `else`, `with`, `or` & `and` provide the framework for handling conditional -logic in Go Templates. Like `range`, each statement is closed with `end`. - -Go Templates treat the following values as false: - -* false -* 0 -* any array, slice, map, or string of length zero - -**Example 1: `if`** - - {{ if isset .Params "title" }}

    {{ index .Params "title" }}

    {{ end }} - -**Example 2: `if` … `else`** - - {{ if isset .Params "alt" }} - {{ index .Params "alt" }} - {{else}} - {{ index .Params "caption" }} - {{ end }} - -**Example 3: `and` & `or`** - - {{ if and (or (isset .Params "title") (isset .Params "caption")) (isset .Params "attr")}} - -**Example 4: `with`** - -An alternative way of writing "`if`" and then referencing the same value -is to use "`with`" instead. `with` rebinds the context `.` within its scope, -and skips the block if the variable is absent. - -The first example above could be simplified as: - - {{ with .Params.title }}

    {{ . }}

    {{ end }} - -**Example 5: `if` … `else if`** - - {{ if isset .Params "alt" }} - {{ index .Params "alt" }} - {{ else if isset .Params "caption" }} - {{ index .Params "caption" }} - {{ end }} - -## Pipes - -One of the most powerful components of Go templates is the ability to -stack actions one after another. This is done by using pipes. Borrowed -from Unix pipes, the concept is simple, each pipeline's output becomes the -input of the following pipe. - -Because of the very simple syntax of Go templates, the pipe is essential -to being able to chain together function calls. One limitation of the -pipes is that they only can work with a single value and that value -becomes the last parameter of the next pipeline. - -A few simple examples should help convey how to use the pipe. - -**Example 1:** - - {{ shuffle (seq 1 5) }} - -is the same as - - {{ (seq 1 5) | shuffle }} - -**Example 2:** - - {{ index .Params "disqus_url" | html }} - -Access the page parameter called "disqus_url" and escape the HTML. - -The `index` function is a [Go][] built-in, and you can read about it [here][gostdlibpkgtexttemplate]. `index`: - -> ...returns the result of indexing its first argument by the following arguments. Thus "index x 1 2 3" is, in Go syntax, `x[1][2][3]`. Each indexed item must be a map, slice, or array. - -**Example 3:** - - {{ if or (or (isset .Params "title") (isset .Params "caption")) (isset .Params "attr") }} - Stuff Here - {{ end }} - -Could be rewritten as - - {{ if isset .Params "caption" | or isset .Params "title" | or isset .Params "attr" }} - Stuff Here - {{ end }} - -### Internet Explorer conditional comments using Pipes - -By default, Go Templates remove HTML comments from output. This has the unfortunate side effect of removing Internet Explorer conditional comments. As a workaround, use something like this: - - {{ "" | safeHTML }} - -Alternatively, use the backtick (`` ` ``) to quote the IE conditional comments, avoiding the tedious task of escaping every double quotes (`"`) inside, as demonstrated in the [examples](http://golang.org/pkg/text/template/#hdr-Examples) in the Go text/template documentation, e.g.: - -``` -{{ `` | safeHTML }} -``` - -## Context (a.k.a. the dot) - -The most easily overlooked concept to understand about Go templates is that `{{ . }}` -always refers to the current context. In the top level of your template, this -will be the data set made available to it. Inside of a iteration, however, it will have -the value of the current item. When inside of a loop, the context has changed: -`{{ . }}` will no longer refer to the data available to the entire page. If you need -to -access this from within the loop, you will likely want to do one of the following: - -1. Set it to a variable instead of depending on the context. For example: - - {{ $title := .Site.Title }} - {{ range .Params.tags }} -
  • - {{ . }} - - {{ $title }} -
    • - {{ end }} - - Notice how once we have entered the loop the value of `{{ . }}` has changed. We - have defined a variable outside of the loop so we have access to it from within - the loop. - -2. Use `$.` to access the global context from anywhere. - Here is an equivalent example: - - {{ range .Params.tags }} -
  • - {{ . }} - - {{ $.Site.Title }} -
    • - {{ end }} - - This is because `$`, a special variable, is set to the starting value - of `.` the dot by default, - a [documented feature](http://golang.org/pkg/text/template/#hdr-Variables) - of Go text/template. Very handy, eh? - - > However, this little magic would cease to work if someone were to - > mischievously redefine `$`, e.g. `{{ $ := .Site }}`. - > *(No, don't do it!)* - > You may, of course, recover from this mischief by using `{{ $ := . }}` - > in a global context to reset `$` to its default value. - -## Whitespace - -Go 1.6 includes the ability to trim the whitespace from either side of a Go tag by including a hyphen (`-`) and space immediately beside the corresponding `{{` or `}}` delimiter. - -For instance, the following Go template: - -```html -
    - {{ .Title }} -
    -``` - -will include the newlines and horizontal tab in its HTML output: - -```html -
    - Hello, World! -
    -``` - -whereas using - -```html -
    - {{- .Title -}} -
    -``` - -in that case will output simply `
    Hello, World!
    `. - -Go considers the following characters as whitespace: space, horizontal tab, carriage return and newline. - -# Hugo Parameters - -Hugo provides the option of passing values to the template language -through the site configuration (for sitewide values), or through the meta -data of each specific piece of content. You can define any values of any -type (supported by your front matter/config format) and use them however -you want to inside of your templates. - - -## Using Content (page) Parameters - -In each piece of content, you can provide variables to be used by the -templates. This happens in the [front matter](/content/front-matter/). - -An example of this is used in this documentation site. Most of the pages -benefit from having the table of contents provided. Sometimes the TOC just -doesn't make a lot of sense. We've defined a variable in our front matter -of some pages to turn off the TOC from being displayed. - -Here is the example front matter: - -``` ---- -title: "Permalinks" -lastmod: 2015-11-30 -date: "2013-11-18" -aliases: - - "/doc/permalinks/" -groups: ["extras"] -groups_weight: 30 -notoc: true ---- -``` - -Here is the corresponding code inside of the template: - - {{ if not .Params.notoc }} -
    - {{ .TableOfContents }} -
    - {{ end }} - - - -## Using Site (config) Parameters -In your top-level configuration file (e.g., `config.yaml`) you can define site -parameters, which are values which will be available to you in partials. - -For instance, you might declare: - -```yaml -params: - CopyrightHTML: "Copyright © 2013 John Doe. All Rights Reserved." - TwitterUser: "spf13" - SidebarRecentLimit: 5 -``` - -Within a footer layout, you might then declare a `
    ` which is only -provided if the `CopyrightHTML` parameter is provided, and if it is given, -you would declare it to be HTML-safe, so that the HTML entity is not escaped -again. This would let you easily update just your top-level config file each -January 1st, instead of hunting through your templates. - -``` -{{if .Site.Params.CopyrightHTML}}
    -
    {{.Site.Params.CopyrightHTML | safeHTML}}
    -
    {{end}} -``` - -An alternative way of writing the "`if`" and then referencing the same value -is to use "`with`" instead. With rebinds the context `.` within its scope, -and skips the block if the variable is absent: - -``` -{{with .Site.Params.TwitterUser}}{{end}} -``` - -Finally, if you want to pull "magic constants" out of your layouts, you can do -so, such as in this example: - -``` - -``` - -# Template example: Show only upcoming events - -Go allows you to do more than what's shown here. Using Hugo's -[`where`](/templates/functions/#where) function and Go built-ins, we can list -only the items from `content/events/` whose date (set in the front matter) is in -the future: - -

    Upcoming Events

    -
      - {{ range where .Data.Pages.ByDate "Section" "events" }} - {{ if ge .Date.Unix .Now.Unix }} -
    • {{ .Type | title }} — - {{ .Title }} - on - {{ .Date.Format "2 January at 3:04pm" }} - at {{ .Params.place }} -
      • - {{ end }} - {{ end }} - -[go]: http://golang.org/ -[gohtmltemplate]: http://golang.org/pkg/html/template/ -[gostdlibpkgtexttemplate]: http://golang.org/pkg/text/template/ diff --git a/content/templates/homepage.md b/content/templates/homepage.md index c5cebd219..48f0d7781 100644 --- a/content/templates/homepage.md +++ b/content/templates/homepage.md @@ -1,81 +1,81 @@ --- -aliases: -- /layout/homepage/ -lastmod: 2015-08-04 -date: 2013-07-01 +title: Homepage Template +linktitle: Homepage Template +description: The homepage of a website is often formatted differently than the other pages. For this reason, Hugo makes it easy for you to define your new site's homepage as a unique template. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [templates] +#tags: [homepage] menu: - main: - parent: layout -next: /templates/terms -notoc: true -prev: /templates/list -title: Homepage -weight: 50 + docs: + parent: "templates" + weight: 30 +weight: 30 +sections_weight: 30 +draft: false +aliases: [/layout/homepage/,/templates/homepage-template/] +toc: true --- -The home page of a website is often formatted differently than the other -pages. In Hugo you can define your own homepage template. +Homepage is a `Page` and therefore has all the [page variables][pagevars] and [site variables][sitevars] available for use. -Homepage is a `Page` and have all the [page -variables](/templates/variables/) and [site -variables](/templates/variables/) available to use in the templates. +{{% note "The Only Required Template" %}} +The homepage template is the *only* required template for building a site and therefore useful when bootstrapping a new site and template. It is also the only required template if you are developing a single-page website. +{{% /note %}} -*This is the only required template for building a site and useful when -bootstrapping a new site and template. It is also the only required -template when using a single page site.* +## Homepage Template Lookup Order -In addition to the standard page variables, the homepage has access to -all site content accessible from `.Data.Pages`. Details on how to use the -list of pages can be found in the [Lists Template](/templates/list/). +The [lookup order][lookup] for the homepage template is as follows: -Note that a home page can also have a content file with frontmatter, see [Source Organization]({{< relref "overview/source-directory.md#content-for-home-page-and-other-list-pages" >}}). +1. `/layouts/index.html` +2. `/layouts/_default/list.html` +3. `/themes//layouts/index.html` +4. `/themes//layouts/_default/list.html` -## Which Template will be rendered? -Hugo uses a set of rules to figure out which template to use when -rendering a specific page. +## Add Content and Front Matter to the Homepage -Hugo will use the following prioritized list. If a file isn’t present, -then the next one in the list will be used. This enables you to craft -specific layouts when you want to without creating more templates -than necessary. For most sites, only the \_default file at the end of -the list will be needed. +The homepage, similar to other [list pages in Hugo][lists], accepts content and front matter from an `_index.md` file. This file should live at the root of your `content` folder (i.e., `content/_index.md`). You can then add body copy and metadata to your homepage the way you would any other content file. -* /layouts/index.html -* /layouts/\_default/list.html -* /layouts/\_default/single.html -* /themes/`THEME`/layouts/index.html -* /themes/`THEME`/layouts/\_default/list.html -* /themes/`THEME`/layouts/\_default/single.html +See the homepage template below or [Content Organization][contentorg] for more information on the role of `_index.md` in adding content and front matter to list pages. -## Example index.html -This content template is used for [spf13.com](http://spf13.com/). +## `.Data.Pages` on the Homepage -It makes use of [partial templates](/templates/partials/) and uses a similar approach as a [List](/templates/list/). +In addition to the standard [page variables][pagevars], the homepage template has access to *all* site content via `.Data.Pages`. - - - - +## Example Homepage Template - {{ partial "meta.html" . }} +The following is an example of a homepage template that uses [partial][partials], [base][] templates, and a content file at `content/_index.md` to populate the `{{.Title}}` and `{{Content}}` [page variables][pagevars]. - - {{ .Site.Title }} - - - - {{ partial "head_includes.html" . }} - - - - {{ partial "subheader.html" . }} - -
      +{{% code file="layouts/index.html" download="index.html" %}} +```html +{{ define "main" }} +
      +
      +

      {{.Title}}

      + {{ with .Params.subtitle }} + {{.}} + {{ end }} +
      +
      + + {{.Content}} +
      + {{ range first 10 .Data.Pages }} {{ .Render "summary"}} {{ end }}
      -
      + +{{ end }} +``` +{{% /code %}} - {{ partial "footer.html" . }} +[base]: /templates/base/ +[contentorg]: /content-management/organization/ +[lists]: /templates/lists/ +[lookup]: /templates/lookup-order/ +[pagevars]: /variables/page/ +[partials]: /templates/partials/ +[sitevars]: /variables/site/ diff --git a/content/templates/internal.md b/content/templates/internal.md new file mode 100644 index 000000000..ad26e3a66 --- /dev/null +++ b/content/templates/internal.md @@ -0,0 +1,137 @@ +--- +title: Internal Templates +linktitle: Internal Templates +description: Hugo ships with a group of boilerplate templates that cover the most common use cases for static websites. +date: 2017-03-06 +publishdate: 2017-03-06 +lastmod: 2017-03-06 +categories: [templates] +#tags: [internal, analytics,] +menu: + docs: + parent: "templates" + weight: 168 +weight: 168 +sections_weight: 168 +draft: false +aliases: [] +toc: true +wip: true +--- + + +{{% warning %}} +While the following internal templates are called similar to partials, they do *not* observe the partial template lookup order. +{{% /warning %}} + +## Google Analytics + +Hugo ships with internal templates for Google Analytics tracking, including both synchronous and asynchronous tracking codes. + +### Configure Google Analytics + +Provide your tracking id in your configuration file: + +```toml +googleAnalytics = "UA-123-45" +``` + +```yml +googleAnalytics: "UA-123-45" +``` + +### Use the Google Analytics Template + +You can then include the Google Analytics internal template: + +```golang +{{ template "_internal/google_analytics.html" . }} +``` + + +```golang +{{ template "_internal/google_analytics_async.html" . }} +``` + +## Disqus + +Hugo also ships with an internal template for [Disqus comments][disqus], a popular commenting system for both static and dynamic websites. In order to effectively use Disqus, you will need to secure a Disqus "shortname" by [signing up for the free service][disqussignup]. + +### Configure Disqus + +To use Hugo's Disqus template, you first need to set a single value in your site's `config.toml` or `config.yml`: + +```toml +disqusShortname = "yourdiscussshortname" +``` + +```yaml +disqusShortname: "yourdiscussshortname" +``` + +You also have the option to set the following in the front matter for a given piece of content: + +* `disqus_identifier` +* `disqus_title` +* `disqus_url` + +### Use the Disqus Template + +To add Disqus, include the following line in templates where you want your comments to appear: + +```golang +{{ template "_internal/disqus.html" . }} +``` + +### Conditional Loading of Disqus Comments + +Users have noticed that enabling Disqus comments when running the Hugo web server on `localhost` (i.e. via `hugo server`) causes the creation of unwanted discussions on the associated Disqus account. + +You can create the following `layouts/partials/disqus.html`: + +{{% code file="layouts/partials/disqus.html" download="disqus.html" %}} +```html +
      + + +comments powered by Disqus +``` +{{% /code %}} + +The `if` statement skips the initialization of the Disqus comment injection when you are running on `localhost`. + +You can then render your custom Disqus partial template as follows: + +```golang +{{ partial "disqus.html" . }} +``` + +``` +_internal/_default/robots.txt +_internal/_default/rss.xml +_internal/_default/sitemap.xml +_internal/_default/sitemapindex.xml + +_internal/disqus.html +_internal/google_news.html +_internal/google_analytics.html +_internal/google_analytics_async.html +_internal/opengraph.html +_internal/pagination.html +_internal/schema.html +_internal/twitter_cards.html +``` diff --git a/content/templates/introduction.md b/content/templates/introduction.md new file mode 100644 index 000000000..b3f36ded6 --- /dev/null +++ b/content/templates/introduction.md @@ -0,0 +1,498 @@ +--- +title: Introduction to Hugo Templating +linktitle: Introduction +description: Hugo uses Go's `html/template` and `text/template` libraries as the basis for the templating. +godocref: https://golang.org/pkg/html/template/ +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-25 +categories: [templates,fundamentals] +#tags: [go] +menu: + docs: + parent: "templates" + weight: 10 +weight: 10 +sections_weight: 10 +draft: false +aliases: [/templates/introduction/,/layouts/introduction/,/layout/introduction/, /templates/go-templates/] +toc: true +--- + +{{% note %}} +The following is only a primer on Go templates. For an in-depth look into Go templates, check the official [Go docs](http://golang.org/pkg/html/template/). +{{% /note %}} + +Go templates provide an extremely simple template language that adheres to the belief that only the most basic of logic belongs in the template or view layer. + +## Basic Syntax + +Golang templates are HTML files with the addition of [variables][variables] and [functions][functions]. Golang template variables and functions are accessible within `{{ }}`. + +### Access a Predefined Variable + +```golang +{{ foo }} +``` + +Parameters for functions are separated using spaces. The following example calls the `add` function with inputs of `1` and `2`: + +```golang +{{ add 1 2 }} +``` + +#### Methods and Fields are Accessed via dot Notation + +Accessing the Page Parameter `bar` defined in a piece of content's [front matter][]. + +```golang +{{ .Params.bar }} +``` + +#### Parentheses Can be Used to Group Items Together + +```golang +{{ if or (isset .Params "alt") (isset .Params "caption") }} Caption {{ end }} +``` + +## Variables + +Each Go template gets a data object. In Hugo, each template is passed a `Page`. See [variables][] for more information. + +This is how you access a `Page` variable from a template: + +```golang +{{ .Title }} +``` + +Values can also be stored in custom variables and referenced later: + +```golang +{{ $address := "123 Main St."}} +{{ $address }} +``` + +{{% warning %}} +Variables defined inside `if` conditionals and similar are not visible on the outside. See [https://github.com/golang/go/issues/10608](https://github.com/golang/go/issues/10608). + +Hugo has created a workaround for this issue in [Scratch](/functions/scratch). + +{{% /warning %}} + +## Functions + +Go templates only ship with a few basic functions but also provide a mechanism for applications to extend the original set. + +[Hugo template functions][functions] provide additional functionality specific to building websites. Functions are called by using their name followed by the required parameters separated by spaces. Template functions cannot be added without recompiling Hugo. + +### Example 1: Adding Numbers + +```golang +{{ add 1 2 }} +=> 3 +``` + +### Example 2: Comparing Numbers + +```golang +{{ lt 1 2 }} +=> true (i.e., since 1 is less than 2) +``` + +Note that both examples make us of Go template's [math functions][]. + +{{% note "Additional Boolean Operators" %}} +There are more boolean operators than those listed in the Hugo docs in the [Golang template documentation](http://golang.org/pkg/text/template/#hdr-Functions). +{{% /note %}} + +## Includes + +When including another template, you will pass to it the data it will be +able to access. To pass along the current context, please remember to +include a trailing dot. The templates location will always be starting at +the `/layout/` directory within Hugo. + +### Template and Partial Examples + +```golang +{{ template "partials/header.html" . }} +``` + +Starting with Hugo v0.12, you may also use the `partial` call +for [partial templates][partials]: + +```golang +{{ partial "header.html" . }} +``` + +## Logic + +Go templates provide the most basic iteration and conditional logic. + +### Iteration + +Just like in Go, the Go templates make heavy use of `range` to iterate over +a map, array, or slice. The following are different examples of how to use +range. + +#### Example 1: Using Context + +```golang +{{ range array }} + {{ . }} +{{ end }} +``` + +#### Example 2: Declaring Value => Variable name + +```golang +{{range $element := array}} + {{ $element }} +{{ end }} +``` + +#### Example 3: Declaring Key-Value Variable Name + +```golang +{{range $index, $element := array}} + {{ $index }} + {{ $element }} +{{ end }} +``` + +### Conditionals + +`if`, `else`, `with`, `or`, and `and` provide the framework for handling conditional logic in Go Templates. Like `range`, each statement is closed with an `{{end}}`. + +Go Templates treat the following values as false: + +* false +* 0 +* any zero-length array, slice, map, or string + +#### Example 1: `if` + +```golang +{{ if isset .Params "title" }}

      {{ index .Params "title" }}

      {{ end }} +``` + +#### Example 2: `if` … `else` + +```golang +{{ if isset .Params "alt" }} + {{ index .Params "alt" }} +{{else}} + {{ index .Params "caption" }} +{{ end }} +``` + +#### Example 3: `and` & `or` + +```golang +{{ if and (or (isset .Params "title") (isset .Params "caption")) (isset .Params "attr")}} +``` + +#### Example 4: `with` + +An alternative way of writing "`if`" and then referencing the same value +is to use "`with`" instead. `with` rebinds the context `.` within its scope +and skips the block if the variable is absent. + +The first example above could be simplified as: + +```golang +{{ with .Params.title }}

      {{ . }}

      {{ end }} +``` + +#### Example 5: `if` … `else if` + +```golang +{{ if isset .Params "alt" }} + {{ index .Params "alt" }} +{{ else if isset .Params "caption" }} + {{ index .Params "caption" }} +{{ end }} +``` + +## Pipes + +One of the most powerful components of Go templates is the ability to stack actions one after another. This is done by using pipes. Borrowed from Unix pipes, the concept is simple: each pipeline's output becomes the input of the following pipe. + +Because of the very simple syntax of Go templates, the pipe is essential to being able to chain together function calls. One limitation of the pipes is that they can only work with a single value and that value becomes the last parameter of the next pipeline. + +A few simple examples should help convey how to use the pipe. + +### Example 1: `shuffle` + +The following two examples are functionally the same: + +```golang +{{ shuffle (seq 1 5) }} +``` + + +```golang +{{ (seq 1 5) | shuffle }} +``` + +### Example 2: `index` + +The following accesses the page parameter called "disqus_url" and escapes the HTML. This example also uses the [`index` function][index], which is built into Go templates: + +```golang +{{ index .Params "disqus_url" | html }} +``` + +### Example 3: `or` with `isset` + +```golang +{{ if or (or (isset .Params "title") (isset .Params "caption")) (isset .Params "attr") }} +Stuff Here +{{ end }} +``` + +Could be rewritten as + +```golang +{{ if isset .Params "caption" | or isset .Params "title" | or isset .Params "attr" }} +Stuff Here +{{ end }} +``` + +### Example 4: Internet Explorer Conditional Comments + +By default, Go Templates remove HTML comments from output. This has the unfortunate side effect of removing Internet Explorer conditional comments. As a workaround, use something like this: + +```golang +{{ "" | safeHTML }} +``` + +Alternatively, you can use the backtick (`` ` ``) to quote the IE conditional comments, avoiding the tedious task of escaping every double quotes (`"`) inside, as demonstrated in the [examples](http://golang.org/pkg/text/template/#hdr-Examples) in the Go text/template documentation: + +``` +{{ `` | safeHTML }} +``` + +## Context (aka "the dot") + +The most easily overlooked concept to understand about Go templates is that `{{ . }}` always refers to the current context. In the top level of your template, this will be the data set made available to it. Inside of an iteration, however, it will have the value of the current item in the loop; i.e., `{{ . }}` will no longer refer to the data available to the entire page. If you need to access page-level data (e.g., page params set in front matter) from within the loop, you will likely want to do one of the following: + +### 1. Define a Variable Independent of Context + +The following shows how to define a variable independent of the context. + +{{% code file="tags-range-with-page-variable.html" %}} +```html +{{ $title := .Site.Title }} +
        +{{ range .Params.tags }} +
      • + {{ . }} + - {{ $title }} +
        • +{{ end }} +
      +``` +{{% /code %}} + +{{% note %}} +Notice how once we have entered the loop (i.e. `range`), the value of `{{ . }}` has changed. We have defined a variable outside of the loop (`{{$title}}`) that we've assigned a value so that we have access to the value from within the loop as well. +{{% /note %}} + +### 2. Use `$.` to Access the Global Context + +`$` has special significance in your templates. `$` is set to the starting value of `.` ("the dot") by default. This is a [documented feature of Go text/template][dotdoc]. This means you have access to the global context from anywhere. Here is an equivalent example of the preceding code block but now using `$` to grab `.Site.Title` from the global context: + +{{% code file="range-through-tags-w-global.html" %}} +```hbs +
        +{{ range .Params.tags }} +
      • + {{ . }} + - {{ $.Site.Title }} +
        • +{{ end }} +
      +``` +{{% /code %}} + +{{% warning "Don't Redefine the Dot" %}} +The built-in magic of `$` would cease to work if someone were to mischievously redefine the special character; e.g. `{{ $ := .Site }}`. *Don't do it.* You may, of course, recover from this mischief by using `{{ $ := . }}` in a global context to reset `$` to its default value. +{{% /warning %}} + +## Whitespace + +Go 1.6 includes the ability to trim the whitespace from either side of a Go tag by including a hyphen (`-`) and space immediately beside the corresponding `{{` or `}}` delimiter. + +For instance, the following Go template will include the newlines and horizontal tab in its HTML output: + +```html +
      + {{ .Title }} +
      +``` + +Which will output: + +```html +
      + Hello, World! +
      +``` + +Leveraging the `-` in the following example will remove the extra white space surrounding the `.Title` variable and remove the newline: + +```html +
      + {{- .Title -}} +
      +``` + +Which then outputs: + +```html +
      Hello, World!
      +``` + +Go considers the following characters whitespace: + +* space +* horizontal tab +* carriage return +* newline + +## Hugo Parameters + +Hugo provides the option of passing values to your template layer through your [site configuration][config] (i.e. for site-wide values) or through the metadata of each specific piece of content (i.e. the [front matter][]). You can define any values of any type and use them however you want in your templates, as long as the values are supported by the front matter format specified via `metaDataFormat` in your configuration file. + +## Use Content (`Page`) Parameters + +You can provide variables to be used by templates in individual content's [front matter][]. + +An example of this is used in the Hugo docs. Most of the pages benefit from having the table of contents provided, but sometimes the table of contents doesn't make a lot of sense. We've defined a `notoc` variable in our front matter that will prevent a table of contents from rendering when specifically set to `true`. + +Here is the example front matter: + +```yaml +--- +title: Roadmap +lastmod: 2017-03-05 +date: 2013-11-18 +notoc: true +--- +``` + +Here is an example of corresponding code that could be used inside a `toc.html` [partial template][partials]: + +{{% code file="layouts/partials/toc.html" download="toc.html" %}} +```html +{{ if not .Params.notoc }} + + +{{end}} +``` +{{% /code %}} + +We want the *default* behavior to be for pages to include a TOC unless otherwise specified. This template checks to make sure that the `notoc:` field in this page's front matter is not `true`. + +## Use Site Configuration Parameters + +You can arbitrarily define as many site-level parameters as you want in your [site's configuration file][config]. These parameters are globally available in your templates. + +For instance, you might declare the following: + +{{% code file="config.yaml" %}} +```yaml +params: + copyrighthtml: "Copyright © 2017 John Doe. All Rights Reserved." + twitteruser: "spf13" + sidebarrecentlimit: 5 +``` +{{% /code %}} + +Within a footer layout, you might then declare a `
      ` that is only rendered if the `copyrighthtml` parameter is provided. If it *is* provided, you will then need to declare the string is safe to use via the [`safeHTML` function][safehtml] so that the HTML entity is not escaped again. This would let you easily update just your top-level config file each January 1st, instead of hunting through your templates. + +```html +{{if .Site.Params.copyrighthtml}}
      +
      {{.Site.Params.CopyrightHTML | safeHTML}}
      +
      {{end}} +``` + +An alternative way of writing the "`if`" and then referencing the same value is to use [`with`][with] instead. `with` rebinds the context (`.`) within its scope and skips the block if the variable is absent: + +{{% code file="layouts/partials/twitter.html" %}} +```html +{{with .Site.Params.twitteruser}} +
      + +
      +{{end}} +``` +{{% /code %}} + +Finally, you can pull "magic constants" out of your layouts as well. The following uses the [`first`][first] function, as well as the [`.RelPermalink`][relpermalink] page variable and the [`.Site.Pages`][sitevars] site variable. + +```html + +``` + +## Example: Show Only Upcoming Events + +Go allows you to do more than what's shown here. Using Hugo's [`where` function][where] and Go built-ins, we can list only the items from `content/events/` whose date (set in a content file's [front matter][]) is in the future. The following is an example [partial template][partials]: + +{{% code file="layouts/partials/upcoming-events.html" download="upcoming-events.html" %}} +```html +

      Upcoming Events

      +
        +{{ range where .Data.Pages.ByDate "Section" "events" }} + {{ if ge .Date.Unix .Now.Unix }} +
      • + + {{ .Type | title }} — + {{ .Title }} on + + {{ .Date.Format "2 January at 3:04pm" }} + at {{ .Params.place }} +
        • + {{ end }} +{{ end }} +
      +``` +{{% /code %}} + + +[`where` function]: /functions/where/ +[config]: /getting-started/configuration/ +[dotdoc]: http://golang.org/pkg/text/template/#hdr-Variables +[first]: /functions/first/ +[front matter]: /content-management/front-matter/ +[functions]: /functions/ "See the full list of Hugo's templating functions with a quick start reference guide and basic and advanced examples." +[Go html/template]: http://golang.org/pkg/html/template/ "Godocs references for Golang's html templating" +[gohtmltemplate]: http://golang.org/pkg/html/template/ "Godocs references for Golang's html templating" +[index]: /functions/index/ +[math functions]: /functions/math/ +[partials]: /templates/partials/ "Link to the partial templates page inside of the templating section of the Hugo docs" +[relpermalink]: /variables/page/ +[safehtml]: /functions/safehtml/ +[sitevars]: /variables/site/ +[variables]: /variables/ "See the full extent of page-, site-, and other variables that Hugo make available to you in your templates." +[where]: /functions/where/ +[with]: /functions/with/ +[godocsindex]: http://golang.org/pkg/text/template/ "Godocs page for index function" diff --git a/content/templates/list.md b/content/templates/list.md deleted file mode 100644 index 22d3123ac..000000000 --- a/content/templates/list.md +++ /dev/null @@ -1,437 +0,0 @@ ---- -aliases: -- /layout/indexes/ -lastmod: 2015-08-04 -date: 2013-07-01 -linktitle: List of Content -menu: - main: - parent: layout -next: /templates/homepage -prev: /templates/content -title: Content List Template -weight: 40 -toc: true ---- - -A list template is any template that will be used to render multiple pieces of -content in a single HTML page (with the exception of the [homepage](/layout/homepage/) which has a -dedicated template). - -We are using the term list in its truest sense, a sequential arrangement -of material, especially in alphabetical or numerical order. Hugo uses -list templates to render anyplace where content is being listed such as -taxonomies and sections. - -## Which Template will be rendered? - -Hugo uses a set of rules to figure out which template to use when -rendering a specific page. - -Hugo will use the following prioritized list. If a file isn’t present, -then the next one in the list will be used. This enables you to craft -specific layouts when you want to without creating more templates -than necessary. For most sites only the \_default file at the end of -the list will be needed. - - -### Section Lists - -A Section will be rendered at /`SECTION`/ (e.g. http://spf13.com/project/) - -* /layouts/section/`SECTION`.html -* /layouts/`SECTION`/list.html -* /layouts/\_default/section.html -* /layouts/\_default/list.html -* /themes/`THEME`/layouts/section/`SECTION`.html -* /themes/`THEME`/layouts/`SECTION`/list.html -* /themes/`THEME`/layouts/\_default/section.html -* /themes/`THEME`/layouts/\_default/list.html - -Note that a sections list page can also have a content file with frontmatter, see [Source Organization]({{< relref "overview/source-directory.md#content-for-home-page-and-other-list-pages" >}}). - -### Taxonomy Lists - -A Taxonomy will be rendered at /`PLURAL`/`TERM`/ (e.g. http://spf13.com/topics/golang/) from: - -* /layouts/taxonomy/`SINGULAR`.html (e.g. `/layouts/taxonomy/topic.html`) -* /layouts/\_default/taxonomy.html -* /layouts/\_default/list.html -* /themes/`THEME`/layouts/taxonomy/`SINGULAR`.html -* /themes/`THEME`/layouts/\_default/taxonomy.html -* /themes/`THEME`/layouts/\_default/list.html - -Note that a taxonomy list page can also have a content file with frontmatter, see [Source Organization]({{< relref "overview/source-directory.md#content-for-home-page-and-other-list-pages" >}}). - -### Section RSS - -A Section’s RSS will be rendered at /`SECTION`/index.xml (e.g. http://spf13.com/project/index.xml) - -*Hugo ships with its own [RSS 2.0][] template. In most cases this will -be sufficient, and an RSS template will not need to be provided by the -user.* - -Hugo provides the ability for you to define any RSS type you wish, and -can have different RSS files for each section and taxonomy. - -* /layouts/section/`SECTION`.rss.xml -* /layouts/\_default/rss.xml -* /themes/`THEME`/layouts/section/`SECTION`.rss.xml -* /themes/`THEME`/layouts/\_default/rss.xml - -### Taxonomy RSS - -A Taxonomy’s RSS will be rendered at /`PLURAL`/`TERM`/index.xml (e.g. http://spf13.com/topics/golang/index.xml) - -*Hugo ships with its own [RSS 2.0][] template. In most cases this will -be sufficient, and an RSS template will not need to be provided by the -user.* - -Hugo provides the ability for you to define any RSS type you wish, and -can have different RSS files for each section and taxonomy. - -* /layouts/taxonomy/`SINGULAR`.rss.xml -* /layouts/\_default/rss.xml -* /themes/`THEME`/layouts/taxonomy/`SINGULAR`.rss.xml -* /themes/`THEME`/layouts/\_default/rss.xml - - -## Variables - -A list page is a `Page` and have all the [page variables](/templates/variables/) -and [site variables](/templates/variables/) available to use in the templates. - -Taxonomy pages will additionally have: - -**.Data.`Singular`** The taxonomy itself.
      - -## Example List Template Pages - -### Example section template (post.html) -This content template is used for [spf13.com](http://spf13.com/). -It makes use of [partial templates](/templates/partials/). All examples use a -[view](/templates/views/) called either "li" or "summary" which this example site -defined. - - {{ partial "header.html" . }} - {{ partial "subheader.html" . }} - -
      -
      -

      {{ .Title }}

      -
        - {{ range .Data.Pages }} - {{ .Render "li"}} - {{ end }} -
      -
      -
      - - {{ partial "footer.html" . }} - -### Example taxonomy template (tag.html) -This content template is used for [spf13.com](http://spf13.com/). -It makes use of [partial templates](/templates/partials/). All examples use a -[view](/templates/views/) called either "li" or "summary" which this example site -defined. - - {{ partial "header.html" . }} - {{ partial "subheader.html" . }} - -
      -
      -

      {{ .Title }}

      - {{ range .Data.Pages }} - {{ .Render "summary"}} - {{ end }} -
      -
      - - {{ partial "footer.html" . }} - -## Ordering Content - -In the case of Hugo, each list will render the content based on metadata provided in the [front -matter](/content/front-matter/). See [ordering content](/content/ordering/) for more information. - -Here are a variety of different ways you can order the content items in -your list templates: - -### Order by Weight -> Date (default) - - {{ range .Data.Pages }} -
    • - {{ .Title }} -
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      -
      • - {{ end }} - -### Order by Weight -> Date - - {{ range .Data.Pages.ByWeight }} -
    • - {{ .Title }} -
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      -
      • - {{ end }} - -### Order by Date - - {{ range .Data.Pages.ByDate }} -
    • - {{ .Title }} -
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      -
      • - {{ end }} - -### Order by PublishDate - - {{ range .Data.Pages.ByPublishDate }} -
    • - {{ .Title }} -
      {{ .PublishDate.Format "Mon, Jan 2, 2006" }}
      -
      • - {{ end }} - -### Order by ExpiryDate - - {{ range .Data.Pages.ByExpiryDate }} -
    • - {{ .Title }} -
      {{ .ExpiryDate.Format "Mon, Jan 2, 2006" }}
      -
      • - {{ end }} - -### Order by Lastmod - - {{ range .Data.Pages.ByLastmod }} -
    • - {{ .Title }} -
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      -
      • - {{ end }} - -### Order by Length - - {{ range .Data.Pages.ByLength }} -
    • - {{ .Title }} -
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      -
      • - {{ end }} - - -### Order by Title - - {{ range .Data.Pages.ByTitle }} -
    • - {{ .Title }} -
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      -
      • - {{ end }} - -### Order by LinkTitle - - {{ range .Data.Pages.ByLinkTitle }} -
    • - {{ .LinkTitle }} -
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      -
      • - {{ end }} - -### Order by Parameter - -Order based on the specified frontmatter parameter. Pages without that -parameter will use the site's `.Site.Params` default. If the parameter is not -found at all in some entries, those entries will appear together at the end -of the ordering. - -The below example sorts a list of posts by their rating. - - {{ range (.Data.Pages.ByParam "rating") }} - - {{ end }} - -If the frontmatter field of interest is nested beneath another field, you can -also get it: - - {{ range (.Data.Pages.ByParam "author.last_name") }} - - {{ end }} - -### Reverse Order -Can be applied to any of the above. Using Date for an example. - - {{ range .Data.Pages.ByDate.Reverse }} -
    • - {{ .Title }} -
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      -
      • - {{ end }} - -## Grouping Content - -Hugo provides some grouping functions for list pages. You can use them to -group pages by Section, Type, Date etc. - -Here are a variety of different ways you can group the content items in -your list templates: - -### Grouping by Page field - - {{ range .Data.Pages.GroupBy "Section" }} -

      {{ .Key }}

      -
        - {{ range .Pages }} -
      • - {{ .Title }} -
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        -
        • - {{ end }} -
      - {{ end }} - -### Grouping by Page date - - {{ range .Data.Pages.GroupByDate "2006-01" }} -

      {{ .Key }}

      -
        - {{ range .Pages }} -
      • - {{ .Title }} -
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        -
        • - {{ end }} -
      - {{ end }} - -### Grouping by Page publish date - - {{ range .Data.Pages.GroupByPublishDate "2006-01" }} -

      {{ .Key }}

      -
        - {{ range .Pages }} -
      • - {{ .Title }} -
        {{ .PublishDate.Format "Mon, Jan 2, 2006" }}
        -
        • - {{ end }} -
      - {{ end }} - -### Grouping by Page param - - {{ range .Data.Pages.GroupByParam "param_key" }} -

      {{ .Key }}

      -
        - {{ range .Pages }} -
      • - {{ .Title }} -
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        -
        • - {{ end }} -
      - {{ end }} - -### Grouping by Page param in date format - - {{ range .Data.Pages.GroupByParamDate "param_key" "2006-01" }} -

      {{ .Key }}

      -
        - {{ range .Pages }} -
      • - {{ .Title }} -
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        -
        • - {{ end }} -
      - {{ end }} - -### Reversing Key Order - -The ordering of the groups is performed by keys in alphanumeric order (A–Z, -1–100) and in reverse chronological order (newest first) for dates. - -While these are logical defaults, they are not always the desired order. There -are two different syntaxes to change the order; they both work the same way, so -it’s really just a matter of preference. - -#### Reverse method - - {{ range (.Data.Pages.GroupBy "Section").Reverse }} - ... - - {{ range (.Data.Pages.GroupByDate "2006-01").Reverse }} - ... - - -#### Providing the (alternate) direction - - {{ range .Data.Pages.GroupByDate "2006-01" "asc" }} - ... - - {{ range .Data.Pages.GroupBy "Section" "desc" }} - ... - -### Ordering Pages within Group - -Because Grouping returns a key and a slice of pages, all of the ordering methods listed above are available. - -In this example, I’ve ordered the groups in chronological order and the content -within each group in alphabetical order by title. - - {{ range .Data.Pages.GroupByDate "2006-01" "asc" }} -

      {{ .Key }}

      -
        - {{ range .Pages.ByTitle }} -
      • - {{ .Title }} -
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        -
        • - {{ end }} -
      - {{ end }} - -## Filtering & Limiting Content - -Sometimes you only want to list a subset of the available content. A common -request is to only display “Posts” on the homepage. Using the `where` function, -you can do just that. - -### `first` - -`first` works like the `limit` keyword in SQL. It reduces the array to only the -first _N_ elements. It takes the array and number of elements as input. - - {{ range first 10 .Data.Pages }} - {{ .Render "summary" }} - {{ end }} - -### `where` - -`where` works in a similar manner to the `where` keyword in SQL. It selects all -elements of the slice that match the provided field and value. It takes three -arguments: 'array or slice of maps or structs', 'key or field name' and 'match -value'. - - {{ range where .Data.Pages "Section" "post" }} - {{ .Content }} - {{ end }} - -### `first` & `where` Together - -Using both together can be very powerful. - - {{ range first 5 (where .Data.Pages "Section" "post") }} - {{ .Content }} - {{ end }} - -If `where` or `first` receives invalid input or a field name that doesn’t exist, -it will return an error and stop site generation. - -These are both template functions and work on not only -[lists](/templates/list/), but [taxonomies](/taxonomies/displaying/), -[terms](/templates/terms/) and [groups](/templates/list/). - - -[RSS 2.0]: http://cyber.law.harvard.edu/rss/rss.html "RSS 2.0 Specification" diff --git a/content/templates/lists.md b/content/templates/lists.md new file mode 100644 index 000000000..def088ebe --- /dev/null +++ b/content/templates/lists.md @@ -0,0 +1,651 @@ +--- +title: Lists of Content in Hugo +linktitle: List Page Templates +description: Lists have a specific meaning and usage in Hugo when it comes to rendering your site homepage, section page, taxonomy list, or taxonomy terms list. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [templates] +#tags: [lists,sections,rss,taxonomies,terms] +menu: + docs: + parent: "templates" + weight: 22 +weight: 22 +sections_weight: 22 +draft: false +aliases: [/templates/list/,/layout/indexes/] +toc: true +--- + +## What is a List Page Template? + +A list page template is a template used to render multiple pieces of content in a single HTML page. The exception to this rule is the homepage, which is still a list but has its own [dedicated template][homepage]. + +Hugo uses the term *list* in its truest sense; i.e. a sequential arrangement of material, especially in alphabetical or numerical order. Hugo uses list templates on any output HTML page where content is traditionally listed: + +* [Taxonomy terms pages][taxterms] +* [Taxonomy list pages][taxlists] +* [Section list pages][sectiontemps] +* [RSS][rss] + +The idea of a list page comes from the [hierarchical mental model of the web][mentalmodel] and is best demonstrated visually: + +![Image demonstrating a hierarchical website sitemap.](/images/site-hierarchy.svg) + +## List Defaults + +### Default Templates + +Since section lists and taxonomy lists (N.B., *not* [taxonomy terms lists][taxterms]) are both *lists* with regards to their templates, both have the same terminating default of `_default/list.html` or `themes//layouts/_default/list.html` in their lookup order. In addition, both [section lists][sectiontemps] and [taxonomy lists][taxlists] have their own default list templates in `_default`: + +#### Default Section Templates + +1. `layouts/_default/section.html` +2. `layouts/_default/list.html` + +#### Default Taxonomy List Templates + +1. `layouts/_default/taxonomy.html` +2. `themes//layouts/_default/taxonomy.html` + +## Add Content and Front Matter to List Pages + +Since v0.18, [everything in Hugo is a `Page`][bepsays]. This means list pages and the homepage can have associated content files (i.e. `_index.md`) that contain page metadata (i.e., front matter) and content. + +This new model allows you to include list-specific front matter via `.Params` and also means that list templates (e.g., `layouts/_default/list.html`) have access to all [page variables][pagevars]. + +{{% note %}} +It is important to note that all `_index.md` content files will render according to a *list* template and not according to a [single page template](/templates/single-page-templates/). +{{% /note %}} + +### Example Project Directory + +The following is an example of a typical Hugo project directory's content: + +```bash +. +... +├── content +| ├── post +| | ├── _index.md +| | ├── post-01.md +| | └── post-02.md +| └── quote +| | ├── quote-01.md +| | └── quote-02.md +... +``` + +Using the above example, let's assume you have the following in `content/post/_index.md`: + +{{% code file="content/post/_index.md" %}} +```yaml +--- +title: My Golang Journey +date: 2017-03-23 +publishdate: 2017-03-24 +--- + +I decided to start learning Golang in March 2017. + +Follow my journey through this new blog. +``` +{{% /code %}} + +You can now access this `_index.md`'s' content in your list template: + +{{% code file="layouts/_default/list.html" download="list.html" %}} +```html +{{ define "main" }} +
      +
      +
      +

      {{.Title}}

      +
      + + {{.Content}} +
      + +
      +{{ end }} +``` +{{% /code %}} + +This above will output the following HTML: + +{{% code file="yoursite.com/post/index.html" copy="false" %}} +```html + +
      +
      +
      +

      My Golang Journey

      +
      +

      I decided to start learning Golang in March 2017.

      +

      Follow my journey through this new blog.

      +
      + +
      + +``` +{{% /code %}} + +### List Pages Without `_index.md` + +You do *not* have to create an `_index.md` file for every list page (i.e. section, taxonomy, taxonomy terms, etc) or the homepage. If Hugo does not find an `_index.md` within the respective content section when rendering a list template, the page will be created but with no `{{.Content}}` and only the default values for `.Title` etc. + +Using this same `layouts/_default/list.html` template and applying it to the the `quotes` section above will render the following output. Note that `quotes` does not have an `_index.md` file to pull from: + +{{% code file="yoursite.com/quote/index.html" copy="false" %}} +```html + +
      +
      +
      + +

      Quotes

      +
      +
      + +
      + +``` +{{% /code %}} + +{{% note %}} +The default behavior of Hugo is to pluralize list titles; hence the inflection of the `quote` section to "Quotes" when called with the `.Title` [page variable](/variables/page/). You can change this via the `pluralizeListTitles` directive in your [site configuration](/getting-started/configuration/). +{{% /note %}} + +## Example List Templates + +### Section Template + +This list template has been modified slightly from a template originally used in [spf13.com](http://spf13.com/). It makes use of [partial templates][partials] for the chrome of the rendered page rather than using a [base template][base] The examples that follow also use the [content view templates][views] `li.html` or `summary.html`. + +{{% code file="layouts/section/post.html" %}} +```html +{{ partial "header.html" . }} +{{ partial "subheader.html" . }} +
      +
      +

      {{ .Title }}

      +
        + + {{ range .Data.Pages }} + {{ .Render "li"}} + {{ end }} +
      +
      +
      +{{ partial "footer.html" . }} +``` +{{% /code %}} + +### Taxonomy Template + +{{% code file="layouts/_default/taxonomies.html" download="taxonomies.html" %}} +```html +{{ define "main" }} +
      +
      +

      {{ .Title }}

      + + {{ range .Data.Pages }} + {{ .Render "summary"}} + {{ end }} +
      +
      +{{ end }} +``` +{{% /code %}} + +## Order Content + +Hugo lists render the content based on metadata you provide in [front matter][]. In addition to sane defaults, Hugo also ships with multiple methods to make quick work of ordering content inside list templates: + +### Default List Ordering: Weight > Date + +{{% code file="layouts/partials/default-order.html" %}} +```html +
        + {{ range .Data.Pages }} +
      • +

        {{ .Title }}

        + +
        • + {{ end }} +
      +``` +{{% /code %}} + +### By Weight + +{{% code file="layouts/partials/by-weight.html" %}} +```html +
        + {{ range .Data.Pages.ByWeight }} +
      • +

        {{ .Title }}

        + +
        • + {{ end }} +
      +``` +{{% /code %}} + +### By Date + +{{% code file="layouts/partials/by-date.html" %}} +```html +
        + + {{ range .Data.Pages.ByDate }} +
      • +

        {{ .Title }}

        + +
        • + {{ end }} +
      +``` +{{% /code %}} + +### By Publish Date + +{{% code file="layouts/partials/by-publish-date.html" %}} +```html +
        + + {{ range .Data.Pages.ByPublishDate }} +
      • +

        {{ .Title }}

        + +
        • + {{ end }} +
      +``` +{{% /code %}} + +### By Expiration Date + +{{% code file="layouts/partials/by-expiry-date.html" %}} +```html +
        + {{ range .Data.Pages.ByExpiryDate }} +
      • +

        {{ .Title }}

        + +
        • + {{ end }} +
      +``` +{{% /code %}} + +### By Last Modified Date + +{{% code file="layouts/partials/by-last-mod.html" %}} +```html +
        + + {{ range .Data.Pages.ByLastmod }} +
      • +

        {{ .Title }}

        + +
        • + {{ end }} +
      +``` +{{% /code %}} + +### By Length + +{{% code file="layouts/partials/by-length.html" %}} +```html +
        + + {{ range .Data.Pages.ByLength }} +
      • +

        {{ .Title }}

        + +
        • + {{ end }} +
      +``` +{{% /code %}} + +### By Title + +{{% code file="layouts/partials/by-title.html" %}} +```html +
        + + {{ range .Data.Pages.ByTitle }} +
      • +

        {{ .Title }}

        + +
        • + {{ end }} +
      +``` +{{% /code %}} + +### By Link Title + +{{% code file="layouts/partials/by-link-title.html" %}} +```html +
        + + {{ range .Data.Pages.ByLinkTitle }} +
      • +

        {{ .LinkTitle }}

        + +
        • + {{ end }} +
      +``` +{{% /code %}} + +### By Parameter + +Order based on the specified front matter parameter. Content that does not have the specified front matter field will use the site's `.Site.Params` default. If the parameter is not found at all in some entries, those entries will appear together at the end of the ordering. + +{{% code file="layouts/partials/by-rating.html" %}} +```html + +{{ range (.Data.Pages.ByParam "rating") }} + +{{ end }} +``` +{{% /code %}} + +If the targeted front matter field is nested beneath another field, you can access the field using dot notation. + +{{% code file="layouts/partials/by-nested-param.html" %}} +```html +{{ range (.Data.Pages.ByParam "author.last_name") }} + +{{ end }} +``` +{{% /code %}} + +### Reverse Order + +Reversing order can be applied to any of the above methods. The following uses `ByDate` as an example: + +{{% code file="layouts/partials/by-date-reverse.html" %}} +```html +
        + {{ range .Data.Pages.ByDate.Reverse }} +
      • +

        {{ .Title }}

        + +
        • + {{ end }} +
      +``` +{{% /code %}} + +## Group Content + +Hugo provides some functions for grouping pages by Section, Type, Date, etc. + +### By Page Field + +{{% code file="layouts/partials/by-page-field.html" %}} +```html + +{{ range .Data.Pages.GroupBy "Section" }} +

      {{ .Key }}

      +
        + {{ range .Pages }} +
      • + {{ .Title }} +
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        +
        • + {{ end }} +
      +{{ end }} +``` +{{% /code %}} + +In the above example, you may want `{{.Title}}` to point the `title` field you have added to your `_index.md` file instead. You can access this value using the [`.GetPage` function][getpage]: + +{{% code file="layouts/partials/by-page-field.html" %}} +```html + +{{ range .Data.Pages.GroupBy "Section" }} + +{{ with $.Site.GetPage "section" .Key }} +

      {{.Title}}

      +{{ else }} + +

      {{ .Key | title }}

      +{{ end }} +
        + {{ range .Pages }} +
      • + {{ .Title }} +
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        +
        • + {{ end }} +
      +{{ end }} +``` +{{% /code %}} + +### By Date + +{{% code file="layouts/partials/by-page-date.html" %}} +```html + +{{ range .Data.Pages.GroupByDate "2006-01" }} +

      {{ .Key }}

      +
        + {{ range .Pages }} +
      • + {{ .Title }} +
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        +
        • + {{ end }} +
      +{{ end }} +``` +{{% /code %}} + +### By Publish Date + +{{% code file="layouts/partials/by-page-publish-date.html" %}} +```html + +{{ range .Data.Pages.GroupByPublishDate "2006-01" }} +

      {{ .Key }}

      +
        + {{ range .Pages }} +
      • + {{ .Title }} +
        {{ .PublishDate.Format "Mon, Jan 2, 2006" }}
        +
        • + {{ end }} +
      +{{ end }} +``` +{{% /code %}} + +### By Page Parameter + +{{% code file="layouts/partials/by-page-param.html" %}} +```html + +{{ range .Data.Pages.GroupByParam "param_key" }} +

      {{ .Key }}

      +
        + {{ range .Pages }} +
      • + {{ .Title }} +
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        +
        • + {{ end }} +
      +{{ end }} +``` +{{% /code %}} + +### By Page Parameter in Date Format + +The following template takes grouping by `date` a step further and uses Golang's layout string. See the [`Format` function][] for more examples of how to use Golang's layout string to format dates in Hugo. + +{{% code file="layouts/partials/by-page-param-as-date.html" %}} +```html + +{{ range .Data.Pages.GroupByParamDate "param_key" "2006-01" }} +

      {{ .Key }}

      +
        + {{ range .Pages }} +
      • + {{ .Title }} +
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        +
        • + {{ end }} +
      +{{ end }} +``` +{{% /code %}} + +### Reverse Key Order + +Ordering of groups is performed by keys in alphanumeric order (A–Z, 1–100) and in reverse chronological order (i.e., with the newest first) for dates. + +While these are logical defaults, they are not always the desired order. There are two different syntaxes to change Hugo's default ordering for groups, both of which work the same way. + +#### 1. Adding the Reverse Method + +```html +{{ range (.Data.Pages.GroupBy "Section").Reverse }} +``` + +```html +{{ range (.Data.Pages.GroupByDate "2006-01").Reverse }} +``` + +#### 2. Providing the Alternate Direction + +```html +{{ range .Data.Pages.GroupByDate "2006-01" "asc" }} +``` + +```html +{{ range .Data.Pages.GroupBy "Section" "desc" }} +``` + +### Order Within Groups + +Because Grouping returns a `{{.Key}}` and a slice of pages, all of the ordering methods listed above are available. + +Here is the ordering for the example that follows: + +1. Content is grouped by month according to the `date` field in front matter. +2. Groups are listed in ascending order (i.e., the oldest groups first) +3. Pages within each respective group are ordered alphabetically according to the `title`. + +{{% code file="layouts/partials/by-group-by-page.html" %}} +```html +{{ range .Data.Pages.GroupByDate "2006-01" "asc" }} +

      {{ .Key }}

      +
        + {{ range .Pages.ByTitle }} +
      • + {{ .Title }} +
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        +
        • + {{ end }} +
      +{{ end }} +``` +{{% /code %}} + +## Filter and Limiting Lists + +Sometimes you only want to list a subset of the available content. A common is to only display “Posts” on blog's homepage. You can accomplish this with the `where` function. + +### `where` + +`where` works in a similar manner to the [`where` keyword in SQL][wherekeyword]. It selects all elements of the array or slice that match the provided field and value. `where` takes three arguments: + +1. `array` *or* `slice of maps or structs` +2. `key` *or* `field name` +3. `match value` + +{{% code file="layouts/_default/.html" %}} +```html +{{ range where .Data.Pages "Section" "post" }} + {{ .Content }} +{{ end }} +``` +{{% /code %}} + +You can see more examples in the [functions documentation for `where`][wherefunction]. + +### `first` + +`first` works in a similar manner to the [`limit` keyword in SQL][limitkeyword]. It reduces the array to only the `first N` elements. It takes the array and number of elements as input. `first` takes two arguments: + +1. `array` *or* `slice of maps or structs` +2. `number of elements` + +{{% code file="layout/_default/section.html" %}} +```html +{{ range first 10 .Data.Pages }} + {{ .Render "summary" }} +{{ end }} +``` +{{% /code %}} + +### `first` and `where` Together + +Using `first` and `where` together can be very powerful: + +{{% code file="first-and-where-together.html" %}} +```html + +{{ range first 5 (where .Data.Pages "Section" "post").ByTitle }} + {{ .Content }} +{{ end }} +``` +{{% /code %}} + +[base]: /templates/base/ +[bepsays]: http://bepsays.com/en/2016/12/19/hugo-018/ +[directorystructure]: /getting-started/directory-structure/ +[`Format` function]: /functions/format/ +[front matter]: /content-management/front-matter/ +[getpage]: /functions/getpage/ +[homepage]: /templates/homepage/ +[homepage]: /templates/homepage/ +[limitkeyword]: https://www.techonthenet.com/sql/select_limit.php +[mentalmodel]: http://webstyleguide.com/wsg3/3-information-architecture/3-site-structure.html +[pagevars]: /variables/page/ +[partials]: /templates/partials/ +[RSS 2.0]: http://cyber.law.harvard.edu/rss/rss.html "RSS 2.0 Specification" +[rss]: /templates/rss/ +[sections]: /content-management/sections/ +[sectiontemps]: /templates/section-templates/ +[sitevars]: /variables/site/ +[taxlists]: /templates/taxonomy-templates/#taxonomy-list-templates/ +[taxterms]: /templates/taxonomy-templates/#taxonomy-terms-templates/ +[taxvars]: /variables/taxonomy/ +[views]: /templates/views/ +[wherefunction]: /functions/where/ +[wherekeyword]: https://www.techonthenet.com/sql/where.php \ No newline at end of file diff --git a/content/templates/lookup-order.md b/content/templates/lookup-order.md new file mode 100644 index 000000000..37d994eed --- /dev/null +++ b/content/templates/lookup-order.md @@ -0,0 +1,197 @@ +--- +title: Hugo's Lookup Order +linktitle: Template Lookup Order +description: The lookup order is a prioritized list used by Hugo as it traverses your files looking for the appropriate corresponding file to render your content. +godocref: +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-05-25 +categories: [templates,fundamentals] +#tags: [lookup] +menu: + docs: + parent: "templates" + weight: 15 + quicklinks: +weight: 15 +sections_weight: 15 +draft: false +aliases: [/templates/lookup/] +toc: true +--- + +Before creating your templates, it's important to know how Hugo looks for files within your project's [directory structure][]. + +Hugo uses a prioritized list called the **lookup order** as it traverses your `layouts` folder in your Hugo project *looking* for the appropriate template to render your content. + +The template lookup order is an inverted cascade: if template A isn’t present or specified, Hugo will look to template B. If template B isn't present or specified, Hugo will look for template C...and so on until it reaches the `_default/` directory for your project or theme. In many ways, the lookup order is similar to the programming concept of a [switch statement without fallthrough][switch]. + +The power of the lookup order is that it enables you to craft specific layouts and keep your templating [DRY][]. + +{{% note %}} +Most Hugo websites will only need the default template files at the end of the lookup order (i.e. `_default/*.html`). +{{% /note %}} + +## Lookup Orders + +The respective lookup order for each of Hugo's templates has been defined throughout the Hugo docs: + +* [Homepage Template][home] +* [Base Templates][base] +* [Section Page Templates][sectionlookup] +* [Taxonomy List Templates][taxonomylookup] +* [Taxonomy Terms Templates][termslookup] +* [Single Page Templates][singlelookup] +* [RSS Templates][rsslookup] +* [Shortcode Templates][sclookup] + +## Template Lookup Examples + +The lookup order is best illustrated through examples. The following shows you the process Hugo uses for finding the appropriate template to render your [single page templates][], but the concept holds true for all templates in Hugo. + +1. The project is using the theme `mytheme` (specified in the project's [configuration][config]). +2. The layouts and content directories for the project are as follows: + +```bash +. +├── content +│ ├── events +│ │ ├── _index.md +│ │ └── my-first-event.md +│ └── posts +│ ├── my-first-post.md +│ └── my-second-post.md +├── layouts +│ ├── _default +│ │ └── single.html +│ ├── posts +│ │ └── single.html +│ └── reviews +│ └── reviewarticle.html +└── themes + └── mytheme + └── layouts + ├── _default + │ ├── list.html + │ └── single.html + └── posts + ├── list.html + └── single.html +``` + + +Now we can look at the front matter for the three content (i.e.`.md`) files. + +{{% note %}} +Only three of the four markdown files in the above project are subject to the *single* page lookup order. `_index.md` is a specific `kind` in Hugo. Whereas `my-first-post.md`, `my-second-post.md`, and `my-first-event.md` are all of kind `page`, all `_index.md` files in a Hugo project are used to add content and front matter to [list pages](/templates/lists/). In this example, `events/_index.md` will render according to its [section template](/templates/section-templates/) and respective lookup order. +{{% /note %}} + +### Example: `my-first-post.md` + +{{% code file="content/posts/my-first-post.md" copy="false" %}} +```yaml +--- +title: My First Post +date: 2017-02-19 +description: This is my first post. +--- +``` +{{% /code %}} + +When building your site, Hugo will go through the lookup order until it finds what it needs for `my-first-post.md`: + +1. ~~`/layouts/UNSPECIFIED/UNSPECIFIED.html`~~ +2. ~~`/layouts/posts/UNSPECIFIED.html`~~ +3. ~~`/layouts/UNSPECIFIED/single.html`~~ +4. `/layouts/posts/single.html` +
      BREAK +5. `/layouts/_default/single.html` +6. `/themes//layouts/UNSPECIFIED/UNSPECIFIED.html` +7. `/themes//layouts/posts/UNSPECIFIED.html` +8. `/themes//layouts/UNSPECIFIED/single.html` +9. `/themes//layouts/posts/single.html` +10. `/themes//layouts/_default/single.html` + +Notice the term `UNSPECIFIED` rather than `UNDEFINED`. If you don't tell Hugo the specific type and layout, it makes assumptions based on sane defaults. `my-first-post.md` does not specify a content `type` in its front matter. Therefore, Hugo assumes the content `type` and `section` (i.e. `posts`, which is defined by file location) are one in the same. ([Read more on sections][sections].) + +`my-first-post.md` also does not specify a `layout` in its front matter. Therefore, Hugo assumes that `my-first-post.md`, which is of type `page` and a *single* piece of content, should default to the next occurrence of a `single.html` template in the lookup (#4). + +### Example: `my-second-post.md` + +{{% code file="content/posts/my-second-post.md" copy="false" %}} +```yaml +--- +title: My Second Post +date: 2017-02-21 +description: This is my second post. +type: review +layout: reviewarticle +--- +``` +{{% /code %}} + +Here is the way Hugo traverses the single-page lookup order for `my-second-post.md`: + +1. `/layouts/review/reviewarticle.html` +
      BREAK +2. `/layouts/posts/reviewarticle.html` +3. `/layouts/review/single.html` +4. `/layouts/posts/single.html` +5. `/layouts/_default/single.html` +6. `/themes//layouts/review/reviewarticle.html` +7. `/themes//layouts/posts/reviewarticle.html` +8. `/themes//layouts/review/single.html` +9. `/themes//layouts/posts/single.html` +10. `/themes//layouts/_default/single.html` + +The front matter in `my-second-post.md` specifies the content `type` (i.e. `review`) as well as the `layout` (i.e. `reviewarticle`). Hugo finds the layout it needs at the top level of the lookup (#1) and does not continue to search through the other templates. + +{{% note "Type and not Types" %}} +Notice that the directory for the template for `my-second-post.md` is `review` and not `reviews`. This is because *type is always singular when defined in front matter*. +{{% /note%}} + +### Example: `my-first-event.md` + +{{% code file="content/events/my-first-event.md" copy="false" %}} +```yaml +--- +title: My First +date: 2017-02-21 +description: This is an upcoming event.. +--- +``` +{{% /code %}} + +Here is the way Hugo traverses the single-page lookup order for `my-first-event.md`: + +1. ~~`/layouts/UNSPECIFIED/UNSPECIFIED.html`~~ +2. ~~`/layouts/events/UNSPECIFIED.html`~~ +3. ~~`/layouts/UNSPECIFIED/single.html`~~ +4. ~~`/layouts/events/single.html`~~ +5. `/layouts/_default/single.html` +
      BREAK +6. `/themes//layouts/UNSPECIFIED/UNSPECIFIED.html` +7. `/themes//layouts/events/UNSPECIFIED.html` +8. `/themes//layouts/UNSPECIFIED/single.html` +9. `/themes//layouts/events/single.html` +10. `/themes//layouts/_default/single.html` + + +{{% note %}} +`my-first-event.md` is significant because it demonstrates the role of the lookup order in Hugo themes. Both the root project directory *and* the `mytheme` themes directory have a file at `_default/single.html`. Understanding this order allows you to [customize Hugo themes](/themes/customizing/) by creating template files with identical names in your project directory that step in front of theme template files in the lookup. This allows you to customize the look and feel of your website while maintaining compatibility with the theme's upstream. +{{% /note %}} + +[base]: /templates/base/#base-template-lookup-order +[config]: /getting-started/configuration/ +[directory structure]: /getting-started/directory-structure/ +[DRY]: https://en.wikipedia.org/wiki/Don%27t_repeat_yourself +[home]: /templates/homepage/#homepage-template-lookup-order +[rsslookup]: /templates/rss/#rss-template-lookup-order +[sclookup]: /templates/shortcode-templates/#shortcode-template-lookup-order +[sections]: /content-management/sections/ +[sectionlookup]: /templates/section-templates/#section-template-lookup-order +[single page templates]: /templates/single-page-templates/ +[singlelookup]: /templates/single-page-templates/#single-page-template-lookup-order +[switch]: https://en.wikipedia.org/wiki/Switch_statement#Fallthrough +[taxonomylookup]: /templates/taxonomy-templates/#taxonomy-list-template-lookup-order +[termslookup]: /templates/taxonomy-templates/#taxonomy-terms-template-lookup-order diff --git a/content/templates/menu-templates.md b/content/templates/menu-templates.md new file mode 100644 index 000000000..791825d16 --- /dev/null +++ b/content/templates/menu-templates.md @@ -0,0 +1,107 @@ +--- +title: Menu Templates +linktitle: Menu Templates +description: Menus are a powerful but simple feature for content management but can be easily manipulated in your templates to meet your design needs. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [templates] +#tags: [lists,sections,menus] +menu: + docs: + parent: "templates" + weight: 130 +weight: 130 +sections_weight: 130 +draft: false +aliases: [/templates/menus/] +toc: false +--- + +Hugo makes no assumptions about how your rendered HTML will be +structured. Instead, it provides all of the functions you will need to be +able to build your menu however you want. + +The following is an example: + +{{% code file="layouts/partials/sidebar.html" download="sidebar.html" %}} +```html + + + +``` +{{% /code %}} + +{{% note "`absLangURL` and `relLangURL`" %}} +Use the [`absLangUrl`](/functions/abslangurl) or [`relLangUrl`](/functions/rellangurl) functions if your theme makes use of the [multilingual feature](/content-management/multilingual/). In contrast to `absURL` and `relURL`, these two functions add the correct language prefix to the url. +{{% /note %}} + +## Section Menu for Lazy Bloggers + +To enable this menu, add the following to your site `config`: + +```toml +SectionPagesMenu = "main" +``` + +The menu name can be anything, but take a note of what it is. + +This will create a menu with all the sections as menu items and all the sections' pages as "shadow-members". The _shadow_ implies that the pages isn't represented by a menu-item themselves, but this enables you to create a top-level menu like this: + +```html + +``` + +In the above, the menu item is marked as active if on the current section's list page or on a page in that section. + +The above is all that's needed. But if you want custom menu items, e.g. changing weight or name, you can define them manually in the site config, i.e. `config.toml`: + +```toml +[[menu.main]] + name = "This is the blog section" + weight = -110 + identifier = "blog" + url = "/blog/" +``` + +{{% note %}} +The `identifier` *must* match the section name. +{{% /note %}} diff --git a/content/templates/ordering-and-grouping.md b/content/templates/ordering-and-grouping.md new file mode 100644 index 000000000..492392d8e --- /dev/null +++ b/content/templates/ordering-and-grouping.md @@ -0,0 +1,425 @@ +--- +title: Ordering and Grouping Hugo Lists +linktitle: List Ordering and Grouping +description: You can group or order your content in both your templating and content front matter. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [templates] +#tags: [] +menu: + docs: + parent: "templates" + weight: 27 +weight: 27 +sections_weight: 27 +draft: true +aliases: [/templates/ordering/,/templates/grouping/] +toc: true +notes: This was originally going to be a separate page on the new docs site but it now makes more sense to keep everything within the templates/lists page. - rdwatters, 2017-03-12. +--- + +In Hugo, A list template is any template that will be used to render multiple pieces of content in a single HTML page. + +## Example List Templates + +### Section Template + +This list template is used for [spf13.com](http://spf13.com/). It makes use of [partial templates][partials]. All examples use a [view](/templates/views/) called either "li" or "summary." + +{{% code file="layouts/section/post.html" %}} +```html +{{ partial "header.html" . }} +{{ partial "subheader.html" . }} + +
      +
      +

      {{ .Title }}

      +
        + {{ range .Data.Pages }} + {{ .Render "li"}} + {{ end }} +
      +
      +
      +{{ partial "footer.html" . }} +``` +{{% /code %}} + +### Taxonomy Template + +{{% code file="layouts/_default/taxonomies.html" download="taxonomies.html" %}} +```html +{{ define "main" }} +
      +
      +

      {{ .Title }}

      + {{ range .Data.Pages }} + {{ .Render "summary"}} + {{ end }} +
      +
      +{{ end }} +``` +{{% /code %}} + +## Order Content + +Hugo lists render the content based on metadata provided in the [front matter](/content-management/front-matter/).. + +Here are a variety of different ways you can order the content items in +your list templates: + +### Default: Weight > Date + +{{% code file="layouts/partials/order-default.html" %}} +```html +
        + {{ range .Data.Pages }} +
      • +

        {{ .Title }}

        + +
        • + {{ end }} +
      +``` +{{% /code %}} + +### By Weight + +{{% code file="layouts/partials/by-weight.html" %}} +```html +{{ range .Data.Pages.ByWeight }} +
    • + {{ .Title }} +
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      +
      • +{{ end }} +``` +{{% /code %}} + +### By Date + +{{% code file="layouts/partials/by-date.html" %}} +```html +{{ range .Data.Pages.ByDate }} +
    • + {{ .Title }} +
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      +
      • +{{ end }} +``` +{{% /code %}} + +### By Publish Date + +{{% code file="layouts/partials/by-publish-date.html" %}} +```html +{{ range .Data.Pages.ByPublishDate }} +
    • + {{ .Title }} +
      {{ .PublishDate.Format "Mon, Jan 2, 2006" }}
      +
      • +{{ end }} +``` +{{% /code %}} + +### By Expiration Date + +{{% code file="layouts/partials/by-expiry-date.html" %}} +```html +{{ range .Data.Pages.ByExpiryDate }} +
    • + {{ .Title }} +
      {{ .ExpiryDate.Format "Mon, Jan 2, 2006" }}
      +
      • +{{ end }} +``` +{{% /code %}} + +### By Last Modified Date + +{{% code file="layouts/partials/by-last-mod.html" %}} +```html +{{ range .Data.Pages.ByLastmod }} +
    • + {{ .Title }} +
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      +
      • +{{ end }} +``` +{{% /code %}} + +### By Length + +{{% code file="layouts/partials/by-length.html" %}} +```html +{{ range .Data.Pages.ByLength }} +
    • + {{ .Title }} +
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      +
      • +{{ end }} +``` +{{% /code %}} + + +### By Title + +{{% code file="layouts/partials/by-title.html" %}} +```html +{{ range .Data.Pages.ByTitle }} +
    • + {{ .Title }} +
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      +
      • +{{ end }} +``` +{{% /code %}} + +### By Link Title + +{{% code file="layouts/partials/by-link-title.html" %}} +```html +{{ range .Data.Pages.ByLinkTitle }} +
    • + {{ .LinkTitle }} +
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      +
      • +{{ end }} +``` +{{% /code %}} + +### By Parameter + +Order based on the specified front matter parameter. Content that does not have the specified front matter field will use the site's `.Site.Params` default. If the parameter is not found at all in some entries, those entries will appear together at the end of the ordering. + +The below example sorts a list of posts by their rating. + +{{% code file="layouts/partials/by-rating.html" %}} +```html +{{ range (.Data.Pages.ByParam "rating") }} + +{{ end }} +``` +{{% /code %}} + +If the front matter field of interest is nested beneath another field, you can +also get it: + +{{% code file="layouts/partials/by-nested-param.html" %}} +```html +{{ range (.Data.Pages.ByParam "author.last_name") }} + +{{ end }} +``` +{{% /code %}} + +### Reverse Order + +Reversing order can be applied to any of the above methods. The following uses `ByDate` as an example: + +{{% code file="layouts/partials/by-date-reverse.html" %}} +```html +{{ range .Data.Pages.ByDate.Reverse }} +
    • +{{ .Title }} +
      {{ .Date.Format "Mon, Jan 2, 2006" }}
      +
      • +{{ end }} +``` +{{% /code %}} + +## Group Content + +Hugo provides some functions for grouping pages by Section, Type, Date, etc. + +### By Page Field + +{{% code file="layouts/partials/by-page-field.html" %}} +```html +{{ range .Data.Pages.GroupBy "Section" }} +

      {{ .Key }}

      +
        + {{ range .Pages }} +
      • + {{ .Title }} +
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        +
        • + {{ end }} +
      +{{ end }} +``` +{{% /code %}} + +### By Page date + +{{% code file="layouts/partials/by-page-date.html" %}} +```html +{{ range .Data.Pages.GroupByDate "2006-01" }} +

      {{ .Key }}

      +
        + {{ range .Pages }} +
      • + {{ .Title }} +
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        +
        • + {{ end }} +
      +{{ end }} +``` +{{% /code %}} + +### By Page publish date + +{{% code file="layouts/partials/by-page-publish-date.html" %}} +```html +{{ range .Data.Pages.GroupByPublishDate "2006-01" }} +

      {{ .Key }}

      +
        + {{ range .Pages }} +
      • + {{ .Title }} +
        {{ .PublishDate.Format "Mon, Jan 2, 2006" }}
        +
        • + {{ end }} +
      +{{ end }} +``` +{{% /code %}} + +### By Page Param + +{{% code file="layouts/partials/by-page-param.html" %}} +```html +{{ range .Data.Pages.GroupByParam "param_key" }} +

      {{ .Key }}

      +
        + {{ range .Pages }} +
      • + {{ .Title }} +
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        +
        • + {{ end }} +
      +{{ end }} +``` +{{% /code %}} + +### By Page Param in Date Format + +{{% code file="layouts/partials/by-page-param-as-date.html" %}} +```html +{{ range .Data.Pages.GroupByParamDate "param_key" "2006-01" }} +

      {{ .Key }}

      +
        + {{ range .Pages }} +
      • + {{ .Title }} +
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        +
        • + {{ end }} +
      +{{ end }} +``` +{{% /code %}} + +### Reverse Key Order + +The ordering of the groups is performed by keys in alphanumeric order (A–Z, 1–100) and in reverse chronological order (newest first) for dates. + +While these are logical defaults, they are not always the desired order. There are two different syntaxes to change the order, both of which work the same way. You can use your preferred syntax. + +#### Reverse Method + +```html +{{ range (.Data.Pages.GroupBy "Section").Reverse }} +``` + +```html +{{ range (.Data.Pages.GroupByDate "2006-01").Reverse }} +``` + + +#### Provide the Alternate Direction + +```html +{{ range .Data.Pages.GroupByDate "2006-01" "asc" }} +``` + +```html +{{ range .Data.Pages.GroupBy "Section" "desc" }} +``` + +### Order Within Groups + +Because Grouping returns a `{{.Key}}` and a slice of pages, all of the ordering methods listed above are available. + +In the following example, groups are ordered chronologically and then content +within each group is ordered alphabetically by title. + +{{% code file="layouts/partials/by-group-by-page.html" %}} +```html +{{ range .Data.Pages.GroupByDate "2006-01" "asc" }} +

      {{ .Key }}

      +
        + {{ range .Pages.ByTitle }} +
      • + {{ .Title }} +
        {{ .Date.Format "Mon, Jan 2, 2006" }}
        +
        • + {{ end }} +
      +{{ end }} +``` +{{% /code %}} + +## Filter and Limiting Lists + +Sometimes you only want to list a subset of the available content. A common request is to only display “Posts” on the homepage. You can accomplish this with the `where` function. + +### `where` + +`where` works in a similar manner to the `where` keyword in SQL. It selects all elements of the array or slice that match the provided field and value. `where` takes three arguments: + +1. `array` or a `slice of maps or structs` +2. `key` or `field name` +3. `match value` + +{{% code file="layouts/_default/.html" %}} +```html +{{ range where .Data.Pages "Section" "post" }} + {{ .Content }} +{{ end }} +``` +{{% /code %}} + +### `first` + +`first` works in a similar manner to the [`limit` keyword in SQL][limitkeyword]. It reduces the array to only the `first N` elements. It takes the array and number of elements as input. `first` takes two arguments: + +1. `array` or `slice of maps or structs` +2. `number of elements` + +{{% code file="layout/_default/section.html" %}} +```html +{{ range first 10 .Data.Pages }} + {{ .Render "summary" }} +{{ end }} +``` +{{% /code %}} + +### `first` and `where` Together + +Using `first` and `where` together can be very powerful: + +{{% code file="first-and-where-together.html" %}} +```html +{{ range first 5 (where .Data.Pages "Section" "post") }} + {{ .Content }} +{{ end }} +``` +{{% /code %}} + + +[views]: /templates/views/ diff --git a/content/templates/output-formats.md b/content/templates/output-formats.md new file mode 100644 index 000000000..a9d98465e --- /dev/null +++ b/content/templates/output-formats.md @@ -0,0 +1,211 @@ +--- +title: Custom Output Formats +linktitle: Custom Output Formats +description: Hugo can output content in multiple formats, including calendar events, e-book formats, Google AMP, and JSON search indexes, or any custom text format. +date: 2017-03-22 +publishdate: 2017-03-22 +lastmod: 2017-03-22 +categories: [templates] +#tags: ["amp","outputs","rss"] +menu: + docs: + parent: "templates" + weight: 18 +weight: 18 +sections_weight: 18 +draft: false +aliases: [/templates/outputs/,/extras/output-formats/,/content-management/custom-outputs/] +toc: true +--- + +This page describes how to properly configure your site with the media types and output formats, as well as where to create your templates for your custom outputs. + +## Media Types + +A [media type][] (also known as *MIME type* and *content type*) is a two-part identifier for file formats and format contents transmitted on the Internet. + +This is the full set of built-in media types in Hugo: + +{{< datatable "media" "types" "Type" "Suffix" >}} + +**Note:** + +* It is possible to add custom media types or change the defaults; e.g., if you want to change the suffix for `text/html` to `asp`. +* The `Suffix` is the value that will be used for URLs and filenames for that media type in Hugo. +* The `Type` is the identifier that must be used when defining new/custom `Output Formats` (see below). +* The full set of media types will be registered in Hugo's built-in development server to make sure they are recognized by the browser. + +To add or modify a media type, define it in a `mediaTypes` section in your [site configuration][config], either for all sites or for a given language. + +Example in `config.toml`: + +```toml +[mediaTypes] + [mediaTypes."text/enriched"] + suffix = "enr" + [mediaTypes."text/html"] + suffix = "asp" +``` + +The above example adds one new media type, `text/enriched`, and changes the suffix for the built-in `text/html` media type. + +## Output Formats + +Given a media type and some additional configuration, you get an `Output Format`: + +This is the full set of Hugo's built-in output formats: + +{{< datatable "output" "formats" "Name" "MediaType" "Path" "BaseName" "Rel" "Protocol" "IsPlainText" "IsHTML" "NoUgly">}} + +* A page can be output in as many output formats as you want, and you can have an infinite amount of output formats defined **as long as they resolve to a unique path on the file system**. In the above table, the best example of this is `AMP` vs. `HTML`. `AMP` has the value `amp` for `Path` so it doesn't overwrite the `HTML` version; e.g. we can now have both `/index.html` and `/amp/index.html`. +* The `MediaType` must match the `Type` of an already defined media type. +* You can define new output formats or redefine built-in output formats; e.g., if you want to put `AMP` pages in a different path. + +To add or modify an output format, define it in an `outputFormats` section in your site's [configuration file](/templates/configuration/), either for all sites or for a given language. + +```toml +[outputFormats.MyEnrichedFormat] +mediaType = "text/enriched" +baseName = "myindex" +isPlainText = true +protocol = "bep://" +``` + +The above example is fictional, but if used for the homepage on a site with `baseURL` `http://example.org`, it will produce a plain text homepage with the URL `bep://example.org/myindex.enr`. + +### Configure Output Formats + +The following is the full list of configuration options for output formats and their default values: + +`Name` +: the output format identifier. This is used to define what output format(s) you want for your pages. + +`MediaType` +: this must match the `Type` of a defined media type. + +`Path` +: sub path to save the output files. + +`BaseName` +: the base filename for the list filenames (homepage, etc.). **Default:** `index`. + +`Rel` +: can be used to create `rel` values in `link` tags. **Default:** `alternate`. + +`Protocol` +: will replace the "http://" or "https://" in your `baseURL` for this output format. + +`IsPlainText` +: use Go's plain text templates parser for the templates. **Default:** `false`. + +`IsHTML` +: used in situations only relevant for `HTML`-type formats; e.g., page aliases. + +`NoUgly` +: used to turn off ugly URLs If `uglyURLs` is set to `true` in your site. **Default:** `false`. + +`NotAlternative` +: enable if it doesn't make sense to include this format in an `AlternativeOutputFormats` format listing on `Page` (e.g., with `CSS`). Note that we use the term *alternative* and not *alternate* here, as it does not necessarily replace the other format. **Default:** `false`. + +## Output Formats for Pages + +A `Page` in Hugo can be rendered to multiple representations on the file system. By default, all pages will render as `HTML` with some of them also as `RSS` (homepage, sections, etc.). + +This can be changed by defining an `outputs` list of output formats in either the `Page` front matter or in the site configuration (either for all sites or per language). + +Example from site `config.toml`: + +```toml +[outputs] + home = ["HTML", "AMP", "RSS"] + page = ["HTML"] +``` + +Example from site `config.yml`: + +```yml +outputs: + home: ["HTML", "AMP", "RSS"] + page: ["HTML"] +``` + + +* The output definition is per `Page` `Kind` (i.e, `page`, `home`, `section`, `taxonomy`, or `taxonomyTerm`). +* The names used must match the `Name` of a defined `Output Format`. +* Any `Kind` without a definition will default to `HTML`. +* These can be overridden per `Page` in the front matter of content files. +* Output formats are case insensitive. + +The following is an example of `YAML` front matter in a content file that defines output formats for the rendered `Page`: + +```yaml +--- +date: "2016-03-19" +outputs: +- html +- amp +- json +--- +``` + +## Link to Output Formats + +Each `Page` has both an `.OutputFormats` (all formats, including the current) and an `.AlternativeOutputFormats` variable, the latter of which is useful for creating a `link rel` list in your site's ``: + +``` +{{ range .AlternativeOutputFormats -}} + +{{ end -}} +``` + +Note that `.Permalink` and `.RelPermalink` on `Page` will return the first output format defined for that page (usually `HTML` if nothing else is defined). + +This is how you link to a given output format: + +``` +{{ with .OutputFormats.Get "json" -}} +{{ .Name }} +{{- end }} +``` + +From content files, you can use the [`ref` or `relref` shortcodes](/content-management/shortcodes/#ref-and-relref): + +``` +[Neat]({{}}) +[Who]({{}}) +``` + +## Templates for Your Output Formats + +A new output format needs a corresponding template in order to render anything useful. + +{{% note %}} +The key distinction for Hugo versions 0.20 and newer is that Hugo looks at an output format's `Name` and MediaType's `Suffix` when choosing the template used to render a given `Page`. +{{% /note %}} + +The following table shows examples of different output formats, the suffix used, and Hugo's respective template [lookup order][]. All of the examples in the table can: + +* Use a [base template][base]. +* Include [partial templates][partials] + +{{< datatable "output" "layouts" "Example" "OutputFormat" "Suffix" "Template Lookup Order" >}} + +Hugo will now also detect the media type and output format of partials, if possible, and use that information to decide if the partial should be parsed as a plain text template or not. + +Hugo will look for the name given, so you can name it whatever you want. But if you want it treated as plain text, you should use the file suffix and, if needed, the name of the Output Format. The pattern is as follows: + +``` +[partial name].[OutputFormat].[suffix] +``` + +The partial below is a plain text template (Outpuf Format is `CSV`, and since this is the only output format with the suffix `csv`, we don't need to include the Output Format's `Name`): + +``` +{{ partial "mytextpartial.csv" . }} +``` + +[base]: /templates/base/ +[config]: /getting-started/configuration/ +[lookup order]: /templates/lookup/ +[media type]: https://en.wikipedia.org/wiki/Media_type +[partials]: /templates/partials/ diff --git a/content/templates/overview.md b/content/templates/overview.md deleted file mode 100644 index 3b41a6641..000000000 --- a/content/templates/overview.md +++ /dev/null @@ -1,76 +0,0 @@ ---- -aliases: -- /doc/templates/ -- /layout/templates/ -- /layout/overview/ -lastmod: 2015-05-22 -date: 2013-07-01 -linktitle: Overview -menu: - main: - parent: layout -next: /templates/go-templates -prev: /themes/creation -title: Hugo Templates -weight: 10 -toc: true ---- - -Hugo uses the excellent Go html/template library for its template engine. -It is an extremely lightweight engine that provides a very small amount of -logic. In our experience it is just the right amount of logic to be able -to create a good static website. - -While Hugo has a number of different template roles, most complete -websites can be built using just a small number of template files. -Please don’t be afraid of the variety of different template roles. They -enable Hugo to build very complicated sites. Most sites will only -need to create a [/layouts/\_default/single.html](/templates/content/) & [/layouts/\_default/list.html](/templates/list/) - -If you are new to Go's templates, the [Go Template Primer](/layout/go-templates/) -is a great place to start. - -If you are familiar with Go’s templates, Hugo provides some [additional -template functions](/templates/functions/) and [variables](/templates/variables/) you will want to be familiar -with. - -## Primary Template roles - -There are 3 primary kinds of templates that Hugo works with. - -### [Single](/templates/content/) -Render a single piece of content - -### [List](/templates/list/) -Page that list multiple pieces of content - -### [Homepage](/templates/homepage/) -The homepage of your site - -## Supporting Template Roles (optional) - -Hugo also has additional kinds of templates all of which are optional - -### [Partial Templates](/templates/partials/) -Common page parts to be included in the above mentioned templates - -### [Content Views](/templates/views/) -Different ways of rendering a (single) content type - -### [Taxonomy Terms](/templates/terms/) -A list of the terms used for a specific taxonomy, e.g. a Tag cloud - -## Other Templates (generally unnecessary) - -### [RSS](/templates/rss/) -Used to render all rss documents - -### [Sitemap](/templates/sitemap/) -Used to render the XML sitemap - -### [404](/templates/404/) -This template will create a 404.html page used when hosting on GitHub Pages - -### [Alias](/extras/aliases/#customizing) -This template will override the default page used to create aliases of pages. - diff --git a/content/templates/pagination.md b/content/templates/pagination.md new file mode 100644 index 000000000..c1dc94b87 --- /dev/null +++ b/content/templates/pagination.md @@ -0,0 +1,155 @@ +--- +title: Pagination +linktitle: Pagination +description: Hugo supports pagination for your homepage, section pages, and taxonomies. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [templates] +#tags: [lists,sections,pagination] +menu: + docs: + parent: "templates" + weight: 140 +weight: 140 +sections_weight: 140 +draft: false +aliases: [/extras/pagination,/doc/pagination/] +toc: true +--- + +The real power of Hugo pagination shines when combined with the [`where` function][where] and its SQL-like operators: [`first`][], [`last`][], and [`after`][]. You can even [order the content][lists] the way you've become used to with Hugo. + +## Configure Pagination + +Pagination can be configured in your [site configuration][configuration]: + +`Paginate` +: default = `10`. This setting can be overridden within the template. + +`PaginatePath` +: default = `page`. Allows you to set a different path for your pagination pages. + +Setting `Paginate` to a positive value will split the list pages for the homepage, sections and taxonomies into chunks of that size. But note that the generation of the pagination pages for sections, taxonomies and homepage is *lazy* --- the pages will not be created if not referenced by a `.Paginator` (see below). + +`PaginatePath` is used to adapt the `URL` to the pages in the paginator (the default setting will produce URLs on the form `/page/1/`. + +## List Paginator Pages + +{{% warning %}} +`.Paginator` is provided to help you build a pager menu. This feature is currently only supported on homepage and list pages (i.e., taxonomies and section lists). +{{% /warning %}} + +There are two ways to configure and use a `.Paginator`: + +1. The simplest way is just to call `.Paginator.Pages` from a template. It will contain the pages for *that page*. +2. Select a subset of the pages with the available template functions and ordering options, and pass the slice to `.Paginate`, e.g. `{{ range (.Paginate ( first 50 .Data.Pages.ByTitle )).Pages }}`. + +For a given **Page**, it's one of the options above. The `.Paginator` is static and cannot change once created. + +The global page size setting (`Paginate`) can be overridden by providing a positive integer as the last argument. The examples below will give five items per page: + +* `{{ range (.Paginator 5).Pages }}` +* `{{ $paginator := .Paginate (where .Data.Pages "Type" "post") 5 }}` + +It is also possible to use the `GroupBy` functions in combination with pagination: + +``` +{{ range (.Paginate (.Data.Pages.GroupByDate "2006")).PageGroups }} +``` + +## Build the navigation + +The `.Paginator` contains enough information to build a paginator interface. + +The easiest way to add this to your pages is to include the built-in template (with `Bootstrap`-compatible styles): + +```html +{{ template "_internal/pagination.html" . }} +``` + +{{% note "When to Create `.Paginator`" %}} +If you use any filters or ordering functions to create your `.Paginator` *and* you want the navigation buttons to be shown before the page listing, you must create the `.Paginator` before it's used. +{{% /note %}} + +The following example shows how to create `.Paginator` before its used: + +```html +{{ $paginator := .Paginate (where .Data.Pages "Type" "post") }} +{{ template "_internal/pagination.html" . }} +{{ range $paginator.Pages }} + {{ .Title }} +{{ end }} +``` + +Without the `where` filter, the above example is even simpler: + +```html +{{ template "_internal/pagination.html" . }} +{{ range .Paginator.Pages }} + {{ .Title }} +{{ end }} +``` + +If you want to build custom navigation, you can do so using the `.Paginator` object, which includes the following properties: + +`PageNumber` +: The current page's number in the pager sequence + +`URL`: +The relative URL to the current pager + +`Pages`: +The pages in the current pager + +`NumberOfElements` +: The number of elements on this page + +`HasPrev` +: Whether there are page(s) before the current + +`Prev` +: The pager for the previous page + +`HasNext` +: Whether there are page(s) after the current + +`Next` +: The pager for the next page + +`First` +: The pager for the first page + +`Last` +: The pager for the last page + +`Pagers` +: A list of pagers that can be used to build a pagination menu + +`PageSize` +: Size of each pager + +`TotalPages` +: The number of pages in the paginator + +`TotalNumberOfElements` +: The number of elements on all pages in this paginator + +## Additional information + +The pages are built on the following form (`BLANK` means no value): + +``` +[SECTION/TAXONOMY/BLANK]/index.html +[SECTION/TAXONOMY/BLANK]/page/1/index.html => redirect to [SECTION/TAXONOMY/BLANK]/index.html +[SECTION/TAXONOMY/BLANK]/page/2/index.html +.... +``` + + +[`first`]: /functions/first/ +[`last`]: /functions/last/ +[`after`]: /functions/after/ +[configuration]: /getting-started/configuration/ +[lists]: /templates/lists/ +[where]: /functions/where/ \ No newline at end of file diff --git a/content/templates/partials.md b/content/templates/partials.md index 46c2c2400..9c9429b04 100644 --- a/content/templates/partials.md +++ b/content/templates/partials.md @@ -1,146 +1,171 @@ --- -aliases: -- /layout/chrome/ -lastmod: 2016-01-01 -date: 2013-07-01 -menu: - main: - parent: layout -next: /templates/rss -prev: /templates/blocks/ title: Partial Templates -weight: 80 +linktitle: Partial Templates +description: Partials are smaller, context-aware components in your list and page templates that can be used economically to keep your templating DRY. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [templates] +#tags: [lists,sections,partials] +menu: + docs: + parent: "templates" + weight: 90 +weight: 90 +sections_weight: 90 +draft: false +aliases: [/templates/partial/,/layout/chrome/,/extras/analytics/] toc: true --- -In practice, it's very convenient to split out common template portions into a -partial template that can be included anywhere. As you create the rest of your -templates, you will include templates from the ``/layouts/partials` directory -or from arbitrary subdirectories like `/layouts/partials/post/tag`. +## Partial Template Lookup Order -Partials are especially important for themes as it gives users an opportunity -to overwrite just a small part of your theme, while maintaining future compatibility. +Partial templates---like [single page templates][singletemps] and [list page templates][listtemps]---have a specific [lookup order][]. However, partials are simpler in that Hugo will only check in two places: -Theme developers may want to include a few partials with empty HTML -files in the theme just so end users have an easy place to inject their -customized content. +1. `layouts/partials/*.html` +2. `themes//layouts/partials/*.html` -I've found it helpful to include a header and footer template in -partials so I can include those in all the full page layouts. There is -nothing special about header.html and footer.html other than they seem -like good names to use for inclusion in your other templates. +This allows a theme's end user to copy a partial's contents into a file of the same name for [further customization][customize]. - ▾ layouts/ - ▾ partials/ - header.html - footer.html +## Use Partials in your Templates -## Partial vs Template +All partials for your Hugo project are located in a single `layouts/partials` directory. For better organization, you can create multiple subdirectories within `partials` as well: -Version v0.12 of Hugo introduced the `partial` call inside the template system. -This is a change to the way partials were handled previously inside the -template system. In earlier versions, Hugo didn’t treat partials specially, and -you could include a partial template with the `template` call in the standard -template language. +``` +. +└── layouts + └── partials + ├── footer + │   ├── scripts.html + │   └── site-footer.html + ├── head + │   ├── favicons.html + │   ├── metadata.html + │   ├── prerender.html + │   └── twitter.html + └── header + ├── site-header.html + └── site-nav.html +``` -With the addition of the theme system in v0.11, it became apparent that a theme -& override-aware partial was needed. +All partials are called within your templates using the following pattern: -When using Hugo v0.12 and above, please use the `partial` call (and leave out -the “partial/” path). The old approach would still work, but wouldn’t benefit from -the ability to have users override the partial theme file with local layouts. +``` +{{ partial "/.html" . }} +``` -## Example header.html -This header template is used for [spf13.com](http://spf13.com/): +{{% note %}} +One of the most common mistakes with new Hugo users is failing to pass a context to the partial call. In the pattern above, note how "the dot" (`.`) is required as the second argument to give the partial context. You can read more about "the dot" in the [Hugo templating introduction](/templates/introduction/). +{{% /note %}} - - - - +As shown in the above example directory structure, you can nest your directories within `partials` for better source organization. You only need to call the nested partial's path relative to the `partials` directory: - {{ partial "meta.html" . }} +```golang +{{ partial "header/site-header.html" . }} +{{ partial "footer/scripts.html" . }} +``` - - {{ .Title }} : spf13.com - - {{ if .RSSLink }}{{ end }} +{{% note %}} +Before v0.12, Hugo used the `template` call to include partial templates. When using Hugo v0.12 and newer, be sure to use the `{{ partial "/.html" . }}` syntax. The old approach will still work but has fewer benefits. +{{% /note %}} - {{ partial "head_includes.html" . }} - - +### Variable Scoping -## Example footer.html -This footer template is used for [spf13.com](http://spf13.com/): +The second argument in a partial call is the variable being passed down. The above examples are passing the `.`, which tells the template receiving the partial to apply the current [context][context]. - - - - - -To reference a partial template stored in a subfolder, e.g. `/layouts/partials/post/tag/list.html`, call it this way: - - {{ partial "post/tag/list" . }} - -Note that the subdirectories you create under /layouts/partials can be named whatever you like. - -For more examples of referencing these templates, see -[single content templates](/templates/content/), -[list templates](/templates/list/) and -[homepage templates](/templates/homepage/). - - -## Variable scoping - -As you might have noticed, `partial` calls receive two parameters. - -1. The first is the name of the partial and determines the file -location to be read. -2. The second is the variables to be passed down to the partial. - -This means that the partial will _only_ be able to access those variables. It is -isolated and has no access to the outer scope. From within the -partial, `$.Var` is equivalent to `.Var` - -## Cached Partials - -The `partialCached` template function can offer significant performance gains -for complex templates that don't need to be rerendered upon every invocation. -The simplest usage is as follows: - - {{ partialCached "footer.html" . }} +``` +{{ partialCached "footer.html" . }} +``` You can also pass additional parameters to `partialCached` to create *variants* of the cached partial. -For example, say you have a complex partial that should be identical when rendered for pages within the same section. -You could use a variant based upon section so that the partial is only rendered once per section: - {{ partialCached "footer.html" . .Section }} +For example, you can tell Hugo to only render the partial `footer.html` once per section: -If you need to pass additional parameters to create unique variants, -you can pass as many variant parameters as you need: +``` +{{ partialCached "footer.html" . .Section }} +``` - {{ partialCached "footer.html" . .Params.country .Params.province }} +If you need to pass additional parameters to create unique variants, you can pass as many variant parameters as you need: -Note that the variant parameters are not made available to the underlying partial template. -They are only use to create a unique cache key. +``` +{{ partialCached "footer.html" . .Params.country .Params.province }} +``` + +Note that the variant parameters are not made available to the underlying partial template. They are only use to create a unique cache key. + +### Example `header.html` + +The following `header.html` partial template is used for [spf13.com](http://spf13.com/): + +{{% code file="layouts/partials/header.html" download="header.html" %}} +```html + + + + + + {{ partial "meta.html" . }} + + + {{ .Title }} : spf13.com + + {{ if .RSSLink }}{{ end }} + + {{ partial "head_includes.html" . }} + + +``` +{{% /code %}} + +{{% note %}} +The `header.html` example partial was built before the introduction of block templates to Hugo. Read more on [base templates and blocks](/templates/base/) for defining the outer chrome or shell of your master templates (i.e., your site's head, header, and footer). You can even combine blocks and partials for added flexibility. +{{% /note %}} + +### Example `footer.html` + +The following `footer.html` partial template is used for [spf13.com](http://spf13.com/): + +{{% code file="layouts/partials/footer.html" download="footer.html" %}} +```html + + + + +``` +{{% /code %}} + +[context]: /templates/introduction/ "The most easily overlooked concept to understand about Go templating is how the dot always refers to the current context." +[customize]: /themes/customizing/ "Hugo provides easy means to customize themes as long as users are familiar with Hugo's template lookup order." +[listtemps]: /templates/lists/ "To effectively leverage Hugo's system, see how Hugo handles list pages, where content for sections, taxonomies, and the homepage are listed and ordered." +[lookup order]: /templates/lookup-order/ "To keep your templating dry, read the documentation on Hugo's lookup order." +[partialcached]: /functions/partialcached/ "Use the partial cached function to improve build times in cases where Hugo can cache partials that don't need to be rendered with every page." +[singletemps]: /templates/single-page-templates/ "The most common form of template in Hugo is the single content template. Read the docs on how to create templates for individual pages." +[themes]: /themes/ \ No newline at end of file diff --git a/content/templates/robots.md b/content/templates/robots.md new file mode 100644 index 000000000..b3c82e1d2 --- /dev/null +++ b/content/templates/robots.md @@ -0,0 +1,56 @@ +--- +title: Robots.txt File +linktitle: Robots.txt +description: Hugo can generate a customized robots.txt in the same way as any other template. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [templates] +#tags: [robots,search engines] +menu: + docs: + parent: "templates" + weight: 165 +weight: 165 +sections_weight: 165 +draft: false +aliases: [/extras/robots-txt/] +toc: false +--- + +To create your robots.txt as a template, first set the `enableRobotsTXT` value to `true` in your [configuration file][config]. By default, this option generates a robots.txt with the following content, which tells search engines that they are allowed to crawl everything: + +```http +User-agent: * +``` + +## Robots.txt Template Lookup Order + +The [lookup order][lookup] for the `robots.txt` template is as follows: + +* `/layouts/robots.txt` +* `/themes//layout/robots.txt` + +{{% note %}} +If you do not want Hugo to create a default `robots.txt` or leverage the `robots.txt` template, you can hand code your own and place the file in `static`. Remember that everything in the [static directory](/getting-started/directory-structure/) is copied over as-is when Hugo builds your site. +{{% /note %}} + +## Robots.txt Template Example + +The following is an example `robots.txt` layout: + +{{% code file="layouts/robots.txt" download="robots.txt" %}} +```http +User-agent: * + +{{range .Data.Pages}} +Disallow: {{.RelPermalink}} +{{end}} +``` +{{% /code %}} + +This template disallows all the pages of the site by creating one `Disallow` entry for each page. + +[config]: /getting-started/configuration/ +[lookup]: /templates/lookup-order/ +[robots]: http://www.robotstxt.org/ \ No newline at end of file diff --git a/content/templates/rss.md b/content/templates/rss.md index 10f2a8535..d3cc60878 100644 --- a/content/templates/rss.md +++ b/content/templates/rss.md @@ -1,130 +1,142 @@ --- -aliases: -- /layout/rss/ -lastmod: 2015-08-04 -date: 2015-05-19 -linktitle: RSS +title: RSS Templates +linktitle: RSS Templates +description: Hugo ships with its own RSS 2.0 template that requires almost no configuration, or you can create your own RSS templates. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +#tags: [rss, xml] +categories: [templates] menu: - main: - parent: layout -next: /templates/sitemap -notoc: one -prev: /templates/partials -title: RSS (feed) Templates -weight: 90 + docs: + parent: "templates" + weight: 150 +weight: 150 +sections_weight: 150 +draft: false +aliases: [/templates/rss/] toc: true --- -Like all other templates, you can use a single RSS template to generate all of your RSS feeds, or you can create a specific template for each individual feed. +## RSS Template Lookup Order -*Unlike other Hugo templates*, Hugo ships with its own [RSS 2.0 template](#the-embedded-rss-xml:eceb479b7b3b2077408a2878a29e1320). In most cases this will be sufficient, and an RSS template will not need to be provided by the user. But you can provide an rss template if you like, as you can see in the next section. +You can use a single RSS template to generate all of your RSS feeds or create a specific template for each individual feed. + +1. `/layouts/section/
      .rss.xml` +2. `/layouts/_default/rss.xml` +3. `/themes//layouts/section/
      .rss.xml` +4. `/themes//layouts/_default/rss.xml` + +{{% note "Hugo Ships with an RSS Template" %}} +Hugo ships with its own [RSS 2.0 template](#the-embedded-rss-xml). The embedded template will be sufficient for most use cases. +{{% /note %}} RSS pages are of the type `Page` and have all the [page variables](/layout/variables/) available to use in the templates. -## Which Template will be rendered? -Hugo uses a set of rules to figure out which template to use when rendering a specific page. +### Section RSS -Hugo will use the following prioritized list. If a file isn’t present, then the next one in the list will be used. This enables you to craft specific layouts when you want to without creating more templates than necessary. For most sites only the `\_default` file at the end of the list will be needed. +A [section’s][section] RSS will be rendered at `/
      /index.xml` (e.g., http://spf13.com/project/index.xml). + +Hugo provides the ability for you to define any RSS type you wish and can have different RSS files for each section and taxonomy. + +## Lookup Order for RSS Templates ### Main RSS -* /layouts/rss.xml -* /layouts/\_default/rss.xml -* [Embedded rss.xml](#the-embedded-rss-xml:eceb479b7b3b2077408a2878a29e1320) +1. `/layouts/rss.xml` +2. `/layouts/_default/rss.xml` +3. Embedded rss.xml ### Section RSS -* /layouts/section/`SECTION`.rss.xml -* /layouts/\_default/rss.xml -* /themes/`THEME`/layouts/section/`SECTION`.rss.xml -* /themes/`THEME`/layouts/\_default/rss.xml -* [Embedded rss.xml](#the-embedded-rss-xml:eceb479b7b3b2077408a2878a29e1320) +1. `/layouts/section/
      .rss.xml` +2. `/layouts/_default/rss.xml` +3. `/themes//layouts/section/
      .rss.xml` +4. `/themes//layouts/_default/rss.xml` +5. Embedded rss.xml ### Taxonomy RSS -* /layouts/taxonomy/`SINGULAR`.rss.xml -* /layouts/\_default/rss.xml -* /themes/`THEME`/layouts/taxonomy/`SINGULAR`.rss.xml -* /themes/`THEME`/layouts/\_default/rss.xml -* [Embedded rss.xml](#the-embedded-rss-xml:eceb479b7b3b2077408a2878a29e1320) +1. `/layouts/taxonomy/.rss.xml` +2. `/layouts/_default/rss.xml` +3. `/themes//layouts/taxonomy/.rss.xml` +4. `/themes//layouts/_default/rss.xml` +5. Embedded rss.xml -### Taxonomy Terms RSS +## Configure RSS -* /layouts/taxonomy/`SINGULAR`.terms.rss.xml -* /layouts/\_default/rss.xml -* /themes/`THEME`/layouts/taxonomy/`SINGULAR`.terms.rss.xml -* /themes/`THEME`/layouts/\_default/rss.xml -* [Embedded rss.xml](#the-embedded-rss-xml:eceb479b7b3b2077408a2878a29e1320) +By default, Hugo will create an unlimited number of RSS entries. You can limit the number of articles included in the built-in RSS templates by assigning a numeric value to `rssLimit:` field in your project's [`config` file][config]. +The following values will also be included in the RSS output if specified in your site’s configuration: -## Configuring RSS +```toml +languageCode = "en-us" +copyright = "This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License." -If the following values are specified in the site’s config file (`config.toml`), then they will be included in the RSS output. Example values are provided. - - languageCode = "en-us" - copyright = "This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License." - - [author] - name = "My Name Here" - email = "sample@domain.tld" - -### Limiting the Number of Items - -By default, the RSS feed is limited to **15** items. -You may override the default by using the `rssLimit` [site configuration variable](/overview/configuration/). +[author] + name = "My Name Here" +``` ## The Embedded rss.xml + This is the default RSS template that ships with Hugo. It adheres to the [RSS 2.0 Specification][RSS 2.0]. - - - {{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }} - {{ .Permalink }} - Recent content {{ if ne .Title .Site.Title }}{{ with .Title }}in {{.}} {{ end }}{{ end }}on {{ .Site.Title }} - Hugo -- gohugo.io{{ with .Site.LanguageCode }} - {{.}}{{end}}{{ with .Site.Author.email }} - {{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}{{end}}{{ with .Site.Author.email }} - {{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}{{end}}{{ with .Site.Copyright }} - {{.}}{{end}}{{ if not .Date.IsZero }} - {{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}{{ end }} - - {{ range .Data.Pages }} - - {{ .Title }} - {{ .Permalink }} - {{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }} - {{ with .Site.Author.email }}{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}{{end}} - {{ .Permalink }} - {{ .Summary | html }} - - {{ end }} - - +```xml + + + {{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }} + {{ .Permalink }} + Recent content {{ with .Title }}in {{.}} {{ end }}on {{ .Site.Title }} + Hugo -- gohugo.io{{ with .Site.LanguageCode }} + {{.}}{{end}}{{ with .Site.Author.email }} + {{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}{{end}}{{ with .Site.Author.email }} + {{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}{{end}}{{ with .Site.Copyright }} + {{.}}{{end}}{{ if not .Date.IsZero }} + {{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}{{ end }} + + {{ range first 15 .Data.Pages }} + + {{ .Title }} + {{ .Permalink }} + {{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }} + {{ with .Site.Author.email }}{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}{{end}} + {{ .Permalink }} + {{ .Content | html }} + + {{ end }} + + +``` -**Important**: _Hugo will automatically add the following header line to this file on render… please don't include this in the template as it's not valid HTML._ - -~~~css +{{% warning "XML Header" %}} +Hugo will automatically add the following header line to this file on render. Please do *not* include this in the template as it's not valid HTML. +```xml -~~~ +``` +{{% /warning %}} -## Referencing your RSS Feed in `` +## Reference your RSS Feed in `` In your `header.html` template, you can specify your RSS feed in your `` tag like this: -~~~html +```html {{ if .RSSLink }} - + + {{ end }} -~~~ +``` -... with the autodiscovery link specified by the line with `rel="alternate"`. +...with the auto-discovery link specified by the line with `rel="alternate"`. The `.RSSLink` will render the appropriate RSS feed URL for the section, whether it's everything, posts in a section, or a taxonomy. -**N.b.**, if you reference your RSS link, be sure to specify the mime type with `type="application/rss+xml"`. +If you reference your RSS link, be sure to specify the MIME type with `type="application/rss+xml"`. -~~~html +```html {{ .SomeText }} -~~~ +``` +[config]: /getting-started/configuration/ +[embedded]: #the-embedded-rss-xml [RSS 2.0]: http://cyber.law.harvard.edu/rss/rss.html "RSS 2.0 Specification" +[section]: /content-management/sections/ diff --git a/content/templates/section-templates.md b/content/templates/section-templates.md new file mode 100644 index 000000000..8c830f219 --- /dev/null +++ b/content/templates/section-templates.md @@ -0,0 +1,126 @@ +--- +title: Section Page Templates +linktitle: Section Templates +description: Templates used for section pages are **lists** and therefore have all the variables and methods available to list pages. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [templates] +#tags: [lists,sections] +menu: + docs: + parent: "templates" + weight: 40 +weight: 40 +sections_weight: 40 +draft: false +aliases: [/templates/sections/] +toc: true +--- + +## Add Content and Front Matter to Section Templates + +To effectively leverage section page templates, you should first understand Hugo's [content organization](/content-management/organization/) and, specifically, the purpose of `_index.md` for adding content and front matter to section and other list pages. + +## Section Template Lookup Order + +The [lookup order][lookup] for section templates is as follows: + +1. `/layouts/section/
      .html` +2. `/layouts/
      /list.html` +3. `/layouts/_default/section.html` +4. `/layouts/_default/list.html` +5. `/themes//layouts/section/
      .html` +6. `/themes//layouts/
      /list.html` +7. `/themes//layouts/_default/section.html` +8. `/themes//layouts/_default/list.html` + +## `.Site.GetPage` with Sections + +Every `Page` in Hugo has a `.Kind` attribute. `Kind` can easily be combined with the [`where` function][where] in your templates to create kind-specific lists of content. This method is ideal for creating lists, but there are times where you may want to fetch just the index page of a single section via the section's path. + +The [`.GetPage` function][getpage] looks up an index page of a given `Kind` and `path`. + +{{% note %}} +`.GetPage` is not currently supported to grab single content files but *may* be supported in the future. +{{% /note %}} + +You can call `.Site.GetPage` with two arguments: `kind` and `kind value`. + +These are the valid values for 'kind': + +1. `home` +2. `section` +3. `taxonomy` +4. `taxonomyTerm` + + +## Example: Creating a Default Section Template + +{{% code file="layouts/_default/section.html" download="section.html" %}} +```html +{{ define "main" }} +
      + {{ .Content }} +
        + {{ range .Paginator.Pages }} +
      • {{.Title}} +
        + {{ partial "summary.html" . }} +
        +
        • + {{ end }} +
      + {{ partial "pagination.html" . }} +
      +{{ end }} +``` +{{% /code %}} + +### Example: Using `.Site.GetPage` + +The `.Site.GetPage` example that follows assumes the following project directory structure: + +```bash +. +└── content + ├── blog + │   ├── _index.md # "title: My Hugo Blog" in the front matter + │   ├── post-1.md + │   ├── post-2.md + │   └── post-3.md + └── events #Note there is no _index.md file in "events" + ├── event-1.md + └── event-2.md +``` + +`.Site.GetPage` will return `nil` if no `_index.md` page is found. Therefore, if `content/blog/_index.md` does not exist, the template will output the section name: + +```html +

      {{ with .Site.GetPage "section" "blog" }}{{ .Title }}{{ end }}

      +``` + +Since `blog` has a section index page with front matter at `content/blog/_index.md`, the above code will return the following result: + +```html +

      My Hugo Blog

      +``` + +If we try the same code with the `events` section, however, Hugo will default to the section title because there is no `content/events/_index.md` from which to pull content and front matter: + +```html +

      {{ with .Site.GetPage "section" "events" }}{{ .Title }}{{ end }}

      +``` + +Which then returns the following: + +```html +

      Events

      +``` + + +[contentorg]: /content-management/organization/ +[getpage]: /functions/getpage/ +[lists]: /templates/lists/ +[lookup]: /templates/lookup-order/ +[where]: /functions/where/ diff --git a/content/templates/shortcode-templates.md b/content/templates/shortcode-templates.md new file mode 100644 index 000000000..9e5610022 --- /dev/null +++ b/content/templates/shortcode-templates.md @@ -0,0 +1,372 @@ +--- +title: Creating Your Own Shortcodes +linktitle: Shortcode Templates +description: You can extend Hugo's built-in shortcodes by creating your own using the same templating syntax as that for single and list pages. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [templates] +#tags: [shortcodes] +menu: + docs: + parent: "templates" + weight: 100 +weight: 100 +sections_weight: 100 +draft: false +aliases: [] +toc: true +--- + +Shortcodes are a means to consolidate templating into small, reusable snippets that you can embed directly inside of your content. In this sense, you can think of shortcodes as the intermediary between [page and list templates][templates] and [basic content files][]. + +{{% note %}} +Hugo also ships with built-in shortcodes for common use cases. (See [Content Management: Shortcodes](/content-management/shortcodes/).) +{{% /note %}} + +## Create Custom Shortcodes + +Hugo's built-in shortcodes cover many common, but not all, use cases. Luckily, Hugo provides the ability to easily create custom shortcodes to meet your website's needs. + +### File Placement + +To create a shortcode, place an HTML template in the `layouts/shortcodes` directory of your [source organization][]. Consider the file name carefully since the shortcode name will mirror that of the file but without the `.html` extension. For example, `layouts/shortcodes/myshortcode.html` will be called with either `{{}}` or `{{%/* myshortcode /*/%}}` depending on the type of parameters you choose. + +### Shortcode Template Lookup Order + +Shortcode templates have a simple [lookup order][]: + +1. `/layouts/shortcodes/.html` +2. `/themes//layouts/shortcodes/.html` + +### Positional vs Named Parameters + +You can create shortcodes using the following types of parameters: + +* Positional parameters +* Named parameters +* Positional *or* named parameters (i.e, "flexible") + +In shortcodes with positional parameters, the order of the parameters is important. If a shortcode has a single required value (e.g., the `youtube` shortcode below), positional parameters work very well and require less typing from content authors. + +For more complex layouts with multiple or optional parameters, named parameters work best. While less terse, named parameters require less memorization from a content author and can be added in a shortcode declaration in any order. + +Allowing both types of parameters (i.e., a "flexible" shortcode) is useful for complex layouts where you want to set default values that can be easily overridden by users. + +### Access Parameters + +All shortcode parameters can be accessed via the `.Get` method. Whether you pass a key (i.e., string) or a number to the `.Get` method depends on whether you are accessing a named or positional parameter, respectively. + +To access a parameter by name, use the `.Get` method followed by the named parameter as a quoted string: + +```golang +{{ .Get "class" }} +``` + +To access a parameter by position, use the `.Get` followed by a numeric position, keeping in mind that positional parameters are zero-indexed: + +```golang +{{ .Get 0 }} +``` + +`with` is great when the output depends on a parameter being set: + +```golang +{{ with .Get "class"}} class="{{.}}"{{ end }} +``` + +`.Get` can also be used to check if a parameter has been provided. This is +most helpful when the condition depends on either of the values, or both: + +```golang +{{ or .Get "title" | .Get "alt" | if }} alt="{{ with .Get "alt"}}{{.}}{{else}}{{.Get "title"}}{{end}}"{{ end }} +``` + +#### `.Inner` + +If a closing shortcode is used, the `.Inner` variable will be populated with all of the content between the opening and closing shortcodes. If a closing shortcode is required, you can check the length of `.Inner` as an indicator of its existence. + +A shortcode with content declared via the `.Inner` variable can also be declared without the inline content and without the closing shortcode by using the self-closing syntax: + +```golang +{{}} +``` + +#### `.Params` + +The `.Params` variable in shortcodes contains the list parameters passed to shortcode for more complicated use cases. You can also access higher-scoped parameters with the following logic: + +`$.Params` +: these are the parameters passed directly into the shortcode declaration (e.g., a YouTube video ID) + +`$.Page.Params` +: refers to the page's params; the "page" in this case refers to the content file in which the shortcode is declared (e.g., a `shortcode_color` field in a content's front matter could be accessed via `$.Page.Params.shortcode_color`). + +`$.Page.Site.Params` +: refers to global variables as defined in your [site's configuration file][config]. + +#### `.IsNameParams` + +The `.IsNamedParams` variable checks whether the shortcode declaration uses named parameters and returns a boolean value. + +For example, you could create an `image` shortcode that can take either a `src` named parameter or the first positional parameter, depending on the preference of the content's author. Let's assume the `image` shortcode is called as follows: + +```md +{{}} +``` + +You could then include the following as part of your shortcode templating: + +```html +{{ if .IsNamedParams }} + +{{ else }} + +{{ end }}. +``` + +See the [example Vimeo shortcode][vimeoexample] below for `.IsNamedParams` in action. + +{{% warning %}} +While you can create shortcode templates that accept both positional and named parameters, you *cannot* declare shortcodes in content with a mix of parameter types. Therefore, a shortcode declared like `{{}}` will return an error. +{{% /warning %}} + +You can also use the variable `.Page` to access all the normal [page variables][pagevars]. + +A shortcodes can also be nested. In a nested shortcode, you can access the parent shortcode context with [`.Parent` variable][shortcodesvars]. This can be very useful for inheritance of common shortcode parameters from the root. + +## Custom Shortcode Examples + +The following are examples of the different types of shortcodes you can create via shortcode template files in `/layouts/shortcodes`. + +### Single-word Example: `year` + +Let's assume you would like to keep mentions of your copyright year current in your content files without having to continually review your markdown. Your goal is to be able to call the shortcode as follows: + +```markdown +{{}} +``` + +{{% code file="/layouts/shortcodes/year.html" %}} +```golang +{{ .Page.Now.Year }} +``` +{{% /code %}} + +### Single Positional Example: `youtube` + +Embedded videos are a common addition to markdown content that can quickly become unsightly. The following is the code used by [Hugo's built-in YouTube shortcode][youtubeshortcode]: + +```golang +{{}} +``` + +Would load the template at `/layouts/shortcodes/youtube.html`: + +{{% code file="/layouts/shortcodes/youtube.html" %}} +```html +
      + +
      +``` +{{% /code %}} + +{{% code file="youtube-embed.html" copy="false" %}} +```html +
      + +
      +``` +{{% /code %}} + +### Single Named Example: `image` + +Let's say you want to create your own `img` shortcode rather than use Hugo's built-in [`figure` shortcode][figure]. Your goal is to be able to call the shortcode as follows in your content files: + +{{% code file="content-image.md" %}} +```golang +{{}} +``` +{{% /code %}} + +You have created the shortcode at `/layouts/shortcodes/img.html`, which loads the following shortcode template: + +{{% code file="/layouts/shortcodes/img.html" %}} +```html + +
      + {{ with .Get "link"}}{{ end }} + + {{ if .Get "link"}}{{ end }} + {{ if or (or (.Get "title") (.Get "caption")) (.Get "attr")}} +
      {{ if isset .Params "title" }} +

      {{ .Get "title" }}

      {{ end }} + {{ if or (.Get "caption") (.Get "attr")}}

      + {{ .Get "caption" }} + {{ with .Get "attrlink"}} {{ end }} + {{ .Get "attr" }} + {{ if .Get "attrlink"}} {{ end }} +

      {{ end }} +
      + {{ end }} +
      + +``` +{{% /code %}} + +Would be rendered as: + +{{% code file="img-output.html" copy="false" %}} +```html +
      + +
      +

      Steve Francia

      +
      +
      +``` +{{% /code %}} + +### Single Flexible Example: `vimeo` + +```golang +{{}} +{{}} +``` + +Would load the template found at `/layouts/shortcodes/vimeo.html`: + +{{% code file="/layouts/shortcodes/vimeo.html" %}} +```html +{{ if .IsNamedParams }} +
      + +
      +{{ else }} +
      + +
      +{{ end }} +``` +{{% /code %}} + +Would be rendered as: + +{{% code file="vimeo-iframes.html" copy="false" %}} +```html +
      + +
      +
      + +
      +``` +{{% /code %}} + +### Paired Example: `highlight` + +The following is taken from `highlight`, which is a [built-in shortcode][] that ships with Hugo. + +{{% code file="highlight-example.md" %}} +```markdown +{{}} + + This HTML + +{{}} +``` +{{% /code %}} + +The template for the `highlight` shortcode uses the following code, which is already included in Hugo: + +```golang +{{ .Get 0 | highlight .Inner }} +``` + +The rendered output of the HTML example code block will be as follows: + +{{% code file="syntax-highlighted.html" copy="false" %}} +```html +
      <html>
+    <body> This HTML </body>
+</html>
+
      +``` +{{% /code %}} + +{{% note %}} +The preceding shortcode makes use of a Hugo-specific template function called `highlight`, which uses [Pygments](http://pygments.org) to add syntax highlighting to the example HTML code block. See the [developer tools page on syntax highlighting](/tools/syntax-highlighting/) for more information. +{{% /note %}} + +### Nested Shortcode: Image Gallery + +Hugo's [`.Parent` shortcode variable][parent] returns a boolean value depending on whether the shortcode in question is called within the context of a *parent* shortcode. This provides an inheritance model for common shortcode parameters. + +The following example is contrived but demonstrates the concept. Assume you have a `gallery` shortcode that expects one named `class` parameter: + +{{% code file="layouts/shortcodes/gallery.html" %}} +```html +
      + {{.Inner}} +
      +``` +{{% /code %}} + +You also have an `image` shortcode with a single named `src` parameter that you want to call inside of `gallery` and other shortcodes so that the parent defines the context of each `image`: + +{{% code file="layouts/shortcodes/image.html" %}} +```html +{{- $src := .Get "src" -}} +{{- with .Parent -}} + +{{- else -}} + +{{- end }} +``` +{{% /code %}} + +You can then call your shortcode in your content as follows: + +```markdown +{{}} + {{}} + {{}} +{{}} +{{}} +``` + +This will output the following HTML. Note how the first two `image` shortcodes inherit the `class` value of `content-gallery` set with the call to the parent `gallery`, whereas the third `image` only uses `src`: + +```html +
      + + +
      + +``` + +## More Shortcode Examples + +More shortcode examples can be found in the [shortcodes directory for spf13.com][spfscs] and the [shortcodes directory for the Hugo docs][docsshortcodes]. + +[basic content files]: /content-management/formats/ "See how Hugo leverages markdown--and other supported formats--to create content for your website." +[built-in shortcode]: /content-management/shortcodes/ +[config]: /getting-started/configuration/ "Learn more about Hugo's built-in configuration variables as well as how to us your site's configuration file to include global key-values that can be used throughout your rendered website." +[Content Management: Shortcodes]: /content-management/shortcodes/#using-hugo-s-built-in-shortcodes "Check this section if you are not familiar with the definition of what a shortcode is or if you are unfamiliar with how to use Hugo's built-in shortcodes in your content files." +[source organization]: /getting-started/directory-structure/#directory-structure-explained "Learn how Hugo scaffolds new sites and what it expects to find in each of your directories." +[docsshortcodes]: https://github.com/gohugoio/hugo/tree/master/docs/layouts/shortcodes "See the shortcode source directory for the documentation site you're currently reading." +[figure]: /content-management/shortcodes/#figure +[hugosc]: /content-management/shortcodes/#using-hugo-s-built-in-shortcodes +[lookup order]: /templates/lookup-order/ "See the order in which Hugo traverses your template files to decide where and how to render your content at build time" +[pagevars]: /variables/page/ "See which variables you can leverage in your templating for page vs list templates." +[parent]: /variables/shortcodes/ +[shortcodesvars]: /variables/shortcodes/ "Certain variables are specific to shortcodes, although most .Page variables can be accessed within your shortcode template." +[spfscs]: https://github.com/spf13/spf13.com/tree/master/layouts/shortcodes "See more examples of shortcodes by visiting the shortcode directory of the source for spf13.com, the blog of Hugo's creator, Steve Francia." +[templates]: /templates/ "The templates section of the Hugo docs." +[vimeoexample]: #single-flexible-example-vimeo +[youtubeshortcode]: /content-management/shortcodes/#youtube "See how to use Hugo's built-in YouTube shortcode." \ No newline at end of file diff --git a/content/templates/single-page-templates.md b/content/templates/single-page-templates.md new file mode 100644 index 000000000..c1293924e --- /dev/null +++ b/content/templates/single-page-templates.md @@ -0,0 +1,107 @@ +--- +title: Single Page Templates +linktitle: +description: The primary view of content in Hugo is the single view. Hugo will render every Markdown file provided with a corresponding single template. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-04-06 +categories: [templates] +#tags: [page] +menu: + docs: + parent: "templates" + weight: 60 +weight: 60 +sections_weight: 60 +draft: false +aliases: [/layout/content/] +toc: true +--- + +## Single Page Template Lookup Order + +You can specify a [content's `type`][content type] and `layout` in a single content file's [front matter][]. However, you cannot specify `section` because this is determined based on file location (see [content section][section]). + +Hugo assumes your content section and content type are the same unless you tell Hugo otherwise by providing a `type` directly in the front matter of a content file. This is why #1 and #3 come before #2 and #4, respectively, in the following lookup order. Values in angle brackets (`<>`) are variable. + +1. `/layouts//.html` +2. `/layouts/
      >/.html` +3. `/layouts//single.html` +4. `/layouts/
      /single.html` +5. `/layouts/_default/single.html` +6. `/themes//layouts//.html` +7. `/themes//layouts/
      /.html` +8. `/themes//layouts//single.html` +9. `/themes//layouts/
      /single.html` +10. `/themes//layouts/_default/single.html` + +## Example Single Page Templates + +Content pages are of the type `page` and will therefore have all the [page variables][pagevars] and [site variables][] available to use in their templates. + +### `post/single.html` + +This single page template makes use of Hugo [base templates][], the [`.Format` function][] for dates, the [`.WordCount` page variable][pagevars], and ranges through the single content's specific [taxonomies][pagetaxonomy]. [`with`][] is also used to check whether the taxonomies are set in the front matter. + +{{% code file="layouts/post/single.html" download="single.html" %}} +```html +{{ define "main" }} +
      +

      {{ .Title }}

      +
      +
      + {{ .Content }} +
      +
      +
      + +{{ end }} +``` +{{% /code %}} + +To easily generate new instances of a content type (e.g., new `.md` files in a section like `project/`) with preconfigured front matter, use [content archetypes][archetypes]. + +[archetypes]: /content-management/archetypes/ +[base templates]: /templates/base/ +[config]: /getting-started/configuration/ +[content type]: /content-management/types/ +[directory structure]: /getting-started/directory-structure/ +[dry]: https://en.wikipedia.org/wiki/Don%27t_repeat_yourself +[`.Format` function]: /functions/format/ +[front matter]: /content-management/front-matter/ +[pagetaxonomy]: /templates/taxonomy-templates/#displaying-a-single-piece-of-content-s-taxonomies +[pagevars]: /variables/page/ +[partials]: /templates/partials/ +[section]: /content-management/sections/ +[site variables]: /variables/site/ +[spf13]: http://spf13.com/ +[`with`]: /functions/with/ \ No newline at end of file diff --git a/content/templates/sitemap-template.md b/content/templates/sitemap-template.md new file mode 100644 index 000000000..740fdbf21 --- /dev/null +++ b/content/templates/sitemap-template.md @@ -0,0 +1,75 @@ +--- +title: Sitemap Template +# linktitle: Sitemap +description: Hugo ships with a built-in template file observing the v0.9 of the Sitemap Protocol, but you can override this template if needed. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [templates] +#tags: [sitemap, xml] +menu: + docs: + parent: "templates" + weight: 160 +weight: 160 +sections_weight: 160 +draft: false +aliases: [/layout/sitemap/,/templates/sitemap/] +toc: false +--- + +A single Sitemap template is used to generate the `sitemap.xml` file. +Hugo automatically comes with this template file. *No work is needed on +the users' part unless they want to customize `sitemap.xml`.* + +A sitemap is a `Page` and therefore has all the [page variables][pagevars] available to use in this template along with Sitemap-specific ones: + +`.Sitemap.ChangeFreq` +: The page change frequency + +`.Sitemap.Priority` +: The priority of the page + +`.Sitemap.Filename` +: The sitemap filename + +If provided, Hugo will use `/layouts/sitemap.xml` instead of the internal `sitemap.xml` template that ships with Hugo. + +## Hugo’s sitemap.xml + +This template respects the version 0.9 of the [Sitemap Protocol](http://www.sitemaps.org/protocol.html). + +```xml + + {{ range .Data.Pages }} + + {{ .Permalink }}{{ if not .Lastmod.IsZero }} + {{ safeHTML ( .Lastmod.Format "2006-01-02T15:04:05-07:00" ) }}{{ end }}{{ with .Sitemap.ChangeFreq }} + {{ . }}{{ end }}{{ if ge .Sitemap.Priority 0.0 }} + {{ .Sitemap.Priority }}{{ end }} + + {{ end }} + +``` + +{{% note %}} +Hugo will automatically add the following header line to this file +on render. Please don't include this in the template as it's not valid HTML. + +`` +{{% /note %}} + +## Configure `sitemap.xml` + +Defaults for ``, `` and `filename` values can be set in the site's config file, e.g.: + +```toml +[sitemap] + changefreq = "monthly" + priority = 0.5 + filename = "sitemap.xml" +``` + +The same fields can be specified in an individual content file's front matter in order to override the value assigned to that piece of content at render time. + +[pagevars]: /variables/page/ \ No newline at end of file diff --git a/content/templates/sitemap.md b/content/templates/sitemap.md deleted file mode 100644 index c893f3155..000000000 --- a/content/templates/sitemap.md +++ /dev/null @@ -1,75 +0,0 @@ ---- -aliases: -- /layout/sitemap/ -lastmod: 2015-12-10 -date: 2014-05-07 -linktitle: Sitemap -menu: - main: - parent: layout -next: /templates/404 -notoc: true -prev: /templates/rss -title: Sitemap Template -weight: 95 ---- - -A single Sitemap template is used to generate the `sitemap.xml` file. -Hugo automatically comes with this template file. **No work is needed on -the users' part unless they want to customize `sitemap.xml`.** - -A sitemap is a `Page` and have all the [page -variables](/layout/variables/) available to use in this template -along with Sitemap-specific ones: - -**.Sitemap.ChangeFreq** The page change frequency
      -**.Sitemap.Priority** The priority of the page
      -**.Sitemap.Filename** The sitemap filename
      - -If provided, Hugo will use `/layouts/sitemap.xml` instead of the internal -one. - -## Hugo’s sitemap.xml - -This template uses the version 0.9 of the [Sitemap -Protocol](http://www.sitemaps.org/protocol.html) with Google's [hreflang -attributes](https://support.google.com/webmasters/answer/2620865?hl=en&topic=2370587&ctx=topic) -for linking to translated content. - - - {{ range .Data.Pages }} - - {{ .Permalink }}{{ if not .Lastmod.IsZero }} - {{ safeHTML ( .Lastmod.Format "2006-01-02T15:04:05-07:00" ) }}{{ end }}{{ with .Sitemap.ChangeFreq }} - {{ . }}{{ end }}{{ if ge .Sitemap.Priority 0.0 }} - {{ .Sitemap.Priority }}{{ end }}{{ if .IsTranslated }}{{ range .Translations }} - {{ end }} - {{ end }} - - {{ end }} - - -***Important:** Hugo will automatically add the following header line to this file -on render. Please don't include this in the template as it's not valid HTML.* - - - -## Configuring sitemap.xml - -Defaults for ``, `` and `filename` values can be set in the site's config file, e.g.: - - [sitemap] - changefreq = "monthly" - priority = 0.5 - filename = "sitemap.xml" - -The same fields can be specified in an individual page's front matter in order to override the value for that page. diff --git a/content/templates/taxonomy-templates.md b/content/templates/taxonomy-templates.md new file mode 100644 index 000000000..e2a40c3b7 --- /dev/null +++ b/content/templates/taxonomy-templates.md @@ -0,0 +1,341 @@ +--- +title: Taxonomy Templates +# linktitle: +description: Taxonomy templating includes taxonomy list pages, taxonomy terms pages, and using taxonomies in your single page templates. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [templates] +#tags: [taxonomies,metadata,front matter,terms] +menu: + docs: + parent: "templates" + weight: 50 +weight: 50 +sections_weight: 50 +draft: false +aliases: [/taxonomies/displaying/,/templates/terms/,/indexes/displaying/,/taxonomies/templates/,/indexes/ordering/, /templates/taxonomies/, /templates/taxonomy/] +toc: true +--- + + + +Hugo includes support for user-defined groupings of content called **taxonomies**. Taxonomies are classifications that demonstrate logical relationships between content. See [Taxonomies under Content Management](/content-management/taxonomies) if you are unfamiliar with how Hugo leverages this powerful feature. + +Hugo provides multiple ways to use taxonomies throughout your project templates: + +* Order the way the terms for a taxonomy are displayed in a [taxonomy terms template](#taxonomy-terms-template) +* Order the way content associated with a taxonomy term is displayed in a [taxonomy list template](#taxonomy-list-template) +* List a single content's taxonomy terms within a [single page template][] + +## Taxonomy List Templates + +Taxonomy list page templates are lists and therefore have all the variables and methods available to [list pages][lists]. + +### Taxonomy List Template Lookup Order + +A taxonomy will be rendered at /`PLURAL`/`TERM`/ (e.g., http://spf13.com/topics/golang/) according to the following lookup order: + +1. `/layouts/taxonomy/.html` +2. `/layouts/_default/taxonomy.html` +3. `/layouts/_default/list.html` +4. `/themes//layouts/taxonomy/.html` +5. `/themes//layouts/_default/taxonomy.html` +6. `/themes//layouts/_default/list.html` + +## Taxonomy Terms Template + +### Taxonomy Terms Templates Lookup Order + +A taxonomy terms page will be rendered at `yoursite.com/`/ (e.g., http://spf13.com/topics/) according to the following lookup order: + +1. `/layouts/taxonomy/.terms.html` +2. `/layouts/_default/terms.html` +3. `/themes//layouts/taxonomy/.terms.html` +4. `/themes//layouts/_default/terms.html` + +{{% warning "The Taxonomy Terms Template has a Unique Lookup Order" %}} +If Hugo does not find a terms template in `layout/` or `/themes//layouts/`, Hugo will *not* render a taxonomy terms page. +{{% /warning %}} + + +Hugo makes a set of values and methods available on the various Taxonomy structures. + +### Taxonomy Methods + +A Taxonomy is a `map[string]WeightedPages`. + +.Get(term) +: Returns the WeightedPages for a term. + +.Count(term) +: The number of pieces of content assigned to this term. + +.Alphabetical +: Returns an OrderedTaxonomy (slice) ordered by Term. + +.ByCount +: Returns an OrderedTaxonomy (slice) ordered by number of entries. + +### OrderedTaxonomy + +Since Maps are unordered, an OrderedTaxonomy is a special structure that has a defined order. + +```go +[]struct { + Name string + WeightedPages WeightedPages +} +``` + +Each element of the slice has: + +.Term +: The Term used. + +.WeightedPages +: A slice of Weighted Pages. + +.Count +: The number of pieces of content assigned to this term. + +.Pages +: All Pages assigned to this term. All [list methods][renderlists] are available to this. + +## WeightedPages + +WeightedPages is simply a slice of WeightedPage. + +```go +type WeightedPages []WeightedPage +``` + +.Count(term) +: The number of pieces of content assigned to this term. + +.Pages +: Returns a slice of pages, which then can be ordered using any of the [list methods][renderlists]. + + + +## Order Taxonomies + +Taxonomies can be ordered by either alphabetical key or by the number of content pieces assigned to that key. + +### Order Alphabetically Example + +```html +
        + {{ $data := .Data }} + {{ range $key, $value := .Data.Taxonomy.Alphabetical }} +
      • {{ $value.Name }} {{ $value.Count }}
        • + {{ end }} +
      +``` + +### Order by Popularity Example + +```html +
        + {{ $data := .Data }} + {{ range $key, $value := .Data.Taxonomy.ByCount }} +
      • {{ $value.Name }} {{ $value.Count }}
        • + {{ end }} +
      +``` + + + +## Order Content within Taxonomies + +Hugo uses both `date` and `weight` to order content within taxonomies. + +Each piece of content in Hugo can optionally be assigned a date. It can also be assigned a weight for each taxonomy it is assigned to. + +When iterating over content within taxonomies, the default sort is the same as that used for [section and list pages]() first by weight then by date. This means that if the weights for two pieces of content are the same, than the more recent content will be displayed first. The default weight for any piece of content is 0. + +### Assign Weight + +Content can be assigned weight for each taxonomy that it's assigned to. + +```toml ++++ +tags = [ "a", "b", "c" ] +tags_weight = 22 +categories = ["d"] +title = "foo" +categories_weight = 44 ++++ +Front Matter with weighted tags and categories +``` + +The convention is `taxonomyname_weight`. + +In the above example, this piece of content has a weight of 22 which applies to the sorting when rendering the pages assigned to the "a", "b" and "c" values of the 'tag' taxonomy. + +It has also been assigned the weight of 44 when rendering the 'd' category. + +With this the same piece of content can appear in different positions in different taxonomies. + +Currently taxonomies only support the default ordering of content which is weight -> date. + + + +There are two different templates that the use of taxonomies will require you to provide. + +Both templates are covered in detail in the templates section. + +A [list template](/templates/list/) is any template that will be used to render multiple pieces of content in a single html page. This template will be used to generate all the automatically created taxonomy pages. + +A [taxonomy terms template](/templates/terms/) is a template used to +generate the list of terms for a given template. + + + +There are four common ways you can display the data in your +taxonomies in addition to the automatic taxonomy pages created by hugo +using the [list templates](/templates/list/): + +1. For a given piece of content, you can list the terms attached +2. For a given piece of content, you can list other content with the same + term +3. You can list all terms for a taxonomy +4. You can list all taxonomies (with their terms) + +## Display a Single Piece of Content's Taxonomies + +Within your content templates, you may wish to display the taxonomies that piece of content is assigned to. + +Because we are leveraging the front matter system to define taxonomies for content, the taxonomies assigned to each content piece are located in the usual place (i.e., `.Params.`). + +### Example: List Tags in a Single Page Template + +```html +
        + {{ range .Params.tags }} +
      • {{ . }}
        • + {{ end }} +
      +``` + +If you want to list taxonomies inline, you will have to take care of optional plural endings in the title (if multiple taxonomies), as well as commas. Let's say we have a taxonomy "directors" such as `directors: [ "Joel Coen", "Ethan Coen" ]` in the TOML-format front matter. + +To list such taxonomies, use the following: + +### Example: Comma-delimit Tags in a Single Page Template + +```html +{{ if .Params.directors }} + Director{{ if gt (len .Params.directors) 1 }}s{{ end }}: + {{ range $index, $director := .Params.directors }}{{ if gt $index 0 }}, {{ end }}{{ . }}{{ end }} +{{ end }} +``` + +Alternatively, you may use the [delimit template function][delimit] as a shortcut if the taxonomies should just be listed with a separator. See {{< gh 2143 >}} on GitHub for discussion. + +## List Content with the Same Taxonomy Term + +If you are using a taxonomy for something like a series of posts, you can list individual pages associated with the same taxonomy. This is also a quick and dirty method for showing related content: + +### Example: Showing Content in Same Series + +```html + +``` + +## List All content in a Given taxonomy + +This would be very useful in a sidebar as “featured content”. You could even have different sections of “featured content” by assigning different terms to the content. + +### Example: Grouping "Featured" Content + +```html + +``` + +## Render a Site's Taxonomies + +If you wish to display the list of all keys for your site's taxonomy, you can retrieve them from the [`.Site` variable][sitevars] available on every page. + +This may take the form of a tag cloud, a menu, or simply a list. + +The following example displays all terms in a site's tags taxonomy: + +### Example: List All Site Tags + +```html +
        + {{ range $name, $taxonomy := .Site.Taxonomies.tags }} +
      • {{ $name }}
        • + {{ end }} +
      +``` + +### Example: List All Taxonomies, Terms, and Assigned Content + +This example will list all taxonomies and their terms, as well as all the content assigned to each of the terms. + +{{% code file="layouts/partials/all-taxonomies.html" download="all-taxonomies.html" download="all-taxonomies.html" %}} +```html +
      +
        + {{ range $taxonomyname, $taxonomy := .Site.Taxonomies }} +
      • {{ $taxonomyname }} +
          + {{ range $key, $value := $taxonomy }} +
        • {{ $key }}
          • + + {{ end }} +
        +
        • + {{ end }} +
      +
      +``` +{{% /code %}} + +## `.Site.GetPage` for Taxonomies + +Because taxonomies are lists, the [`.GetPage` function][getpage] can be used to get all the pages associated with a particular taxonomy term using a terse syntax. The following ranges over the full list of tags on your site and links to each of the individual taxonomy pages for each term without having to use the more fragile URL construction of the "List All Site Tags" example above: + +{{% code file="links-to-all-tags" %}} +```html +
        + {{ range ($.Site.GetPage "taxonomyTerm" "tags").Pages }} +
      • {{ .Title}}
        • + {{ end }} +
      +``` +{{% /code %}} + + + + +[delimit]: /functions/delimit/ +[getpage]: /functions/getpage/ +[lists]: /templates/lists/ +[renderlists]: /templates/lists/ +[single page template]: /templates/single-page-templates/ +[sitevars]: /variables/site/ diff --git a/content/templates/template-debugging.md b/content/templates/template-debugging.md new file mode 100644 index 000000000..208259f7f --- /dev/null +++ b/content/templates/template-debugging.md @@ -0,0 +1,81 @@ +--- +title: Template Debugging +# linktitle: Template Debugging +description: You can use Go templates' `printf` function to debug your Hugo templates. These snippets provide a quick and easy visualization of the variables available to you in different contexts. +godocref: http://golang.org/pkg/fmt/ +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [templates] +#tags: [debugging,troubleshooting] +menu: + docs: + parent: "templates" + weight: 180 +weight: 180 +sections_weight: 180 +draft: false +aliases: [] +toc: false +--- + +Here are some snippets you can add to your template to answer some common questions. + +These snippets use the `printf` function available in all Go templates. This function is an alias to the Go function, [fmt.Printf](http://golang.org/pkg/fmt/). + +## What Variables are Available in this Context? + +You can use the template syntax, `$.`, to get the top-level template context from anywhere in your template. This will print out all the values under, `.Site`. + +```html +{{ printf "%#v" $.Site }} +``` + +This will print out the value of `.Permalink`: + + +```html +{{ printf "%#v" .Permalink }} +``` + + +This will print out a list of all the variables scoped to the current context +(`.`, aka ["the dot"][tempintro]). + + +```html +{{ printf "%#v" . }} +``` + + +When developing a [homepage][], what does one of the pages you're looping through look like? + +```html +{{ range .Data.Pages }} + {{/* The context, ".", is now each one of the pages as it goes through the loop */}} + {{ printf "%#v" . }} +{{ end }} +``` + +{{% note "`.Data.Pages` on the Homepage" %}} +`.Data.Pages` on the homepage is equivalent to `.Site.Pages`. +{{% /note %}} + +## Why Am I Showing No Defined Variables? + +Check that you are passing variables in the `partial` function: + +```html +{{ partial "header" }} +``` + +This example will render the header partial, but the header partial will not have access to any contextual variables. You need to pass variables explicitly. For example, note the addition of ["the dot"][tempintro]. + +```html +{{ partial "header" . }} +``` + +The dot (`.`) is considered fundamental to understanding Hugo templating. For more information, see [Introduction to Hugo Templating][tempintro]. + +[homepage]: /templates/homepage/ +[tempintro]: /templates/introduction/ \ No newline at end of file diff --git a/content/templates/terms.md b/content/templates/terms.md deleted file mode 100644 index 83414ceed..000000000 --- a/content/templates/terms.md +++ /dev/null @@ -1,176 +0,0 @@ ---- -aliases: -- /indexes/lists/ -- /doc/indexes/ -- /extras/indexes -lastmod: 2015-09-15 -date: 2014-05-21 -linktitle: Taxonomy Terms -menu: - main: - parent: layout -next: /templates/views -prev: /templates/homepage -title: Taxonomy Terms Template -weight: 60 -toc: true ---- - -A unique template is needed to create a list of the terms for a given -taxonomy. This is different from the [list template](/templates/list/) -as that template is a list of content, whereas this is a list of meta data. - -Note that a taxonomy terms page can also have a content file with frontmatter, see [Source Organization]({{< relref "overview/source-directory.md#content-for-home-page-and-other-list-pages" >}}). - -## Which Template will be rendered? -Hugo uses a set of rules to figure out which template to use when -rendering a specific page. - -A Taxonomy Terms List will be rendered at /`PLURAL`/ -(e.g. http://spf13.com/topics/) -from the following prioritized list: - -* /layouts/taxonomy/`SINGULAR`.terms.html (e.g. `/layouts/taxonomy/topic.terms.html`) -* /layouts/\_default/terms.html - -If a file isn’t present, -then the next one in the list will be used. This enables you to craft -specific layouts when you want to without creating more templates -than necessary. For most sites, only the `_default` file at the end of -the list will be needed. - -If that neither file is found in either the /layouts or /theme/layouts -directory, then Hugo will not render the taxonomy terms pages. It is also -common for people to render taxonomy terms lists on other pages such as -the homepage or the sidebar (such as a tag cloud) and not have a -dedicated page for the terms. - - -## Variables - -Taxonomy Terms pages are of the type `Page` and have all the -[page variables](/templates/variables/) and -[site variables](/templates/variables/) -available to use in the templates. - -Taxonomy Terms pages will additionally have: - -* **.Data.Singular** The singular name of the taxonomy -* **.Data.Plural** The plural name of the taxonomy -* **.Data.Pages** (or as **.Pages**) The taxonomy Terms index pages -* **.Data.Terms** The taxonomy itself -* **.Data.Terms.Alphabetical** The Terms alphabetized -* **.Data.Terms.ByCount** The Terms ordered by popularity - -The last two can also be reversed: **.Data.Terms.Alphabetical.Reverse**, **.Data.Terms.ByCount.Reverse**. - -### Example terms.html files - -This content template is used for [spf13.com](http://spf13.com/). -It makes use of [partial templates](/templates/partials/). The list of taxonomy -templates cannot use a [content view](/templates/views/) as they don't display the content, but -rather information about the content. - -This particular template lists all of the Tags used on -[spf13.com](http://spf13.com/) and provides a count for the number of pieces of -content tagged with each tag. - -`.Data.Terms` is a map of terms ⇒ [contents] - - {{ partial "header.html" . }} - {{ partial "subheader.html" . }} - -
      -
      -

      {{ .Title }}

      - -
        - {{ $data := .Data }} - {{ range $key, $value := .Data.Terms }} -
      • {{ $key }} {{ len $value }}
        • - {{ end }} -
      -
      -
      - - {{ partial "footer.html" . }} - - -Another example listing the content for each term (ordered by Date): - - {{ partial "header.html" . }} - {{ partial "subheader.html" . }} - -
      -
      -

      {{ .Title }}

      - - {{ $data := .Data }} - {{ range $key,$value := .Data.Terms.ByCount }} -

      {{ $value.Name }} {{ $value.Count }}

      -
        - {{ range $value.Pages.ByDate }} -
      • {{ .Title }}
        • - {{ end }} -
      - {{ end }} -
      -
      - - {{ partial "footer.html" . }} - - -## Ordering - -Hugo can order the term meta data in two different ways. It can be ordered: - -* by the number of contents assigned to that key, or -* alphabetically. - -### Example terms.html file (alphabetical) - - {{ partial "header.html" . }} - {{ partial "subheader.html" . }} - -
      -
      -

      {{ .Title }}

      -
        - {{ $data := .Data }} - {{ range $key, $value := .Data.Terms.Alphabetical }} -
      • {{ $value.Name }} {{ $value.Count }}
        • - {{ end }} -
      -
      -
      - {{ partial "footer.html" . }} - -### Example terms.html file (ordered by popularity) - - {{ partial "header.html" . }} - {{ partial "subheader.html" . }} - -
      -
      -

      {{ .Title }}

      -
        - {{ $data := .Data }} - {{ range $key, $value := .Data.Terms.ByCount }} -
      • {{ $value.Name }} {{ $value.Count }}
        • - {{ end }} -
      -
      -
      - - {{ partial "footer.html" . }} - -Hugo can also order and paginate the term index pages in all the normal ways. - -### Example terms.html snippet (paginated and ordered by date) - -

      {{ .Title }}

      -
        - {{ range .Paginator.Pages.ByDate.Reverse }} -
      • {{ .Title }} {{ $.Data.Terms.Count .Data.Term }}
        • - {{ end }} -
      diff --git a/content/templates/variables.md b/content/templates/variables.md deleted file mode 100644 index 962297156..000000000 --- a/content/templates/variables.md +++ /dev/null @@ -1,237 +0,0 @@ ---- -aliases: -- /doc/variables/ -- /layout/variables/ -lastmod: 2015-12-08 -date: 2013-07-01 -linktitle: Variables -menu: - main: - parent: layout -next: /templates/content -prev: /templates/functions -title: Template Variables -weight: 20 -toc: true ---- - -Hugo makes a set of values available to the templates. Go templates are context based. The following -are available in the context for the templates. - -## Page Variables - -The following is a list of most of the accessible variables which can be -defined for a piece of content. Many of these will be defined in the front -matter, content or derived from file location. - -**See also:** [Scratch](/extras/scratch) for page-scoped writable variables. - - - -**.Content** The content itself, defined below the front matter.
      -**.Data** The data specific to this type of page.
      -**.Date** The date the page is associated with.
      -**.Description** The description for the page.
      -**.Draft** A boolean, `true` if the content is marked as a draft in the front matter.
      -**.ExpiryDate** The date where the content is scheduled to expire on.
      -**.FuzzyWordCount** The approximate number of words in the content.
      -**.Hugo** See [Hugo Variables]({{< relref "#hugo-variables" >}}) below.
      -**.IsHome** True if this is the home page.
      -**.IsNode** Always false for regular content pages.
      -**.IsPage** Always true for regular content pages.
      -**.IsTranslated** Whether there are any translations to display.
      -**.Keywords** The meta keywords for this content.
      -**.Kind** What *kind* of page is this: is one of *page, home, section, taxonomy or taxonomyTerm.* There are also *RSS, sitemap, robotsTXT and 404*, but these will only available during rendering of that kind of page, and not available in any of the `Pages` collections.
      -**.Lang** Language taken from the language extension notation.
      -**.Language** A language object that points to this the language's definition in the site config.
      -**.Lastmod** The date the content was last modified.
      -**.LinkTitle** Access when creating links to this content. Will use `linktitle` if set in front matter, else `title`.
      -**.Next** Pointer to the following content (based on pub date).
      -**.NextInSection** Pointer to the following content within the same section (based on pub date)
      -**.Pages** a collection of associated pages. This will be nil for regular content pages. This is an alias for **.Data.Pages**.
      -**.Permalink** The Permanent link for this page.
      -**.Prev** Pointer to the previous content (based on pub date).
      -**.PrevInSection** Pointer to the previous content within the same section (based on pub date). For example, `{{if .PrevInSection}}{{.PrevInSection.Permalink}}{{end}}`.
      -**.PublishDate** The date the content is published on.
      -**.RSSLink** Link to the taxonomies' RSS link.
      -**.RawContent** Raw Markdown content without the metadata header. Useful with [remarkjs.com](http://remarkjs.com)
      -**.ReadingTime** The estimated time it takes to read the content in minutes.
      -**.Ref** Returns the permalink for a given reference. Example: `.Ref "sample.md"`. See [cross-references]({{% ref "extras/crossreferences.md" %}}). Does not handle in-page fragments correctly.
      -**.RelPermalink** The Relative permanent link for this page.
      -**.RelRef** Returns the relative permalink for a given reference. Example: `RelRef "sample.md"`. See [cross-references]({{% ref "extras/crossreferences.md" %}}). Does not handle in-page fragments.
      -**.Section** The [section](/content/sections/) this content belongs to.
      -**.Site** See [Site Variables]({{< relref "#site-variables" >}}) below.
      -**.Summary** A generated summary of the content for easily showing a snippet in a summary view. Note that the breakpoint can be set manually by inserting <!--more--> at the appropriate place in the content page. See [Summaries](/content/summaries/) for more details.
      -**.TableOfContents** The rendered table of contents for this content.
      -**.Title** The title for this page.
      -**.Translations** A list of translated versions of the current page. See [Multilingual]({{< relref "content/multilingual.md" >}}) for more info.
      -**.Truncated** A boolean, `true` if the `.Summary` is truncated. Useful for showing a "Read more..." link only if necessary. See [Summaries](/content/summaries/) for more details.
      -**.Type** The content [type](/content/types/) (e.g. post).
      -**.URL** The relative URL for this page. Note that if `URL` is set directly in frontmatter, that URL is returned as-is.
      -**.UniqueID** The MD5-checksum of the content file's path
      -**.Weight** Assigned weight (in the front matter) to this content, used in sorting.
      -**.WordCount** The number of words in the content.
      - -## Page Params - -Any other value defined in the front matter, including taxonomies, will be made available under `.Params`. -For example, the *tags* and *categories* taxonomies are accessed with: - -* **.Params.tags** -* **.Params.categories** - -**All Params are only accessible using all lowercase characters.** - -This is particularly useful for the introduction of user defined fields in content files. For example, a Hugo website on book reviews could have in the front matter of /content/review/book01.md - - --- - ... - affiliatelink: "http://www.my-book-link.here" - recommendedby: "my Mother" - --- - -Which would then be accessible to a template at `/themes/yourtheme/layouts/review/single.html` through `.Params.affiliatelink` and `.Params.recommendedby`, respectively. Two common situations where these could be introduced are as a value of a certain attribute (like `href=""` below) or by itself to be displayed. Sample syntaxes include: - -

      Buy this book

      -

      It was recommended by {{ .Params.recommendedby }}.

      - -which would render - -

      Buy this book

      -

      It was recommended by my Mother.

      - -**See also:** [Archetypes]({{% ref "content/archetypes.md" %}}) for consistency of `Params` across pieces of content. - -### Param method - -In Hugo you can declare params both for the site and the individual page. A -common use case is to have a general value for the site and a more specific -value for some of the pages (i.e. a header image): - -``` -{{ $.Param "header_image" }} -``` - -The `.Param` method provides a way to resolve a single value whether it's -in a page parameter or a site parameter. - -When frontmatter contains nested fields, like: - -``` ---- -author: - given_name: John - family_name: Feminella - display_name: John Feminella ---- -``` - -then `.Param` can access them by concatenating the field names together with a -dot: - -``` -{{ $.Param "author.display_name" }} -``` - -If your frontmatter contains a top-level key that is ambiguous with a nested -key, as in the following case, - -``` ---- -favorites.flavor: vanilla -favorites: - flavor: chocolate ---- -``` - -then the top-level key will be preferred. In the previous example, this - -``` -{{ $.Param "favorites.flavor" }} -``` - -will print `vanilla`, not `chocolate`. - -### Taxonomy Terms Page Variables - -[Taxonomy Terms](/templates/terms/) pages are of the type `Page` and have the following additional variables. These are available in `layouts/_defaults/terms.html` for example. - -**.Data.Singular** The singular name of the taxonomy
      -**.Data.Plural** The plural name of the taxonomy
      -**.Data.Pages** the list of pages in this taxonomy
      -**.Data.Terms** The taxonomy itself
      -**.Data.Terms.Alphabetical** The Terms alphabetized
      -**.Data.Terms.ByCount** The Terms ordered by popularity
      - -The last two can also be reversed: **.Data.Terms.Alphabetical.Reverse**, **.Data.Terms.ByCount.Reverse**. - -### Taxonomies elsewhere - -The **.Site.Taxonomies** variable holds all taxonomies defines site-wide. It is a map of the taxonomy name to a list of its values. For example: "tags" -> ["tag1", "tag2", "tag3"]. Each value, though, is not a string but rather a [Taxonomy variable](#the-taxonomy-variable). - -#### The Taxonomy variable - -The Taxonomy variable, available as **.Site.Taxonomies.tags** for example, contains the list of tags (values) and, for each of those, their corresponding content pages. - -## Site Variables - -Also available is `.Site` which has the following: - -**.Site.BaseURL** The base URL for the site as defined in the site configuration file.
      -**.Site.RSSLink** The URL for the site RSS.
      -**.Site.Taxonomies** The [taxonomies](/taxonomies/usage/) for the entire site. Replaces the now-obsolete `.Site.Indexes` since v0.11. Also see section [Taxonomies elsewhere](#taxonomies-elsewhere).
      -**.Site.Pages** Array of all content ordered by Date, newest first. `.Site.Pages` replaced `.Site.Recent`, which is no longer supported. This array contains only the pages in the current language.
      -**.Site.AllPages** Array of all pages regardless of their translation.
      -**.Site.Params** A container holding the values from the `params` section of your site configuration file. For example, a TOML config file might look like this: - - baseURL = "http://yoursite.example.com/" - - [params] - description = "Tesla's Awesome Hugo Site" - author = "Nikola Tesla" -**.Site.Sections** Top level directories of the site.
      -**.Site.Files** All of the source files of the site.
      -**.Site.Menus** All of the menus in the site.
      -**.Site.Title** A string representing the title of the site.
      -**.Site.Author** A map of the authors as defined in the site configuration.
      -**.Site.LanguageCode** A string representing the language as defined in the site configuration. This is mostly used to populate the RSS feeds with the right language code.
      -**.Site.DisqusShortname** A string representing the shortname of the Disqus shortcode as defined in the site configuration.
      -**.Site.GoogleAnalytics** A string representing your tracking code for Google Analytics as defined in the site configuration.
      -**.Site.Copyright** A string representing the copyright of your web site as defined in the site configuration.
      -**.Site.LastChange** A string representing the date/time of the most recent change to your site, based on the [`date` variable]({{< ref "content/front-matter.md#required-variables" >}}) in the front matter of your content pages.
      -**.Site.Permalinks** A string to override the default permalink format. Defined in the site configuration.
      -**.Site.BuildDrafts** A boolean (Default: false) to indicate whether to build drafts. Defined in the site configuration.
      -**.Site.Data** Custom data, see [Data Files](/extras/datafiles/).
      -**.Site.IsMultiLingual** Whether there are more than one language in this site.
      See [Multilingual]({{< relref "content/multilingual.md" >}}) for more info.
      -**.Site.Language** This indicates which language you are currently rendering the website for. This is an object with the attributes set in your language definition in your site config.
      -**.Site.Language.Lang** The language code of the current locale, e.g. `en`.
      -**.Site.Language.Weight** The weight that defines the order in the `.Site.Languages` list.
      -**.Site.Language.LanguageName** The full language name, e.g. `English`.
      -**.Site.LanguagePrefix** This can be used to prefix theURLs with whats needed to point to the correct language. It will even work when only one language defined. See also the functions [absLangURL and relLangURL]({{< relref "templates/functions.md#abslangurl-rellangurl" >}}).
      -**.Site.Languages** An ordered list (ordered by defined weight) of languages.
      -**.Site.RegularPages** A shortcut to the *regular page* collection. Equivalent to `where .Site.Pages "Kind" "page"`.
      - -## File Variables - -The `.File` variable gives you additional information of a page. - -> **Note:** `.File` is only accessible on *Pages* that has a content page attached to it. - -Available are the following attributes: - -**.File.Path** The original relative path of the page, e.g. `content/posts/foo.en.md`
      -**.File.LogicalName** The name of the content file that represents a page, e.g. `foo.en.md`
      -**.File.TranslationBaseName** The filename without extension or optional language identifier, e.g. `foo`
      -**.File.BaseFileName** The filename without extension, e.g. `foo.en`
      -**.File.Ext** or **.File.Extension** The file extension of the content file, e.g. `md`
      -**.File.Lang** The language associated with the given file if [Multilingual]({{< relref "content/multilingual.md" >}}) is enabled, e.g. `en`
      -**.File.Dir** Given the path `content/posts/dir1/dir2/`, the relative directory path of the content file will be returned, e.g. `posts/dir1/dir2/`
      - -## Hugo Variables - -Also available is `.Hugo` which has the following: - -**.Hugo.Generator** Meta tag for the version of Hugo that generated the site. Highly recommended to be included by default in all theme headers so we can start to track the usage and popularity of Hugo. Unlike other variables it outputs a **complete** HTML tag, e.g. ``
      -**.Hugo.Version** The current version of the Hugo binary you are using e.g. `0.13-DEV`
      -**.Hugo.CommitHash** The git commit hash of the current Hugo binary e.g. `0e8bed9ccffba0df554728b46c5bbf6d78ae5247`
      -**.Hugo.BuildDate** The compile date of the current Hugo binary formatted with RFC 3339 e.g. `2002-10-02T10:00:00-05:00`
      diff --git a/content/templates/views.md b/content/templates/views.md index c8426ec11..2fba25cb7 100644 --- a/content/templates/views.md +++ b/content/templates/views.md @@ -1,129 +1,127 @@ --- -aliases: -- /templates/views/ -lastmod: 2015-05-22 -date: 2013-07-01 +title: Content View Templates +# linktitle: Content Views +description: Hugo can render alternative views of your content, which is especially useful in list and summary views. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [templates] +#tags: [views] menu: - main: - parent: layout -next: /templates/blocks -prev: /templates/terms -title: Content Views + docs: + parent: "templates" + weight: 70 weight: 70 +sections_weight: 70 +draft: false +aliases: [] toc: true --- -In addition to the [single content template](/templates/content/), Hugo can render alternative views of -your content. These are especially useful in [list templates](/templates/list/). +These alternative **content views** are especially useful in [list templates][lists]. -For example you may want content of every type to be shown on the -homepage, but only a summary view of it there. Perhaps on a taxonomy -list page you would only want a bulleted list of your content. Views -make this very straightforward by delegating the rendering of each -different type of content to the content itself. +The following are common use cases for content views: + +* You want content of every type to be shown on the homepage but only with limited [summary views][summaries]. +* You only want a bulleted list of your content on a [taxonomy list page][taxonomylists]. Views make this very straightforward by delegating the rendering of each different type of content to the content itself. + +## Create a Content View + +To create a new view, create a template in each of your different content type directories with the view name. The following example contains an "li" view and a "summary" view for the `post` and `project` content types. As you can see, these sit next to the [single content view][single] template, `single.html. You can even provide a specific view for a given type and continue to use the `_default/single.html` for the primary view. + +```bash + ▾ layouts/ + ▾ post/ + li.html + single.html + summary.html + ▾ project/ + li.html + single.html + summary.html +``` + +Hugo also has support for a default content template to be used in the event that a specific content view template has not been provided for that type. Content views can also be defined in the `_default` directory and will work the same as list and single templates who eventually trickle down to the `_default` directory as a matter of the lookup order. -## Creating a content view +```bash +▾ layouts/ + ▾ _default/ + li.html + single.html + summary.html +``` -To create a new view, simply create a template in each of your different -content type directories with the view name. In the following example, we -have created a "li" view and a "summary" view for our two content types -of post and project. As you can see, these sit next to the [single -content view](/templates/content/) template "single.html". You can even -provide a specific view for a given type and continue to use the -\_default/single.html for the primary view. +## Which Template Will be Rendered? - ▾ layouts/ - ▾ post/ - li.html - single.html - summary.html - ▾ project/ - li.html - single.html - summary.html +The following is the [lookup order][lookup] for content views: -Hugo also has support for a default content template to be used in the event -that a specific template has not been provided for that type. The default type -works the same as the other types, but the directory must be called "_default". -Content views can also be defined in the "_default" directory. +1. `/layouts//.html` +2. `/layouts/_default/.html` +3. `/themes//layouts//.html` +4. `/themes//layouts/_default/.html` +## Example: Content View Inside a List - ▾ layouts/ - ▾ _default/ - li.html - single.html - summary.html +The following example demonstrates how to use content views inside of your [list templates][lists]. +### `list.html` -## Which Template will be rendered? -Hugo uses a set of rules to figure out which template to use when -rendering a specific page. +In this example, `.Render` is passed into the template to call the [render function][render]. `.Render` is a special function that instructs content to render itself with the view template provided as the first argument. In this case, the template is going to render the `summary.html` view that follows: -Hugo will use the following prioritized list. If a file isn’t present, -then the next one in the list will be used. This enables you to craft -specific layouts when you want to without creating more templates -than necessary. For most sites only the \_default file at the end of -the list will be needed. - -* /layouts/`TYPE`/`VIEW`.html -* /layouts/\_default/`VIEW`.html -* /themes/`THEME`/layouts/`TYPE`/`VIEW`.html -* /themes/`THEME`/layouts/\_default/`view`.html - - -## Example using views - -### rendering view inside of a list - -Using the summary view (defined below) inside of a ([list -templates](/templates/list/)). - -
      -
      -

      {{ .Title }}

      - {{ range .Data.Pages }} +{{% code file="layouts/_default/list.html" download="list.html" %}} +``` +
      +
      +

      {{ .Title }}

      + {{ range .Data.Pages }} {{ .Render "summary"}} - {{ end }} -
      -
      + {{ end }} +
    + +``` +{{% /code %}} -In the above example, you will notice that we have called `.Render` and passed in -which view to render the content with. `.Render` is a special function available on -a content which tells the content to render itself with the provided view template. -In this example, we are not using the li view. To use this we would -change the render line to `{{ .Render "li" }}`. +### `summary.html` +Hugo will pass the entire page object to the following `summary.html` view template. (See [Page Variables][pagevars] for a complete list.) -### li.html - -Hugo will pass the entire page object to the view template. See [page -variables](/templates/variables/) for a complete list. - -This content template is used for [spf13.com](http://spf13.com/). - -
  • - {{ .Title }} -
    {{ .Date.Format "Mon, Jan 2, 2006" }}
    -
    • - -### summary.html - -Hugo will pass the entire page object to the view template. See [page -variables](/templates/variables/) for a complete list. - -This content template is used for [spf13.com](http://spf13.com/). - -
    -
    +{{% code file="layouts/_default/summary.html" download="summary.html" %}} +```html +
    +

    {{ .Title }}

    {{ .Date.Format "Mon, Jan 2, 2006" }} - {{ .FuzzyWordCount }} Words
    -
    +
    + {{ .Summary }} + +
    +``` +{{% /code %}} - {{ .Summary }} - - +### `li.html` +Continuing on the previous example, we can change our render function to use a smaller `li.html` view by changing the argument in the call to the `.Render` function (i.e., `{{ .Render "li" }}`). +{{% code file="layouts/_default/li.html" download="li.html" %}} +```html +
  • + {{ .Title }} +
    {{ .Date.Format "Mon, Jan 2, 2006" }}
    +
    • +``` +{{% /code %}} + +[lists]: /templates/lists/ +[lookup]: /templates/lookup-order/ +[pagevars]: /variables/page/ +[render]: /functions/render/ +[single]: /templates/single-page-templates/ +[spf]: http://spf13.com +[spfsourceli]: https://github.com/spf13/spf13.com/blob/master/layouts/_default/li.html +[spfsourcesection]: https://github.com/spf13/spf13.com/blob/master/layouts/_default/section.html +[spfsourcesummary]: https://github.com/spf13/spf13.com/blob/master/layouts/_default/summary.html +[summaries]: /content-management/summaries/ +[taxonomylists]: /templates/taxonomy-templates/ \ No newline at end of file diff --git a/content/themes/_index.md b/content/themes/_index.md new file mode 100644 index 000000000..10579db1e --- /dev/null +++ b/content/themes/_index.md @@ -0,0 +1,26 @@ +--- +title: Themes +linktitle: Themes Overview +description: Install, use, and create Hugo themes. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +menu: + docs: + parent: "themes" + weight: 01 +weight: 01 +sections_weight: 01 +categories: [themes] +#tags: [themes,introduction,overview] +draft: false +aliases: [/themes/overview/] +toc: false +--- + +Hugo provides a robust theming system that is easy to implement yet feature complete. You can view the themes created by the Hugo community on the [Hugo themes website][hugothemes]. + +Hugo themes are powered by the excellent Go template library and are designed to reduce code duplication. They are easy to both customize and keep in synch with the upstream theme. + +[goprimer]: /templates/introduction/ +[hugothemes]: http://themes.gohugo.io/ diff --git a/content/themes/creating.md b/content/themes/creating.md new file mode 100644 index 000000000..5f921d303 --- /dev/null +++ b/content/themes/creating.md @@ -0,0 +1,87 @@ +--- +title: Creating a Theme +linktitle: Creating a Theme +description: The `hugo new theme` command will scaffold the beginnings of a new theme for you to get you on your way. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [themes] +#tags: [themes, source, organization, directories] +menu: + docs: + parent: "themes" + weight: 30 +weight: 30 +sections_weight: 30 +draft: false +aliases: [/themes/creation/,/tutorials/creating-a-new-theme/] +toc: true +wip: true +--- + +{{% warning "Use Relative Links" %}} +If you're creating a theme with plans to share it with the community, use relative URLs since users of your theme may not publish from the root of their website. See [relURL](/functions/relurl) and [absURL](/functions/absurl). +{{% /warning %}} + +Hugo can initialize a new blank theme directory within your existing `themes` using the `hugo new` command: + +```bash +hugo new theme [name] +``` + +## Theme Components + +A theme consists of templates and static assets such as javascript and css files. Themes can also provide [archetypes][], which are archetypal content types used by the `hugo new` command to scaffold new conte files with preconfigured front matter. + + +{{% note "Use the Hugo Generator Tag" %}} +The [`.Hugo.Generator`](/variables/hugo/) tag is included in all themes featured in the [Hugo Themes Showcase](http://themes.gohugo.io). We ask that you include the generator tag in all sites and themes you create with Hugo to help the core team track Hugo's usage and popularity. +{{% /note %}} + +## Layouts + +Hugo is built around the concept that things should be as simple as possible. +Fundamentally, website content is displayed in two different ways, a single +piece of content and a list of content items. With Hugo, a theme layout starts +with the defaults. As additional layouts are defined, they are used for the +content type or section they apply to. This keeps layouts simple, but permits +a large amount of flexibility. + +## Single Content + +The default single file layout is located at `layouts/_default/single.html`. + +## List of Contents + +The default list file layout is located at `layouts/_default/list.html`. + +## Partial Templates + +Theme creators should liberally use [partial templates](/templates/partials/) +throughout their theme files. Not only is a good DRY practice to include shared +code, but partials are a special template type that enables the themes end user +to be able to overwrite just a small piece of a file or inject code into the +theme from their local /layouts. These partial templates are perfect for easy +injection into the theme with minimal maintenance to ensure future +compatibility. + +## Static + +Everything in the static directory will be copied directly into the final site +when rendered. No structure is provided here to enable complete freedom. It is +common to organize the static content into: + +``` +/css +/js +/img +``` + +The actual structure is entirely up to you, the theme creator, on how you would like to organize your files. + +## Archetypes + +If your theme makes use of specific keys in the front matter, it is a good idea +to provide an archetype for each content type you have. [Read more about archetypes][archetypes]. + +[archetypes]: /content-management/archetypes/ diff --git a/content/themes/creation.md b/content/themes/creation.md deleted file mode 100644 index 5f7a2e53b..000000000 --- a/content/themes/creation.md +++ /dev/null @@ -1,78 +0,0 @@ ---- -lastmod: 2015-08-04 -date: 2014-05-12T10:09:17Z -menu: - main: - parent: themes -next: /templates/overview -prev: /themes/customizing -title: Creating a Theme -weight: 50 ---- - -Hugo has the ability to create a new theme in your themes directory for you -using the `hugo new` command. - -`hugo new theme [name]` - -This command will initialize all of the files and directories a basic theme -would need. Hugo themes are written in the Go template language. If you are new -to Go, the [Go template primer](/layout/go-templates/) will help you get started. - -## Theme Components - -A theme consists of templates and static assets such as javascript and css -files. Themes can also optionally provide [archetypes](/content/archetypes/) -which are archetypal content types used by the `hugo new` command. - -### Layouts - -Hugo is built around the concept that things should be as simple as possible. -Fundamentally website content is displayed in two different ways, a single -piece of content and a list of content items. With Hugo a theme layout starts -with the defaults. As additional layouts are defined they are used for the -content type or section they apply to. This keeps layouts simple, but permits -a large amount of flexibility. - -### Single Content - -The default single file layout is located at `layouts/_default/single.html`. - -### List of Contents - -The default list file layout is located at `layouts/_default/list.html`. - -### Partial Templates - -Theme creators should liberally use [partial templates](/templates/partials/) -throughout their theme files. Not only is a good DRY practice to include shared -code, but partials are a special template type that enables the themes end user -to be able to overwrite just a small piece of a file or inject code into the -theme from their local /layouts. These partial templates are perfect for easy -injection into the theme with minimal maintenance to ensure future -compatibility. - -### Static - -Everything in the static directory will be copied directly into the final site -when rendered. No structure is provided here to enable complete freedom. It is -common to organize the static content into: - - /css - /js - /img - -The actual structure is entirely up to you, the theme creator, on how you would like to organize your files. - - -### Archetypes - -If your theme makes use of specific keys in the front matter, it is a good idea -to provide an archetype for each content type you have. Archetypes follow the -[guidelines provided](/content/archetypes/). - - -### Generator meta tag - -With a growing community around Hugo we recommend theme creators to include the [Generator meta tag]({{< relref "templates/variables.md#hugo-variables" >}}) with `.Hugo.Generator` in the `` of your HTML code. The output might looks like `` and helps us to analyse the usage and popularity of Hugo. - diff --git a/content/themes/customizing.md b/content/themes/customizing.md index f381106db..b0fbdd064 100644 --- a/content/themes/customizing.md +++ b/content/themes/customizing.md @@ -1,56 +1,80 @@ --- -lastmod: 2015-08-04 -date: 2014-05-12T10:09:34Z -menu: - main: - parent: themes -next: /themes/creation -prev: /themes/usage title: Customizing a Theme -weight: 40 +linktitle: Customizing a Theme +description: Customize a theme by overriding theme layouts and static assets in your top-level project directories. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [themes] +#tags: [themes, source, organization, directories] +menu: + docs: + parent: "themes" + weight: 20 +weight: 20 +sections_weight: 20 +draft: false +aliases: [/themes/customize/] toc: true +wip: true --- -_The following are key concepts for Hugo site customization. Hugo permits you to **supplement or override** any theme template or static file, with files in your working directory._ +The following are key concepts for Hugo site customization with themes. Hugo permits you to supplement *or* override any theme template or static file with files in your working directory. -_When you use a theme cloned from its git repository, you do not edit the theme's files directly. Rather, you override them as per the following:_ +{{% note %}} +When you use a theme cloned from its git repository, do not edit the theme's files directly. Instead, theme customization in Hugo is a matter of *overriding* the templates made available to you in a theme. This provides the added flexibility of tweaking a theme to meet your needs while staying current with a theme's upstream. +{{% /note %}} -## Replace Static Files +## Override Static Files -For including a different file than what the theme ships with. For example, if you would like to use a more recent version of jQuery than what the theme happens to include, simply place an identically-named file in the same relative location but in your working directory. +There are times where you want to include static assets that differ from versions of the same asset that ships with a theme. -For example, if the theme has jQuery 1.6 in: +For example, a theme may use jQuery 1.8 in the following location: - /themes/themename/static/js/jquery.min.js +```bash +/themes//static/js/jquery.min.js +``` -... you would simply place your file in the same relative path, but in the root of your working folder: +You want to replace the version of jQuery that ships with the theme with the newer `jquery-3.1.1.js`. The easiest way to do this is to replace the file *with a file of the same name* in the same relative path in your project's root. Therefore, change `jquery-3.1.1.js` to `jquery.min.js` so that it is *identical* to the theme's version and place the file here: - /static/js/jquery.min.js +```bash +/static/js/jquery.min.js +``` -## Replace a single template file +## Override Template Files Anytime Hugo looks for a matching template, it will first check the working directory before looking in the theme directory. If you would like to modify a template, simply create that template in your local `layouts` directory. -In the [template documentation](/templates/overview/) _each different template type explains the rules it uses to determine which template to use_. Read and understand these rules carefully. +The [template lookup order][lookup] explains the rules Hugo uses to determine which template to use for a given piece of content. Read and understand these rules carefully. -This is especially helpful when the theme creator used [partial templates](/templates/partials/). These partial templates are perfect for easy injection into the theme with minimal maintenance to ensure future compatibility. +This is especially helpful when the theme creator used [partial templates][partials]. These partial templates are perfect for easy injection into the theme with minimal maintenance to ensure future compatibility. For example: - /themes/themename/layouts/_default/single.html +```bash +/themes//layouts/_default/single.html +``` -... would be overridden by: +Would be overwritten by - /layouts/_default/single.html +```bash +/layouts/_default/single.html +``` -**Warning**: This only works for templates that Hugo "knows about" (that follow its convention for folder structure and naming). If the theme imports template files in a creatively-named directory, Hugo won’t know to look for the local `/layouts` first. +{{% warning %}} +This only works for templates that Hugo "knows about" (i.e., that follow its convention for folder structure and naming). If a theme imports template files in a creatively named directory, Hugo won’t know to look for the local `/layouts` first. +{{% /warning %}} -## Replace an archetype +## Override Archetypes If the archetype that ships with the theme for a given content type (or all content types) doesn’t fit with how you are using the theme, feel free to copy it to your `/archetypes` directory and make modifications as you see fit. -## Beware of the default +{{% warning "Beware of `layouts/_default`" %}} +The `_default` directory is a very powerful force in Hugo, especially as it pertains to overwriting theme files. If a default file is located in the local [archetypes](/content-management/archetypes/) or layout directory (i.e., `archetypes/default.md` or `/layouts/_default/*.html`, respectively), it will override the file of the same name in the corresponding theme directory (i.e., `themes//archetypes/default.md` or `themes//layout/_defaults/*.html`, respectively). -**Default** is a very powerful force in Hugo, especially as it pertains to overwriting theme files. If a default is located in the local archetype directory or `/layouts/_default/` directory, it will be used instead of any of the similar files in the theme. +It is usually better to override specific files; i.e. rather than using `layouts/_default/*.html` in your working directory. +{{% /warning %}} -It is usually better to override specific files rather than using the default in your working directory. +[archetypes]: /content-management/archetypes/ +[lookup]: /templates/lookup-order/ +[partials]: /templates/partials/ \ No newline at end of file diff --git a/content/themes/installing-and-using-themes.md b/content/themes/installing-and-using-themes.md new file mode 100644 index 000000000..f1e35477b --- /dev/null +++ b/content/themes/installing-and-using-themes.md @@ -0,0 +1,114 @@ +--- +title: Installing and Using Themes +linktitle: Installing and Using Themes +description: Install and use a theme from the Hugo theme showcase easily through the CLI. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [themes] +#tags: [install, themes, source, organization, directories,usage] +menu: + docs: + parent: "themes" + weight: 10 +weight: 10 +sections_weight: 10 +draft: false +aliases: [/themes/usage/,/themes/installing/] +toc: true +wip: true +--- + +{{% note "No Default Theme" %}} +Hugo currently doesn’t ship with a “default” theme. This decision is intentional. We leave it up to you to decide which theme best suits your Hugo project. +{{% /note %}} + +## Assumptions + +1. You have already [installed Hugo on your development machine][install]. +2. You have git installed on your machine and you are familiar with basic git usage. + +## Install Themes + +The community-contributed themes featured on [themes.gohugo.io](//themes.gohugo.io/) are hosted in a [centralized GitHub repository][themesrepo]. The Hugo Themes Repo at is really a meta repository that contains pointers to a set of contributed themes. + +{{% warning "Get `git` First" %}} +Without [Git](https://git-scm.com/) installed on your computer, none of the following theme instructions will work. Git tutorials are beyond the scope of the Hugo docs, but [GitHub](https://try.github.io/) and [codecademy](https://www.codecademy.com/learn/learn-git) offer free, interactive courses for beginners. +{{% /warning %}} + +### Install All Themes + +You can install *all* available Hugo themes by cloning the entire [Hugo Theme repository on GitHub][themesrepo] from within your working directory. Depending on your internet connection the download of all themes might take a while. + +```bash +git clone --depth 1 --recursive https://github.com/gohugoio/hugoThemes.git themes +``` + +Before you use a theme, remove the .git folder in that theme's root folder. Otherwise, this will cause problem if you deploy using Git. + +### Install a Single Theme + +Change into the `themes` directory and download a theme by replacing `URL_TO_THEME` with the URL of the theme repository: + +```bash +cd themes +git clone URL_TO_THEME +``` + +The following example shows how to use the "Hyde" theme, which has its source hosted at : + +{{% code file="clone-theme.sh" %}} +```bash +cd themes +git clone https://github.com/spf13/hyde +``` +{{% /code %}} + +Alternatively, you can download the theme as a `.zip` file, unzip the theme contents, and then move the unzipped source into your `themes` directory. + +{{% note "Read the `README`" %}} +Always review the `README.md` file that is shipped with a theme. Often, these files contain further instructions required for theme setup; e.g., copying values from an example configuration file. +{{% /note %}} + +## Theme Placement + +Please make certain you have installed the themes you want to use in the +`/themes` directory. This is the default directory used by Hugo. Hugo comes with the ability to change the themes directory via the [`themesDir` variable in your site configuration][config], but this is not recommended. + +## Use Themes + +Hugo applies the decided theme first and then applies anything that is in the local directory. This allows for easier customization while retaining compatibility with the upstream version of the theme. To learn more, go to [customizing themes][customizethemes]. + +### Command Line + +There are two different approaches to using a theme with your Hugo website: via the Hugo CLI or as part of your + +To change a theme via the Hugo CLI, you can pass the `-t` [flag][] when building your site: + +```bash +hugo -t themename +``` + +Likely, you will want to add the theme when running the Hugo local server, especially if you are going to [customize the theme][customizethemes]: + +```bash +hugo server -t themename +``` + +### `config` File + +If you've already decided on the theme for your site and do not want to fiddle with the command line, you can add the theme directly to your [site configuration file][config]: + +```yaml +theme: themename +``` + +{{% note "A Note on `themename`" %}} +The `themename` in the above examples must match the name of the specific theme directory inside `/themes`; i.e., the directory name (likely lowercase and urlized) rather than the name of the theme displayed in the [Themes Showcase site](http://themes.gohugo.io). +{{% /note %}} + +[customizethemes]: /themes/customizing/ +[flag]: /getting-started/usage/ "See the full list of flags in Hugo's basic usage." +[install]: /getting-started/installing/ +[config]: /getting-started/configuration/ "Learn how to customize your Hugo website configuration file in yaml, toml, or json." +[themesrepo]: https://github.com/gohugoio/hugoThemes \ No newline at end of file diff --git a/content/themes/installing.md b/content/themes/installing.md deleted file mode 100644 index a70f50287..000000000 --- a/content/themes/installing.md +++ /dev/null @@ -1,46 +0,0 @@ ---- -lastmod: 2015-10-10 -date: 2014-05-12T10:09:49Z -menu: - main: - parent: themes -next: /themes/usage -prev: /themes/overview -title: Installing Themes -weight: 20 ---- - -Community-contributed [Hugo themes](http://themes.gohugo.io/), showcased -at [themes.gohugo.io](//themes.gohugo.io/), are hosted in a centralized -GitHub repository. The [Hugo Themes Repo](https://github.com/gohugoio/hugoThemes) -itself at [github.com/gohugoio/hugoThemes](https://github.com/gohugoio/hugoThemes) is -really a meta repository which contains pointers to set of contributed themes. - -## Installing all themes - -If you would like to install all of the available Hugo themes, simply -clone the entire repository from within your working directory. Depending -on your internet connection the download of all themes might take a while. - -> **NOTE:** Make sure you've installed [Git](https://git-scm.com/) on your computer. -Otherwise you will not be able to clone the theme repositories. - -```bash -$ git clone --depth 1 --recursive https://github.com/gohugoio/hugoThemes.git themes -``` -Before you use a theme, remove the .git folder in that theme's root folder. Otherwise, this will cause problem if you deploy using Git. - -## Installing a specific theme - -Switch into the `themes` directory and download a theme by replacing `URL_TO_THEME` -with the URL of the theme repository, e.g. `https://github.com/spf13/hyde`: - - $ cd themes - $ git clone URL_TO_THEME - -Alternatively, you can download the theme as `.zip` file and extract it in the -`themes` directory. - -**NOTE:** Please have a look at the `README.md` file that is shipped with all themes. -It might contain further instructions that are required to setup the theme, e.g. copying -an example configuration file. diff --git a/content/themes/overview.md b/content/themes/overview.md deleted file mode 100644 index 94e7259fd..000000000 --- a/content/themes/overview.md +++ /dev/null @@ -1,32 +0,0 @@ ---- -lastmod: 2015-10-10 -date: 2014-05-12T10:03:52Z -menu: - main: - parent: themes -next: /themes/installing -prev: /content/example -title: Themes Overview -weight: 10 ---- - -Hugo provides a robust theming system which is simple, yet capable of producing -even the most complicated websites. - -The Hugo community has created [a wide variety of beautiful themes](//themes.gohugo.io/), as demoed at [themes.gohugo.io](//themes.gohugo.io/), -ready for using in your own site. - -Hugo themes have been designed to be the perfect balance between -simplicity and functionality. Hugo themes are powered by the excellent -Go template library. If you are new to Go templates, see our [primer on -Go templates](/templates/go-templates/). - -Hugo themes support all modern features you come to expect. They are -structured in such a way to eliminate code duplication. Themes are also -designed to be very easy to customize while retaining the ability to -maintain upgradeability as the upstream theme changes. - -Hugo currently doesn’t ship with a “default” theme, allowing the user to -pick whichever theme best suits their project. - -We hope you will find Hugo themes perfect for your site. diff --git a/content/themes/usage.md b/content/themes/usage.md deleted file mode 100644 index 5b1d11c02..000000000 --- a/content/themes/usage.md +++ /dev/null @@ -1,27 +0,0 @@ ---- -lastmod: 2015-01-27 -date: 2014-05-12T10:09:27Z -menu: - main: - parent: themes -next: /themes/customizing -prev: /themes/installing -title: Using a Theme -weight: 30 ---- - -Please make certain you have installed the themes you want to use in the -`/themes` directory. - -To use a theme for a site, execute Hugo with the following parameter: - - hugo -t ThemeName - -or add this line to your site configuration: - - theme: "ThemeName" - -The *ThemeName* must match the name of the directory inside `/themes`. - -Hugo will then apply the theme first, then apply anything that is in the local -directory. To learn more, go to [customizing themes](/themes/customizing/). diff --git a/content/tools/_index.md b/content/tools/_index.md index d5543f045..7c3e66aa8 100644 --- a/content/tools/_index.md +++ b/content/tools/_index.md @@ -1,144 +1,25 @@ --- -date: 2015-09-12T10:40:31+02:00 -title: Tools -weight: 120 +title: Developer Tools +linktitle: Developer Tools Overview +description: In addition to Hugo's powerful CLI, there is a large number of community-developed tool chains for Hugo developers. +date: 2016-12-05 +publishdate: 2016-12-05 +lastmod: 2017-02-26 +categories: [developer tools] +#tags: [] +menu: + docs: + parent: "tools" + weight: 01 +weight: 01 +sections_weight: 01 +draft: false +aliases: [/tools/] --- -This section highlights some projects around Hugo that are independently developed. These tools try to extend the functionality of our static site generator or help you to get started. +One of Hugo's greatest strengths is it's passionate---and always evolving---developer community. With the exception of the `highlight` shortcode mentioned in [Syntax Highlighting][syntax], the tools and other projects featured in this section are offerings from both commercial services and open-source projects, many of which are developed by Hugo developers just like you. -> **Note:** Do you know or maintain a similar project around Hugo? Feel free to open a [pull request](https://github.com/gohugoio/hugo/pulls) on GitHub if you think it should be added. +[See the popularity of Hugo compared with other static site generators.][staticgen] - -## Migration - -Take a look at this list of migration tools if you currently use other blogging tools like Jekyll or WordPress but intend to switch to Hugo instead. They'll take care to export -your content into Hugo-friendly formats. - -### Jekyll - -Alternatively, you can follow the manual [migration guide]({{< relref "tutorials/migrate-from-jekyll.md" >}}) or use the new [Jekyll import command]({{< relref "commands/hugo_import_jekyll.md" >}}). - -- [JekyllToHugo](https://github.com/SenjinDarashiva/JekyllToHugo) - A Small script for converting Jekyll blog posts to a Hugo site. -- [ConvertToHugo](https://github.com/coderzh/ConvertToHugo) - Convert your blog from Jekyll to Hugo. - -### Ghost - -- [ghostToHugo](https://github.com/jbarone/ghostToHugo) - Convert Ghost blog posts and export them to Hugo. - -### Octopress - -- [octohug](https://github.com/codebrane/octohug) - Octopress to Hugo migrator. - -### DokuWiki - -- [dokuwiki-to-hugo](https://github.com/wgroeneveld/dokuwiki-to-hugo) - Migrates your dokuwiki source pages from [DokuWiki syntax](https://www.dokuwiki.org/wiki:syntax) to Hugo Markdown syntax. Includes extra's like the TODO plugin. Written with extensibility in mind using python 3. Also generates a TOML header for each page. Designed to copypaste the wiki directory into your /content directory. - -### WordPress - -- [wordpress-to-hugo-exporter](https://github.com/SchumacherFM/wordpress-to-hugo-exporter) - A one-click WordPress plugin that converts all posts, pages, taxonomies, metadata, and settings to Markdown and YAML which can be dropped into Hugo. (Note: If you have trouble using this plugin, you can [export your site for Jekyll](https://wordpress.org/plugins/jekyll-exporter/) and use Hugo's built in Jekyll converter listed above.) - -### Tumblr - -- [tumblr-importr](https://github.com/carlmjohnson/tumblr-importr) - An importer that uses the Tumblr API to create a Hugo static site. -- [tumblr2hugomarkdown](https://github.com/Wysie/tumblr2hugomarkdown) - Export all your Tumblr content to Hugo Markdown files with preserved original formatting. -- [Tumblr to Hugo](https://github.com/jipiboily/tumblr-to-hugo) - A migration tool that converts each of your Tumblr posts to a content file with a proper title and path. Furthermore, "Tumblr to Hugo" creates a CSV file with the original URL and the new path on Hugo, to help you setup the redirections. - -### Drupal - -- [drupal2hugo](https://github.com/danapsimer/drupal2hugo) - Convert a Drupal site to Hugo. - -### Joomla - -- [hugojoomla](https://github.com/davetcc/hugojoomla) - This utility written in Java takes a Joomla database and converts all the content into Markdown files. It changes any URLs that are in Joomla's internal format and converts them to a suitable form. - -### Blogger - -- [blogimport](https://github.com/natefinch/blogimport) - A tool to import from Blogger posts to Hugo. - -### Contentful - -- [contentful2hugo](https://github.com/ArnoNuyts/contentful2hugo) - A tool to create content-files for Hugo from content on [Contentful](https://www.contentful.com/). - ----- - -## Deployment - -If you don't want to use [Wercker for automated deployments]({{< relref "tutorials/automated-deployments.md" >}}), give these tools a try to get your content to the public: - -- [hugomac](https://github.com/nickoneill/hugomac) - Hugomac is an OS X menubar app to publish your blog directly to Amazon S3. No command line is needed. -- [hugo-lambda](https://github.com/ryansb/hugo-lambda) - A wrapper around the Hugo static site generator to have it run in AWS Lambda whenever new (Markdown or other) content is uploaded. -- [hugodeploy](https://github.com/mindok/hugodeploy) - Simple SFTP deployment tool for static websites (e.g. created by Hugo) with optional minification. -- [webhook](https://github.com/adnanh/webhook) - Run build and deployment scripts (e.g. hugo) on incoming webhooks -- [Hugo SFTP Upload](https://github.com/thomasmey/HugoSftpUpload) - Sync the local build of your Hugo website with your remote webserver via SFTP. - ----- - -## Frontends - -Do you prefer an graphical user interface over a text editor? Then give these frontends a try: - -- [enwrite](https://github.com/zzamboni/enwrite) - Evernote-powered statically-generated blogs and websites. Now posting to your blog or updating your website is as easy as writing a new note in Evernote! -- [caddy-hugo](https://github.com/hacdias/caddy-hugo) - This is an add-on for [Caddy](https://caddyserver.com/) which wants to deliver a good UI to edit the content of the website. -- [Lipi](https://github.com/SohanChy/Lipi) - A native GUI frontend written in Java to manage your Hugo websites. - ----- - -## Editor plugins - -If you still want to use an editor, look at these plugins to automate your workflow: - -### Sublime Text - -- [Hugofy](https://github.com/akmittal/Hugofy) - Hugofy is a plugin for Sublime Text 3 to make life easier to use Hugo static site generator. - -### Visual Studio Code - -- [Hugofy](https://marketplace.visualstudio.com/items?itemName=akmittal.hugofy) - Hugofy is a plugin for Visual Studio Code to make life easier to use Hugo static site generator. The source code can be found [here](https://github.com/akmittal/hugofy-vscode). - -### Emacs - -- [easy-hugo](https://github.com/masasam/emacs-easy-hugo) - Major mode & tools for Hugo. -- [hugo.el](https://github.com/yewton/hugo.el) - Some helper functions for creating a Website with Hugo. - -### Vim - -- [Vim Hugo Helper](https://github.com/robertbasic/vim-hugo-helper) - A small Vim plugin to help me with writing posts with Hugo. - -### Atom - -- [Hugofy](https://atom.io/packages/hugofy) - A Hugo Static Website Generator package for Atom - ----- - -## Search - -A static site with a dynamic search function? Yes. Alternatively to embeddable scripts from Google or other search engines you can provide your visitors a custom search by indexing your content files directly. - -- [Hugoidx](https://github.com/blevesearch/hugoidx) is an experimental application to create a search index. It's build on top of [Bleve](http://www.blevesearch.com/). -- This [GitHub Gist](https://gist.github.com/sebz/efddfc8fdcb6b480f567) contains simple workflow to create a search index for your static site. It uses a simple Grunt script to index all your content files and [lunr.js](http://lunrjs.com/) to serve the search results. -- [hugo-lunr](https://www.npmjs.com/package/hugo-lunr) - A simple way to add site search to your static Hugo site using [lunr.js](http://lunrjs.com/). Hugo-lunr will create an index file of any html and markdown documents in your Hugo project. - ----- - -## Commercial Services - -- [Algolia](https://www.algolia.com/)'s Search API makes it easy to deliver a great search experience in your apps & websites. Algolia Search provides hosted full-text, numerical, faceted and geolocalized search. - -- [Appernetic.io](https://appernetic.io) is a Hugo Static Site Generator as a Service that is easy to use for non-technical users. -Features: inline PageDown editor, visual tree view, image upload and digital asset management with Cloudinary, site preview, continuous integration with GitHub, atomic deploy and hosting, Git and Hugo integration, autosave, custom domain, project syncing, theme cloning and management. Developers have complete control over the source code and can manage it with GitHub's deceptively simple workflow. - -- [Netlify.com](https://www.netlify.com), builds, deploy & hosts your static site or app (Hugo, Jekyll etc). Build, deploy and host your static site or app with a drag and drop interface and automatic deploys from GitHub or Bitbucket. -Features: global CDN, atomic deploys, ultra fast DNS, instant cache invalidation, high availability, automated hosting, Git integration, form submission hooks, authentication providers, custom domain. Developers have complete control over the source code and can manage it with GitHub's or Bitbuckets deceptively simple workflow. - -- [Forestry.io](https://forestry.io/) - A simple CMS for Jekyll and Hugo sites with support for GitHub, GitLab and Bitbucket. Every time an update is made via the CMS, Forestry will commit changes back to your repo and will compile/deploy your site (S3, GitHub Pages, FTP, etc). - ----- - -## Other - -And for all the other small things around Hugo: - -- [hugo-gallery](https://github.com/icecreammatt/hugo-gallery) lets you create an image gallery for Hugo sites. -- [flickr-hugo-embed](https://github.com/nikhilm/flickr-hugo-embed) prints shortcodes to embed a set of images from an album on Flickr into Hugo. -- [hugo-openapispec-shortcode](https://github.com/tenfourty/hugo-openapispec-shortcode) A shortcode which allows you to include [Open API Spec](https://openapis.org) (formerly known as Swagger Spec) in a page. -- [HugoPhotoSwipe](https://github.com/GjjvdBurg/HugoPhotoSwipe) makes it easy to create image galleries using PhotoSwipe. +[staticgen]: https://staticgen.com +[syntax]: /tools/syntax-highlighting/ diff --git a/content/tools/editors.md b/content/tools/editors.md new file mode 100644 index 000000000..f98a7d36c --- /dev/null +++ b/content/tools/editors.md @@ -0,0 +1,44 @@ +--- +title: Editor Plug-ins for Hugo +linktitle: Editor Plug-ins +description: The Hugo community uses a wide range of preferred tools and has developed plug-ins for some of the most popular text editors to help automate parts of your workflow. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [developer tools] +#tags: [editor, plug-ins] +menu: + docs: + parent: "tools" + weight: 50 +weight: 50 +sections_weight: 50 +draft: false +aliases: [] +toc: false +--- + +The Hugo community uses a wide range of preferred tools and has developed plug-ins for some of the most popular text editors to help automate parts of your workflow. + +## Sublime Text + +* [Hugofy](https://github.com/akmittal/Hugofy). Hugofy is a plugin for Sublime Text 3 to make life easier to use Hugo static site generator. + +## Visual Studio Code + +* [Hugofy](https://marketplace.visualstudio.com/items?itemName=akmittal.hugofy). Hugofy is a plugin for Visual Studio Code to "make life easier" when developing with Hugo. The source code can be found [here](https://github.com/akmittal/hugofy-vscode). + +## Emacs + +* [hugo.el](https://github.com/yewton/hugo.el). Some helper functions for creating a Website with Hugo. Note that Hugo also supports [Org-mode][formats]. + +## Vim + +* [Vim Hugo Helper](https://github.com/robertbasic/vim-hugo-helper). A small Vim plugin to help me with writing posts with Hugo. + +## Atom + +* [Hugofy](https://atom.io/packages/hugofy). A Hugo Static Website Generator package for Atom. +* [language-hugo](https://atom.io/packages/language-hugo). Adds syntax highlighting to Hugo files. + +[formats]: /content-management/formats/ \ No newline at end of file diff --git a/content/tools/frontends.md b/content/tools/frontends.md new file mode 100644 index 000000000..d0c6b3168 --- /dev/null +++ b/content/tools/frontends.md @@ -0,0 +1,33 @@ +--- +title: Frontend Interfaces with Hugo +linktitle: Frontends +description: Do you prefer a graphical user interface over a text editor? Give these frontends a try. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [developer tools] +#tags: [frontend,gui] +menu: + docs: + parent: "tools" + weight: 40 +weight: 40 +sections_weight: 40 +draft: false +aliases: [] +toc: false +--- + +* [enwrite](https://github.com/zzamboni/enwrite). Enwrite enables evernote-powered, statically generated blogs and websites. Now posting to your blog or updating your website is as easy as writing a new note in Evernote! +* [caddy-hugo](https://github.com/hacdias/caddy-hugo). `caddy-hugo` is an add-on for [Caddy](https://caddyserver.com/) that delivers a good UI to edit the content of your Hugo website. +* [Lipi](https://github.com/SohanChy/Lipi). Lipi is a native GUI frontend written in Java to manage your Hugo websites. + + +## Commercial Services + +* [Appernetic.io](https://appernetic.io) is a Hugo Static Site Generator as a Service that is easy to use for non-technical users. + * **Features:** inline PageDown editor, visual tree view, image upload and digital asset management with Cloudinary, site preview, continuous integration with GitHub, atomic deploy and hosting, Git and Hugo integration, autosave, custom domain, project syncing, theme cloning and management. Developers have complete control over the source code and can manage it with GitHub’s deceptively simple workflow. +* [DATOCMS](https://www.datocms.com) DatoCMS is a fully customizable administrative area for your static websites. Use your favorite website generator, let your clients publish new content independently, and the host the site anywhere you like. +* [Forestry.io](https://forestry.io/). Forestry is a simple CMS for Jekyll and Hugo websites with support for GitHub, GitLab, and Bitbucket. Every time an update is made via the CMS, Forestry will commit changes back to your repo and will compile/deploy your website to S3, GitHub Pages, FTP, etc. +* [Netlify.com](https://www.netlify.com). Netlify builds, deploys, and hosts your static website or app (Hugo, Jekyll, etc). Netlify offers a drag-and-drop interface and automatic deployments from GitHub or Bitbucket. + * **Features:** global CDN, atomic deploys, ultra-fast DNS, instant cache invalidation, high availability, automated hosting, Git integration, form submission hooks, authentication providers, and custom domains. Developers have complete control over the source code and can manage it with GitHub or Bitbucket's deceptively simple workflow. diff --git a/content/tools/migrations.md b/content/tools/migrations.md new file mode 100644 index 000000000..227bdd222 --- /dev/null +++ b/content/tools/migrations.md @@ -0,0 +1,71 @@ +--- +title: Migrate to Hugo +linktitle: Migrations +description: A list of community-developed tools for migrating from your existing static site generator or content management system to Hugo. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +#tags: [migrations,jekyll,wordpress,drupal,ghost,contentful] +menu: + docs: + parent: "tools" + weight: 10 +weight: 10 +sections_weight: 10 +draft: false +aliases: [/developer-tools/migrations/,/developer-tools/migrated/] +toc: true +--- + +This section highlights some projects around Hugo that are independently developed. These tools try to extend the functionality of our static site generator or help you to get started. + +{{% note %}} +Do you know or maintain a similar project around Hugo? Feel free to open a [pull request](https://github.com/gohugoio/hugo/pulls) on GitHub if you think it should be added. +{{% /note %}} + +Take a look at this list of migration tools if you currently use other logging tools like Jekyll or WordPress but intend to switch to Hugo instead. They'll take care to export your content into Hugo-friendly formats. + +## Jekyll + +Alternatively, you can use the new [Jekyll import command](/commands/hugo_import_jekyll/). + +- [JekyllToHugo](https://github.com/SenjinDarashiva/JekyllToHugo) - A Small script for converting Jekyll blog posts to a Hugo site. +- [ConvertToHugo](https://github.com/coderzh/ConvertToHugo) - Convert your blog from Jekyll to Hugo. + +## Ghost + +- [ghostToHugo](https://github.com/jbarone/ghostToHugo) - Convert Ghost blog posts and export them to Hugo. + +## Octopress + +- [octohug](https://github.com/codebrane/octohug) - Octopress to Hugo migrator. + +## DokuWiki + +- [dokuwiki-to-hugo](https://github.com/wgroeneveld/dokuwiki-to-hugo) - Migrates your dokuwiki source pages from [DokuWiki syntax](https://www.dokuwiki.org/wiki:syntax) to Hugo Markdown syntax. Includes extra's like the TODO plugin. Written with extensibility in mind using python 3. Also generates a TOML header for each page. Designed to copypaste the wiki directory into your /content directory. + +## WordPress + +- [wordpress-to-hugo-exporter](https://github.com/SchumacherFM/wordpress-to-hugo-exporter) - A one-click WordPress plugin that converts all posts, pages, taxonomies, metadata, and settings to Markdown and YAML which can be dropped into Hugo. (Note: If you have trouble using this plugin, you can [export your site for Jekyll](https://wordpress.org/plugins/jekyll-exporter/) and use Hugo's built in Jekyll converter listed above.) + +## Tumblr + +- [tumblr-importr](https://github.com/carlmjohnson/tumblr-importr) - An importer that uses the Tumblr API to create a Hugo static site. +- [tumblr2hugomarkdown](https://github.com/Wysie/tumblr2hugomarkdown) - Export all your Tumblr content to Hugo Markdown files with preserved original formatting. +- [Tumblr to Hugo](https://github.com/jipiboily/tumblr-to-hugo) - A migration tool that converts each of your Tumblr posts to a content file with a proper title and path. Furthermore, "Tumblr to Hugo" creates a CSV file with the original URL and the new path on Hugo, to help you setup the redirections. + +## Drupal + +- [drupal2hugo](https://github.com/danapsimer/drupal2hugo) - Convert a Drupal site to Hugo. + +## Joomla + +- [hugojoomla](https://github.com/davetcc/hugojoomla) - This utility written in Java takes a Joomla database and converts all the content into Markdown files. It changes any URLs that are in Joomla's internal format and converts them to a suitable form. + +## Blogger + +- [blogimport](https://github.com/natefinch/blogimport) - A tool to import from Blogger posts to Hugo. + +## Contentful + +- [contentful2hugo](https://github.com/ArnoNuyts/contentful2hugo) - A tool to create content-files for Hugo from content on [Contentful](https://www.contentful.com/). diff --git a/content/tools/other.md b/content/tools/other.md new file mode 100644 index 000000000..5f3036a9c --- /dev/null +++ b/content/tools/other.md @@ -0,0 +1,28 @@ +--- +title: Other Hugo Community Projects +linktitle: Other Projects +description: Some interesting projects developed by the Hugo community that don't quite fit into our other developer tool categories. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [developer tools] +#tags: [frontend,gui] +menu: + docs: + parent: "tools" + weight: 70 +weight: 70 +sections_weight: 70 +draft: false +aliases: [] +toc: false +--- + +And for all the other small things around Hugo: + +* [hugo-gallery](https://github.com/icecreammatt/hugo-gallery) lets you create an image gallery for Hugo sites. +* [flickr-hugo-embed](https://github.com/nikhilm/flickr-hugo-embed) prints shortcodes to embed a set of images from an album on Flickr into Hugo. +* [hugo-openapispec-shortcode](https://github.com/tenfourty/hugo-openapispec-shortcode) A shortcode that allows you to include [Open API Spec](https://openapis.org) (formerly known as Swagger Spec) in a page. +* [HugoPhotoSwipe](https://github.com/GjjvdBurg/HugoPhotoSwipe) makes it easy to create image galleries using PhotoSwipe. +* [Hugo SFTP Upload](https://github.com/thomasmey/HugoSftpUpload) Syncs the local build of your Hugo website with your remote webserver via SFTP. +* [Emacs Easy Hugo](https://github.com/masasam/emacs-easy-hugo) Emacs package for writing blog posts in markdown or org-mode and building your site with Hugo. diff --git a/content/tools/search.md b/content/tools/search.md new file mode 100644 index 000000000..dac345a13 --- /dev/null +++ b/content/tools/search.md @@ -0,0 +1,29 @@ +--- +title: Search for your Hugo Website +linktitle: Search +description: See some of the open-source and commercial search options for your newly created Hugo website. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-26 +categories: [developer tools] +#tags: [search,tools] +menu: + docs: + parent: "tools" + weight: 60 +weight: 60 +sections_weight: 60 +draft: false +aliases: [] +toc: true +--- + +A static website with a dynamic search function? Yes. As alternatives to embeddable scripts from Google or other search engines, you can provide your visitors a custom search by indexing your content files directly. + +* [Hugoidx](https://github.com/blevesearch/hugoidx) is an experimental application to create a search index. It's built on top of [Bleve](http://www.blevesearch.com/). +* [GitHub Gist for Hugo Workflow](https://gist.github.com/sebz/efddfc8fdcb6b480f567). This gist contains a simple workflow to create a search index for your static website. It uses a simple Grunt script to index all your content files and [lunr.js](http://lunrjs.com/) to serve the search results. +* [hugo-lunr](https://www.npmjs.com/package/hugo-lunr). A simple way to add site search to your static Hugo site using [lunr.js](http://lunrjs.com/). Hugo-lunr will create an index file of any html and markdown documents in your Hugo project. + +## Commercial Search Services + +* [Algolia](https://www.algolia.com/)'s Search API makes it easy to deliver a great search experience in your apps and websites. Algolia Search provides hosted full-text, numerical, faceted, and geolocalized search. \ No newline at end of file diff --git a/content/tools/starter-kits.md b/content/tools/starter-kits.md new file mode 100644 index 000000000..5d43d4e4d --- /dev/null +++ b/content/tools/starter-kits.md @@ -0,0 +1,38 @@ +--- +title: Starter Kits +linktitle: Starter Kits +description: A list of community-developed projects designed to help you get up and running with Hugo. +date: 2017-02-22 +publishdate: 2017-02-01 +lastmod: 2017-02-22 +#tags: [starters,assets,pipeline] +menu: + docs: + parent: "tools" + weight: 30 +weight: 30 +sections_weight: 30 +draft: false +aliases: [/developer-tools/migrations/,/developer-tools/migrated/] +toc: false +--- + +Know of a Hugo-related starter kit that isn't mentioned here? [Please add it to the list.][addkit] + +{{% note "Starter Kits are Not Maintained by the Hugo Team"%}} +The following starter kits are developed by active members of the Hugo community. If you find yourself having issues with any of the projects, it's best to file an issue directly with the project's maintainer(s). +{{% /note %}} + +* [Victor Hugo][]. Victor Hugo is a Hugo boilerplate for creating truly epic websites using Gulp + Webpack as an asset pipeline. Victor Hugo uses post-css and Babel for CSS and JavaScript, respectively, and is actively maintained. +* [GOHUGO AMP][]. GoHugo AMP is a starter theme that aims to make it easy to adopt [Google's AMP Project][amp]. The starter kit comes with 40+ shortcodes and partials plus automatic structured data. The project also includes a [separate site with extensive documentation][gohugodocs]. +* [Blaupause][]. Blaupause is a developer-friendly Hugo starter kit based on Gulp tasks. It comes ES6-ready with several helpers for SVG and fonts and basic structure for HTML, SCSS, and JavaScript. +* [hugulp][]. hugulp is a tool to optimize the assets of a Hugo website. The main idea is to recreate the famous Ruby on Rails Asset Pipeline, which minifies, concatenates and fingerprints the assets used in your website. + + +[addkit]: https://github.com/gohugoio/hugo/edit/master/docs/content/tools/starter-kits.md +[amp]: https://www.ampproject.org/ +[Blaupause]: https://github.com/fspoettel/blaupause +[GOHUGO AMP]: https://github.com/wildhaber/gohugo-amp +[gohugodocs]: https://gohugo-amp.gohugohq.com/ +[hugulp]: https://github.com/jbrodriguez/hugulp +[Victor Hugo]: https://github.com/netlify/victor-hugo \ No newline at end of file diff --git a/content/tools/syntax-highlighting.md b/content/tools/syntax-highlighting.md new file mode 100644 index 000000000..ef32f7ee9 --- /dev/null +++ b/content/tools/syntax-highlighting.md @@ -0,0 +1,241 @@ +--- +title: Syntax Highlighting +linktitle: +description: Hugo provides server-side syntax highlighting via Pygments and, like most static site generators, works very well with client-side (JavaScript) syntax highlighting libraries as well. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +#tags: [highlighting,pygments,code blocks,syntax] +categories: [developer tools] +menu: + docs: + parent: "tools" + weight: 20 +weight: 20 +sections_weight: 20 +draft: false +aliases: [/extras/highlighting/,/extras/highlight/] +toc: true +--- + +Hugo can highlight source code in _two different ways_—either pre-processed server side from your content or to defer the processing to the client side, using a JavaScript library. + +## Server-side + +For the pre-processed approach, highlighting is performed by an external Python-based program called [Pygments](http://pygments.org/) and is triggered via an embedded Hugo shortcode (see [example](#example-highlight-shortcode-input) below). If Pygments is absent from the path, it will silently simply pass the content along without highlighting. + +### Server-side Advantages + +The advantages of server-side syntax highlighting are that it doesn’t depend on a JavaScript library and, consequently, works very well when read from an RSS feed. + +### Pygments + +If you have never worked with Pygments before, here is a brief primer: + ++ Install Python from [python.org](https://www.python.org/downloads/). Version 2.7.x is already sufficient. ++ Run `pip install Pygments` in order to install Pygments. Once installed, Pygments gives you a command `pygmentize`. Make sure it sits in your PATH; otherwise, Hugo will not be able to find and use it. + +On Debian and Ubuntu systems, you may also install Pygments by running `sudo apt-get install python3-pygments`. + +Hugo gives you two options that you can set with the variable `pygmentsuseclasses` (default `false`) in your [site configuration](/getting-started/configuration/). + +1. Color codes for highlighting keywords are directly inserted if `pygmentsuseclasses = false` (default). The color codes depend on your choice of the `pygmentsstyle` (default = `"monokai"`). You can explore the different color styles on [pygments.org](http://pygments.org/) after inserting some example code. +2. If you choose `pygmentsuseclasses = true`, Hugo includes class names in your code instead of color codes. For class-names to be meaningful, you need to include a `.css` file in your website representing your color scheme. You can either generate this `.css` files according to the [description from the Pygments documentation](http://pygments.org/docs/cmdline/) or download the one of the many pre-built color schemes from [Pygment's GitHub css repository](https://github.com/richleland/pygments-css). + +### Server-side Usage + +Highlighting is carried out via the [built-in shortcode](/content-management/shortcodes/) `highlight`. `highlight` takes exactly one required parameter for the programming language to be highlighted and requires a closing shortcode. Note that `highlight` is *not* used for client-side javascript highlighting. + +### Example `highlight` Shortcode Input + +{{% code file="example-highlight-shortcode-input.md" %}} +```html +{{}} +
    +
    +

    {{ .Title }}

    + {{ range .Data.Pages }} + {{ .Render "summary"}} + {{ end }} +
    +
    +{{}} +``` +{{% /code %}} + +### Example `highlight` Shortcode Output + +{{% output file="example-highlight-shortcode-output.html" %}} +``` +<section id="main"> + <div> + <h1 id="title">{{ .Title }}</h1> + {{ range .Data.Pages }} + {{ .Render "summary"}} + {{ end }} + </div> +</section> +``` +{{% /output %}} + +### Options + +Options for controlling highlighting can be added in the second argument as a quoted, comma-separated key-value list. The example below will syntax highlight in `go` with inline line numbers and line numbers 2 and 3 highlighted. + +``` +{{}} +var a string +var b string +var c string +var d string +{{}} +``` + +The `highlight` shortcode includes the following supported keywords: + +* `style` +* `encoding` +* `noclasses` +* `hl_lines` +* `linenos` + +Note that `style` and `noclasses` will override the similar setting in the [global config](/getting-started/configuration/). + +The keywords in the `highlight` shortcode mirror those of Pygments from the command line. See the [Pygments documentation](http://pygments.org/docs/) for more information. + +### Code Fences + +It is also possible to add syntax highlighting with GitHub flavored code fences. To enable this, set the `PygmentsCodeFences` to `true` in Hugo's [configuration file](/getting-started/configuration/); + +```` +```html +
    +
    +

    {{ .Title }}

    + {{ range .Data.Pages }} + {{ .Render "summary"}} + {{ end }} +
    +
    +``` +```` + +{{% note "Disclaimers on Pygments" %}} +* Pygments is relatively slow and _causes a performance hit when building your site_, but Hugo has been designed to cache the results to disk. +* The caching can be turned off by setting the `--ignoreCache` flag to `true`. +* The languages available for highlighting depend on your Pygments installation. +{{% /note %}} + +## Client-side + +Alternatively, code highlighting can be applied to your code blocks in client-side JavaScript. + +Client-side syntax highlighting is very simple to add. You'll need to pick +a library and a corresponding theme. Some popular libraries are: + +- [Highlight.js] +- [Prism] +- [Rainbow] +- [Syntax Highlighter] +- [Google Prettify] + +### Client-side Advantages + +The advantages of client-side syntax highlighting are that it doesn’t cost anything when building your site, and some of the highlighting scripts available cover more languages than Pygments does. + +### Highlight.js Example + +This example uses the popular [Highlight.js] library, hosted by [Yandex], a popular Russian search engine. + +In your `./layouts/partials/` (or `./layouts/chrome/`) folder, depending on your specific theme, there will be a snippet that will be included in every generated HTML page, such as `header.html` or `header.includes.html`. Simply add the css and js to initialize [Highlight.js]: + +``` + + + +``` + +### Prism example + +Prism is another popular highlighter library and is used on some major sites. +The [download section of the prism.js website][prismdownload] is simple to use and affords you a high degree of customization to pick only the languages you'll be using on your site. + +Similar to Highlight.js, you simply load `prism.css` in your `` via whatever Hugo partial template is creating that part of your pages: + +```html +... + +... +``` + +Add `prism.js` near the bottom of your `` tag in whatever Hugo partial template is appropriate for your site or theme. + +```html +... + + +``` + +In this example, the local paths indicate that your downloaded copy of these files are being added to the site, typically under `./static/css/` and `./static/js/`, respectively. + +### Client-side Usage + +To use client-side highlighting, most of these javascript libraries expect your code to be wrapped in semantically correct `` elements with language-specific class attributes. For example, a code block for HTML would have `class="language-html"`. + +The client-side highlighting script therefore looks for programming language classes according to this convention: `language-go`, `language-html`, `language-css`, `language-bash`, etc. If you look at the page's source, you might see something like the following: + +```html +
    +  
+  body {
+    font-family: "Noto Sans", sans-serif;
+  }
+  
+
    +``` + +If you are using markdown, your content pages needs to use the following syntax, with the name of the language to be highlighted entered directly after the first "fence." A fenced code block can be noted by opening and closing triple tilde ~ or triple back ticks `: + +{{< nohighlight >}} +~~~css +body { + font-family: "Noto Sans", sans-serif; +} +~~~ +{{< /nohighlight >}} + +Here is the same example but with triple back ticks to denote the fenced code block: + +{{< nohighlight >}} +```css +body { + font-family: "Noto Sans", sans-serif; +} +``` +{{< /nohighlight >}} + +Passing the above examples through the highlighter script would yield the following markup: + +{{< nohighlight >}} +<pre><code class="language-css hljs">;<span class="hljs-selector-tag">body</span> { + <span class="hljs-attribute">font-family</span>: <span class="hljs-string">"Noto Sans"</span>, sans-serif; +} +{{< /nohighlight >}} + +In the case of the coding color scheme used by the Hugo docs, the resulting output would then look like the following to the website's end users: + +```css +body { + font-family: "Noto Sans", sans-serif; +} +``` + +Please see individual libraries' documentation for how to implement each of the JavaScript-based libraries. + +[Prism]: http://prismjs.com +[prismdownload]: http://prismjs.com/download.html +[Highlight.js]: http://highlightjs.org/ +[Rainbow]: http://craig.is/making/rainbows +[Syntax Highlighter]: http://alexgorbatchev.com/SyntaxHighlighter/ +[Google Prettify]: https://github.com/google/code-prettify +[Yandex]: http://yandex.ru/ \ No newline at end of file diff --git a/content/troubleshooting/_index.md b/content/troubleshooting/_index.md new file mode 100644 index 000000000..614ea209a --- /dev/null +++ b/content/troubleshooting/_index.md @@ -0,0 +1,26 @@ +--- +title: Troubleshooting +linktitle: Troubleshooting +description: Frequently asked questions and known issues pulled from the Hugo Discuss forum. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +menu: + docs: + parent: "troubleshooting" + weight: 01 +weight: 01 #rem +draft: false +hidesectioncontents: false +slug: +aliases: [/troubleshooting/faqs/,/faqs/] +toc: false +notesforauthors: +--- + +The Troubleshooting section includes known issues, recent workarounds, and FAQs pulled from the [Hugo Discussion Forum][forum]. + + + + +[forum]: https://discourse.gohugo.io diff --git a/content/troubleshooting/accented-characters-in-urls.md b/content/troubleshooting/accented-characters-in-urls.md new file mode 100644 index 000000000..1b2340ee2 --- /dev/null +++ b/content/troubleshooting/accented-characters-in-urls.md @@ -0,0 +1,60 @@ +--- +title: Accented Characters in URLs +linktitle: Accented Characters in URLs +description: If you're having trouble with special characters in your taxonomies or titles adding odd characters to your URLs. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +#tags: [urls,multilingual,special characters] +categories: [troubleshooting] +menu: + docs: + parent: "troubleshooting" +weight: +draft: false +slug: +aliases: [/troubleshooting/categories-with-accented-characters/] +toc: true +--- + +## Trouble: Categories with accented characters + +> One of my categories is named "Le-carré," but the link ends up being generated like this: +> +> ```bash +> categories/le-carr%C3%A9 +> ``` +> +> And not working. Is there an easy fix for this that I'm overlooking? + +## Solution + +Are you a macOS user? If so, you are likely a victim of HFS Plus file system's insistence to store the "é" (U+00E9) character in Normal Form Decomposed (NFD) mode, i.e. as "e" + " ́" (U+0065 U+0301). + +`le-carr%C3%A9` is actually correct, `%C3%A9` being the UTF-8 version of U+00E9 as expected by the web server. The problem is that OS X turns [U+00E9] into [U+0065 U+0301], and thus `le-carr%C3%A9` no longer works. Instead, only `le-carre%CC%81` ending with `e%CC%81` would match that [U+0065 U+0301] at the end. + +This is unique to OS X. The rest of the world does not do this, and most certainly not your web server which is most likely running Linux. This is not a Hugo-specific problem either. Other people have been bitten by this when they have accented characters in their HTML files. + +Note that this problem is not specific to Latin scripts. Japanese Mac users often run into the same issue; e.g., with `だ` decomposing into `た` and `゙`. (Read the [Japanese Perl users article][]). + +Rsync 3.x to the rescue! From [an answer posted on Server Fault][]: + +> You can use rsync's `--iconv` option to convert between UTF-8 NFC & NFD, at least if you're on a Mac. There is a special `utf-8-mac` character set that stands for UTF-8 NFD. So to copy files from your Mac to your web server, you'd need to run something like: +> +> `rsync -a --iconv=utf-8-mac,utf-8 localdir/ mywebserver:remotedir/` +> +> This will convert all the local filenames from UTF-8 NFD to UTF-8 NFC on the remote server. The files' contents won't be affected. - [Server Fault][] + +Please make sure you have the latest version of rsync 3.x installed. The rsync that ships with OS X is outdated. Even the version that comes packaged with 10.10 (Yosemite) is version 2.6.9 protocol version 29. The `--iconv` flag is new in rsync 3.x. + +### Discussion Forum References + +* http://discourse.gohugo.io/t/categories-with-accented-characters/505 +* http://wiki.apache.org/subversion/NonNormalizingUnicodeCompositionAwareness +* https://en.wikipedia.org/wiki/Unicode_equivalence#Example +* http://zaiste.net/2012/07/brand_new_rsync_for_osx/ +* https://gogo244.wordpress.com/2014/09/17/drived-me-crazy-convert-utf-8-mac-to-utf-8/ + +[an Answer posted on Server Fault]: http://serverfault.com/questions/397420/converting-utf-8-nfd-filenames-to-utf-8-nfc-in-either-rsync-or-afpd "Converting UTF-8 NFD filenames to UTF-8 NFC in either rsync or afpd, Server Fault Discussion" +[Japanese Perl users article]: http://perl-users.jp/articles/advent-calendar/2010/english/24 "Encode::UTF8Mac makes you happy while handling file names on MacOSX" +[Server Fault]: http://serverfault.com/questions/397420/converting-utf-8-nfd-filenames-to-utf-8-nfc-in-either-rsync-or-afpd "Converting UTF-8 NFD filenames to UTF-8 NFC in either rsync or afpd, Server Fault Discussion" diff --git a/content/troubleshooting/build-performance.md b/content/troubleshooting/build-performance.md new file mode 100644 index 000000000..89225cbc5 --- /dev/null +++ b/content/troubleshooting/build-performance.md @@ -0,0 +1,23 @@ +--- +title: Build Performance +linktitle: Build Performance +description: +date: 2017-03-12 +publishdate: 2017-03-12 +lastmod: 2017-03-12 +#tags: [performance, build] +categories: [troubleshooting] +menu: + docs: + parent: "troubleshooting" +weight: +draft: true +slug: +aliases: [] +toc: true +wip: true +--- + + + + diff --git a/content/troubleshooting/categories-with-accented-characters.md b/content/troubleshooting/categories-with-accented-characters.md deleted file mode 100644 index 3a6dba82d..000000000 --- a/content/troubleshooting/categories-with-accented-characters.md +++ /dev/null @@ -1,50 +0,0 @@ ---- -lastmod: 2015-01-08 -date: 2015-01-08T16:32:00-07:00 -menu: - main: - parent: troubleshooting -title: Accented Categories -weight: 10 ---- - -## Trouble: Categories with accented characters - -One of my categories is named "Le-carré," but the link ends up being generated like this: - - categories/le-carr%C3%A9 - -And not working. Is there an easy fix for this that I'm overlooking? - - -## Solution - -Mac OS X user? If so, you are likely a victim of HFS Plus file system's insistence to store the "é" (U+00E9) character in Normal Form Decomposed (NFD) mode, i.e. as "e" + " ́" (U+0065 U+0301). - -`le-carr%C3%A9` is actually correct, `%C3%A9` being the UTF-8 version of U+00E9 as expected by the web server. Problem is, OS X turns [U+00E9] into [U+0065 U+0301], and thus `le-carr%C3%A9` no longer works. Instead, only `le-carre%CC%81` ending with `e%CC%81` would match that [U+0065 U+0301] at the end. - -This is unique to OS X. The rest of the world does not do this, and most certainly not your web server which is most likely running Linux. This is not a Hugo-specific problem either. Other people have been bitten by this when they have accented characters in their HTML files. - -Nor is this problem specific to Latin scripts. Japanese Mac users often run into the same issue, e.g. with `だ` decomposing into `た` and ゙.[^1] - -Rsync 3.x to the rescue! From [an answer posted on Server Fault](http://serverfault.com/questions/397420/converting-utf-8-nfd-filenames-to-utf-8-nfc-in-either-rsync-or-afpd): - -> You can use rsync's `--iconv` option to convert between UTF-8 NFC & NFD, at least if you're on a Mac. There is a special `utf-8-mac` character set that stands for UTF-8 NFD. So to copy files from your Mac to your web server, you'd need to run something like: -> -> `rsync -a --iconv=utf-8-mac,utf-8 localdir/ mywebserver:remotedir/` -> -> This will convert all the local filenames from UTF-8 NFD to UTF-8 NFC on the remote server. The files' contents won't be affected. - -Please make sure you have the latest version rsync 3.x installed. The rsync that ships with OS X (even the latest 10.10 Yosemite) is the horribly old at version 2.6.9 protocol version 29. The `--iconv` flag is new in rsync 3.x. - -### References - -* https://discourse.gohugo.io/t/categories-with-accented-characters/505 -* [Converting UTF-8 NFD filenames to UTF-8 NFC, in either rsync or afpd](http://serverfault.com/questions/397420/converting-utf-8-nfd-filenames-to-utf-8-nfc-in-either-rsync-or-afpd) (Server Fault) -* http://wiki.apache.org/subversion/NonNormalizingUnicodeCompositionAwareness -* https://en.wikipedia.org/wiki/Unicode_equivalence#Example -* http://zaiste.net/2012/07/brand_new_rsync_for_osx/ -* https://gogo244.wordpress.com/2014/09/17/drived-me-crazy-convert-utf-8-mac-to-utf-8/ - - -[^1]: As explained in the Japanese Perl Users article [Encode::UTF8Mac makes you happy while handling file names on MacOSX](http://perl-users.jp/articles/advent-calendar/2010/english/24). diff --git a/content/troubleshooting/eof-error.md b/content/troubleshooting/eof-error.md new file mode 100644 index 000000000..6e715cde7 --- /dev/null +++ b/content/troubleshooting/eof-error.md @@ -0,0 +1,49 @@ +--- +title: EOF Error +linktitle: EOF Error +description: If you find yourself seeing an EOF error in the console whenever you create a new content file from Hugo's archetype feature. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [troubleshooting] +menu: + docs: + parent: "troubleshooting" +#tags: [eof, end of file, error, faqs] +draft: false +weight: +aliases: [/troubleshooting/strange-eof-error/] +toc: true +--- + +## Trouble: `hugo new` Aborts with EOF error + +> I'm running into an issue where I cannot get archetypes working, when running `hugo new showcase/test.md`, for example, I see an `EOF` error thrown by Hugo. +> +> When I run Hugo with v0.12 via `hugo new -v showcase/test.md`, I see the following output: +> +> ```bash +> INFO: 2015/01/04 Using config file: /private/tmp/test/config.toml +> INFO: 2015/01/04 attempting to create showcase/test.md of showcase +> INFO: 2015/01/04 curpath: /private/tmp/test/archetypes/showcase.md +> ERROR: 2015/01/04 EOF +> ``` +> +> Is there something that I am blatantly missing? + +## Solution: Carriage Returns + +The solution is to add a final newline (i.e., `EOL`) to the end of your default.md archetype file of your theme. You can do this by adding a carriage return after the closing `+++` or `---` of your TOML or YAML front matter, respectively. + +{{% note "Final EOL Unnecessary in v0.13+" %}} +As of v0.13, Hugo's parser has been enhanced to accommodate archetype files without final EOL thanks to the great work by [@tatsushid](https://github.com/tatsushid). +{{% /note %}} + +## Discussion Forum References + +* http://discourse.gohugo.io/t/archetypes-not-properly-working-in-0-12/544 +* http://discourse.gohugo.io/t/eol-f-in-archetype-files/554 + +## Related Hugo Issues + +* https://github.com/gohugoio/hugo/issues/776 diff --git a/content/troubleshooting/overview.md b/content/troubleshooting/overview.md deleted file mode 100644 index 5f5ec19dc..000000000 --- a/content/troubleshooting/overview.md +++ /dev/null @@ -1,36 +0,0 @@ ---- -lastmod: 2015-01-27 -date: 2015-01-18T02:41:52-07:00 -menu: - main: - parent: troubleshooting -title: Troubleshooting Overview -weight: 0 ---- - -Got stuck? Worry not! Chances are other users have encountered -the exact same problem as you have, brought it up for -[discussion](https://discourse.gohugo.io/), and have likely found a solution -through the collective wisdom of our vibrant Hugo community! - -Here are some examples: - -* [`hugo new` aborts with cryptic EOF error](/troubleshooting/strange-eof-error/) (affects v0.12 and lower) -* [Categories with accented characters inaccessible](/troubleshooting/categories-with-accented-characters/) (affects Mac OS X users) -* [My CSS files aren't loaded!](https://discourse.gohugo.io/t/deployment-workflow/90/15) -* [How do I include an image gallery on my website?](https://discourse.gohugo.io/t/image-gallery/594) -* ... And a lot more! - -{{% youtube c8fJIRNChmU %}} - -Indeed, you may find many questions and solutions -to problems in our [discussion forum](https://discourse.gohugo.io/), -and you may find the [support](https://discourse.gohugo.io/category/support) -and [tips & tricks](https://discourse.gohugo.io/category/tips-tricks) -categories particularly helpful. - -Can't find anything? Please write on the forum and post your questions -and comments! Sometimes, your feedback may lead to the discovery of -existing bugs in the code or in the documentation, and may even spur -the interest of adding new features to the next Hugo version, improving -Hugo for everybody! (Thank you!) See you on the forum! diff --git a/content/troubleshooting/strange-eof-error.md b/content/troubleshooting/strange-eof-error.md deleted file mode 100644 index 559b1e7d2..000000000 --- a/content/troubleshooting/strange-eof-error.md +++ /dev/null @@ -1,43 +0,0 @@ ---- -lastmod: 2015-01-17 -date: 2015-01-08T16:11:23-07:00 -menu: - main: - parent: troubleshooting -title: Strange EOF error -weight: 5 ---- - -## Trouble: `hugo new` aborts with cryptic EOF error - -> I'm running into an issue where I cannot get archetypes working, when running `hugo new showcase/test.md`, for example, I see an `EOF` error thrown by Hugo. -> -> I have set up this test repository to show exactly what I've done, but it is essentially a vanilla installation of Hugo. https://github.com/polds/hugo-archetypes-test -> -> When in that repository, using Hugo v0.12 to run `hugo new -v showcase/test.md`, I see the following output: -> -> INFO: 2015/01/04 Using config file: /private/tmp/test/config.toml -> INFO: 2015/01/04 attempting to create showcase/test.md of showcase -> INFO: 2015/01/04 curpath: /private/tmp/test/archetypes/showcase.md -> ERROR: 2015/01/04 EOF -> -> Is there something that I am blatantly missing? - -## Solution - -Thank you for reporting this issue. The solution is to add a final newline (i.e. EOL) to the end of your default.md archetype file of your theme. More discussions happened on the forum here: - -* https://discourse.gohugo.io/t/archetypes-not-properly-working-in-0-12/544 -* https://discourse.gohugo.io/t/eol-f-in-archetype-files/554 - -Due to popular demand, Hugo's parser has been enhanced to -accommodate archetype files without final EOL, -thanks to the great work by [@tatsushid](https://github.com/tatsushid), -in the upcoming v0.13 release, - -Until then, for us running the stable v0.12 release, please remember to add the final EOL diligently. - -## References - -* https://github.com/gohugoio/hugo/issues/776 - diff --git a/content/tutorials/automated-deployments.md b/content/tutorials/automated-deployments.md deleted file mode 100644 index 9f6d5c628..000000000 --- a/content/tutorials/automated-deployments.md +++ /dev/null @@ -1,275 +0,0 @@ ---- -authors: -- Arjen Schwarz -- Samuel Debruyn -lastmod: 2017-02-26 -date: 2015-01-12 -linktitle: Automated deployments -toc: true -menu: - main: - parent: tutorials -next: /tutorials/creating-a-new-theme -prev: /community/contributing -title: Automated deployments with Wercker -weight: 10 ---- - -# Automated deployments with Wercker - -In this tutorial we will set up a basic Hugo project and then configure a free tool called Wercker to automatically deploy the generated site any time we add an article. We will deploy it to GitHub pages as that is easiest to set up, but you will see that we can use anything. This tutorial takes you through every step of the process, complete with screenshots and is fairly long. - -The assumptions made for this tutorial are that you know how to use git for version control, and have a GitHub account. In case you are unfamiliar with these, in their [help section](https://help.github.com/articles/set-up-git/) GitHub has an explanation of how to install and use git and you can easily sign up for a free GitHub account as well. - -## Creating a basic Hugo site - -There are already [pages](http://gohugo.io/overview/quickstart/) dedicated to describing how to set up a Hugo site so we will only go through the most basic steps required to get a site up and running before we dive into the Wercker configuration. All the work for setting up the project is done using the command line, and kept as simple as possible. - -Create the new site using the `hugo new site` command, and we move into it. - -```bash -hugo new site hugo-wercker-example -cd hugo-wercker-example -``` - -Add the herring-cove theme by cloning it into the theme directory using the following commands. - -```bash -mkdir themes -cd themes -git clone https://github.com/spf13/herring-cove.git -``` - -Cloning the project like this will conflict with our own version control, so we remove the external git configuration. - -```bash -rm -rf herring-cove/.git -``` - -Let's add a quick **about** page. - -```bash -hugo new about.md -``` - -Now we'll edit contents/about.md to ensure it's no longer a draft and add some text to it. - -```bash -hugo undraft content/about.md -``` - -Once completed it's a good idea to do a quick check if everything is working by running - -```bash -hugo server --theme=herring-cove -``` - -If everything is fine, you should be able to see something similar to the image below when you go to localhost:1313 in your browser. - -![][1] - -[1]: /img/tutorials/automated-deployments/creating-a-basic-hugo-site.png - -## Setting up version control - -Adding git to our project is done by running the `git init` command from the root directory of the project. - -```bash -git init -``` - -Running `git status` at this point will show you p entries: the **config.toml** file, the **themes** directory, the **contents** directory, and the **public** directory. We don't want the **public** directory version controlled however, as we will use wercker to generate that later on. Therefore, we'll add a gitignore file that will exclude this using the following command. - -```bash -echo "/public" >> .gitignore -``` - -As we currently have no static files outside of the theme directory, Wercker might complain when we try to build the site later on. To prevent this, we simply have to add any file to the static folder. To keep it simple for now we'll add a robots.txt file that will give all search engines full access to the site when it's up. - -```bash -echo "User-agent: *\nDisallow:" > static/robots.txt -``` - -After this we can add everything to the repository. - -```bash -git commit -a -m "Initial commit" -``` - -## Adding the project to GitHub - -First we'll create a new repository. You can do this by clicking on the **+** sign at the top right, or by going to https://github.com/new - -We then choose a name for the project (**hugo-wercker-example**). When clicking on create repository GitHub displays the commands for adding an existing project to the site. The commands shown below are the ones used for this site, if you're following along you will need to use the ones shown by GitHub. Once we've run those commands the project is in GitHub and we can move on to setting up the Wercker configuration. - -```bash -git remote add origin git@github.com:YourUsername/hugo-wercker-example.git -git push -u origin master -``` - -![][2] - -[2]: /img/tutorials/automated-deployments/adding-the-project-to-github.png - -## Welcome to wercker - -Let's start by setting up an account for Wercker. To do so we'll go to http://wercker.com and click on the **Sign up** button. - -![][3] - -[3]: /img/tutorials/automated-deployments/wercker-sign-up.png - -## Register - -To make life easier for ourselves, we will then register using GitHub. If you don't have a GitHub account, or don't want to use it for your account, you can of course register with a username and password as well. - -![][4] - -[4]: /img/tutorials/automated-deployments/wercker-sign-up-page.png - -## Connect GitHub/Bitbucket - -After you are registered, you will need to link your GitHub and/or Bitbucket account to Wercker. You do this by going to your profile settings, and then "Git connections" If you registered using GitHub it will most likely look like the image below. To connect a missing service, simply click on the connect button which will then send you to either GitHub or Bitbucket where you might need to log in and approve their access to your account. - -![][5] - -[5]: /img/tutorials/automated-deployments/wercker-git-connections.png - -## Add your project - -Now that we've got all the preliminaries out of the way, it's time to set up our application. For this we click on the **+ Create** button next to Applications. Create a new application, and choose to use GitHub. - -![][6] - -[6]: /img/tutorials/automated-deployments/wercker-add-app.png - -## Select a repository - -Clicking this will make Wercker show you all the repositories you have on GitHub, but you can easily filter them as well. So we search for our repository, select it, and then click on "Use selected repo". - -![][7] - -[7]: /img/tutorials/automated-deployments/wercker-select-repository.png - -## Configure access - -As Wercker doesn't access to check out your private projects by default, it will ask you what you want to do. When your project is public, as needs to be the case if you wish to use GitHub Pages, the top choice is recommended. When you use this it will simply check out the code in the same way anybody visiting the project on GitHub can do. - -![][8] - -[8]: /img/tutorials/automated-deployments/wercker-access.png - -## Public or not - -This is a personal choice; you can make an app public so that everyone can see more details about it. This doesn't give you any real benefits either way in general, although as part of the tutorial I have of course made this app public so you can see it in action [yourself](https://app.wercker.com/#applications/5586dcbdaf7de9c51b02b0d5). - -![][9] - -[9]: /img/tutorials/automated-deployments/public-or-not.png - -## Wercker.yml - -Choose Default for your programming language. Wercker will now attempt to create an initial *wercker.yml* file for you. Or rather, it will create the code you can copy into it yourself. Because there is nothing special about our project according to Wercker, we will simply get the `debian` box. So what we do now is create a *wercker.yml* file in the local root of our project that contains the provided configuration, and after we finish setting up the app we will expand this file to make it actually do something. - -![][10] - -[10]: /img/tutorials/automated-deployments/werckeryml.png - -## And we've got an app - -The application is added now, and Wercker will be offering you the chance to trigger a build. As we haven't pushed up the **wercker.yml** file however, we will politely decline this option. Wercker has automatically added a build pipeline to your application. - -## Adding build step - -And now we're going to add the build step to the build pipeline. First, we go to the "Registry" action in the top menu and then search for "hugo build". Find the **Hugo-Build** task by Arjen and select it. - -![][11] - -[11]: /img/tutorials/automated-deployments/wercker-search.png - -## Using Hugo-Build - -Inside the details of this step you will see how to use it. At the top is a summary for very basic usage, but when scrolling down you go through the README of the step which will usually contain more details about the advanced options available and a full example of using the step. - -We're not going to use any of the advanced features in this tutorial, so we'll return to our project and add the details we need to our wercker.yml file so that it looks like below: - -```yaml -box: debian -build: - steps: - - install-packages: - packages: git - - script: - name: download theme - code: | - $(git clone https://github.com/spf13/herring-cove ./themes/herring-cove) - - arjen/hugo-build: - version: "0.14" - theme: herring-cove - flags: --buildDrafts=true -``` - -As you can see, we have two steps in the build pipeline. The first step downloads the theme, and the second step runs arjen's hugo-build step. To use a different theme, you can replace the link to the herring-cove source with another theme's repository - just make sure the name of the folder you download the theme to (./themes/your-theme-name) matches the theme name you tell arjen/hugo-build to use (theme: your-theme-name). Now we'll test that it all works as it should by pushing up our wercker.yml file to GitHub and seeing the magic at work. - -```bash -git commit -a -m "Add wercker.yml" -git push origin master -``` - -Once completed a nice tick should have appeared in front of your first build, and if you want you can look at the details by clicking on it. However, we're not done yet as we still need to deploy it to GitHub Pages. - -![][12] - -[12]: /img/tutorials/automated-deployments/using-hugo-build.png - -## Adding a deploy pipeline - -In order to deploy to GitHub Pages we need to add a deploy pipeline. - -1. First, go to your Wercker application's page. Go to the "Workflows" tab and click on "Add new pipeline." Name it whatever you want; "deploy-production" or "deploy" works fine. For your YML Pipeline name, type in "deploy" without quotes. Leave the hook type as "Default" and hit the Create button. - -2. Now you need to link the deploy pipeline to your build pipeline. In the workflow editor, click on the + next to your build pipeline and add the deploy pipeline you've just made. Now the deploy pipeline will be run automatically whenever the build pipeline is completed successfully. - -![][13] - -[13]: /img/tutorials/automated-deployments/adding-a-deploy-pipeline.png - -## Adding a deploy step - -Next, we need to add a step to our deploy pipeline that will deploy the Hugo-built website to your GitHub pages repository. Once again searching through the Steps registry, we find that the most popular step is the **lukevevier/gh-pages** step so we add the configuration for that to our wercker.yml file. Additionally, we need to ensure that the box we run on has git and ssh installed. We can do this using the **install-packages** command, which then turns the wercker.yml file into this: - -```yaml -box: debian -build: - steps: - - arjen/hugo-build: - version: "0.14" - theme: herring-cove - flags: --buildDrafts=true -deploy: - steps: - - install-packages: - packages: git ssh-client - - lukevivier/gh-pages@0.2.1: - token: $GIT_TOKEN - domain: hugo-wercker.ig.nore.me - basedir: public -``` - -How does the GitHub Pages configuration work? We've selected a couple of things, first the domain we want to use for the site. Configuring this here will ensure that GitHub Pages is aware of the domain you want to use. - -Secondly we've configured the basedir to **public**, this is the directory that will be used as the website on GitHub Pages. - -And lastly, you can see here that this has a **$GIT_TOKEN** variable. This is used for pushing our changes up to GitHub and we will need to configure this before we can do that. To do this, go to your application page and click on the "Environment" tab. Under Application Environment Variables, put **$GIT_TOKEN** for the Key. Now you'll need to create an access token in GitHub. How to do that is described on a [GitHub help page](https://help.github.com/articles/creating-an-access-token-for-command-line-use/). Copy and paste the access token you generated from GitHub into the Value box. **Make sure you check Protected** and then hit Add. - -![][14] - -[14]: /img/tutorials/automated-deployments/adding-a-deploy-step.png - -With the deploy step configured in Wercker, we can push the updated wercker.yml file to GitHub and it will create the GitHub pages site for us. The example site we used here is accessible under hugo-wercker.ig.nore.me - -## Conclusion - -From now on, any time you want to put a new post on your blog all you need to do is push your new page to GitHub and the rest will happen automatically. The source code for the example site used here is available on [GitHub](https://github.com/ArjenSchwarz/hugo-wercker-example), as is the [Hugo Build step](https://github.com/ArjenSchwarz/wercker-step-hugo-build) itself. - -If you want to see an example of how you can deploy to S3 instead of GitHub pages, take a look at [Wercker's documentation](http://devcenter.wercker.com/docs/deploy/s3.html) about how to set that up. diff --git a/content/tutorials/create-a-multilingual-site.md b/content/tutorials/create-a-multilingual-site.md deleted file mode 100644 index 8a2dd960e..000000000 --- a/content/tutorials/create-a-multilingual-site.md +++ /dev/null @@ -1,168 +0,0 @@ ---- -author: "Rick Cogley" -lastmod: 2015-12-24 -date: 2015-07-08 -linktitle: Multilingual Site -menu: - main: - parent: tutorials -prev: /tutorials/migrate-from-jekyll -title: Create a Multilingual Site -weight: 10 ---- - -> **Note:** Since v0.17 Hugo has built-in support for the creation of multilingual website. [Read more about it]({{< relref "content/multilingual.md" >}}). - -## Introduction - -Hugo allows you to create a multilingual site from its built-in tools. This tutorial will show one way to do it, and assumes: - -* You already know the basics about creating a Hugo site -* You have a separate domain name for each language -* You'll use `/data` files for some translation strings -* You'll use single, combined `layout` and `static` folders -* You'll use a subfolder for each language under `content` and `public` - -## Site Configs - -Create your site configs in the root of your repository, for example for an English and Japanese site. - -**English Config `config_en.toml`**: - -~~~toml -baseURL = "http://acme.com/" -title = "Acme Inc." -contentDir = "content/en" -publishDir = "public/en" - -[params] - locale = "en-US" -~~~ - -**Japanese Config `config_ja.toml`**: - -~~~toml -baseURL = "http://acme.jp/" -title = "有限会社アクミー" -contentDir = "content/ja" -publishDir = "public/ja" - -[params] - locale = "ja-JP" -~~~ - -If you had more domains and languages, you would just create more config files. The standard `config.toml` is what Hugo will run as a default, but since we're creating language-specific ones, you'll need to specify each config file when running `hugo server` or just `hugo` before deploying. - -## Prep Translation Strings in `/data` - -Create `.yaml` (or `.json` or `.toml`) files for each language, under `/data/translations`. - -**English Strings `en-US.yaml`**: - -~~~yaml -topSlogan: Acme Inc. -topSubslogan: You'll love us -... -~~~ - -**Japanese Strings `ja-JP.yaml`**: - -~~~yaml -topSlogan: 有限会社アクミー -topSubslogan: キット勝つぞ -... -~~~ - -In some cases, where there is more complex formatting within the strings you want to show, it might be better to employ some conditional logic in your template, to display a block of html per language. - -## Reference Strings in templates - -Now you can reference the strings in your templates. One way is to do it like in this `layouts/index.html`, leveraging the fact that you have the locale set: - -~~~html - - -... - - - {{ if eq .Site.Params.locale "en-US" }}{{ if .IsHome }}Welcome to {{ end }}{{ end }}{{ .Title }}{{ if eq .Site.Params.locale "ja-JP" }}{{ if .IsHome }}へようこそ{{ end }}{{ end }}{{ if ne .Title .Site.Title }} : {{ .Site.Title }}{{ end }} - ... - - -
    -

    {{ ( index $.Site.Data.translations $.Site.Params.locale ).topSlogan }}

    -

    {{ ( index $.Site.Data.translations $.Site.Params.locale ).topSubslogan }}

    -
    - - -~~~ - -The above shows both techniques, using an `if eq` and `else if eq` to check the locale, and using `index` to pull strings from the data file that matches the locale set in the site's config file. - -## Customize Dates - -At the time of this writing, Golang does not yet have support for internationalized locales, but if you do some work, you can simulate it. For example, if you want to use French month names, you can add a data file like ``data/mois.yaml`` with this content: - -~~~toml -1: "janvier" -2: "février" -3: "mars" -4: "avril" -5: "mai" -6: "juin" -7: "juillet" -8: "août" -9: "septembre" -10: "octobre" -11: "novembre" -12: "décembre" -~~~ - -... then index the non-English date names in your templates like so: - -~~~html - -~~~ - -This technique extracts the day, month and year by specifying ``.Date.Day``, ``.Date.Month``, and ``.Date.Year``, and uses the month number as a key, when indexing the month name data file. - -## Create Multilingual Content - -Now you can create markdown content in your languages, in the `content/en` and `content/ja` folders. The frontmatter stays the same on the key side, but the values would be set in each of the languages. - -## Run Hugo Server or Deploy Commands - -Once you have things set up, you can run `hugo server` or `hugo` before deploying. You can create scripts to do it, or as shell functions. Here are sample basic `zsh` functions: - -**Live Reload with `hugo server`**: - -~~~shell -function hugoserver-com { - cd /Users/me/dev/mainsite - hugo server --buildDrafts --verbose --source="/Users/me/dev/mainsite" --config="/Users/me/dev/mainsite/config_en.toml" --port=1377 -} -function hugoserver-jp { - cd /Users/me/dev/mainsite - hugo server --buildDrafts --verbose --source="/Users/me/dev/mainsite" --config="/Users/me/dev/mainsite/config_ja.toml" --port=1399 -} -~~~ - -**Deploy with `hugo` and `rsync`**: - -~~~shell -function hugodeploy-acmecom { - rm -rf /tmp/acme.com - hugo --config="/Users/me/dev/mainsite/config_en.toml" -s /Users/me/dev/mainsite/ -d /tmp/acme.com - rsync -avze "ssh -p 22" --delete /tmp/acme.com/ me@mywebhost.com:/home/me/webapps/acme_com_site -} - -function hugodeploy-acmejp { - rm -rf /tmp/acme.jp - hugo --config="/Users/me/dev/mainsite/config_ja.toml" -s /Users/me/dev/mainsite/ -d /tmp/acme.jp - rsync -avze "ssh -p 22" --delete /tmp/acme.jp/ me@mywebhost.com:/home/me/webapps/acme_jp_site -} -~~~ - -Adjust to fit your situation, setting dns, your webserver config, and other settings as appropriate. diff --git a/content/tutorials/creating-a-new-theme.md b/content/tutorials/creating-a-new-theme.md deleted file mode 100644 index a0b95b5e6..000000000 --- a/content/tutorials/creating-a-new-theme.md +++ /dev/null @@ -1,1717 +0,0 @@ ---- -author: "Michael Henderson" -lastmod: 2016-09-01 -date: 2015-11-26 -linktitle: Creating a New Theme -menu: - main: - parent: tutorials -next: /tutorials/github-pages-blog -prev: /tutorials/automated-deployments -title: Creating a New Theme -weight: 10 ---- -## Introduction - -This tutorial will show you how to create a simple theme in Hugo. - -I'll introduce Hugo's use of templates, -and explain how to organize them into a theme. -The theme will grow, minimizing effort while meeting evolving needs. -To promote this focus, and to keep everything simple, I'll omit CSS styling. - -We'll start by creating a tiny, blog-like web site. -We'll implement this blog with just one — quite basic — template. -Then we'll add an About page, and a few articles. -Overall, this web site (along with what you learn here) -will provide a good basis for you to continue working with Hugo in the future. -By making small variations, -you'll be able to create many different kinds of web sites. - -I will assume you're comfortable with HTML, Markdown formatting, -and the Bash command line (possibly using [Git for -Windows](https://git-for-windows.github.io/)). - -A few symbols might call for explanation: in this tutorial, -the commands you'll enter will be preceded by a `$` prompt — -and their output will follow. -`vi` means to open your editor; then `:wq` means to save the file. -Sometimes I'll add comments to explain a point — these start with `#`. -So, for example: -```bash -# this is a comment -$ echo this is a command -this is a command - -# edit the file -$ vi foo.md -+++ -date = "2040-01-18" -title = "creating a new theme" - -+++ -Bah! Humbug! -:wq - -# show it -$ cat foo.md -+++ -date = "2040-01-18" -title = "creating a new theme" - -+++ -Bah! Humbug! -``` -## Definitions - -Three concepts: - -1. _Non-content_ files; -1. _Templates_ (as Hugo defines them); and -1. _Front-matter_ - -are essential for creating your first Hugo theme, -as well as your first Hugo website. -### Non-Content - -The source files of a web site (destined to be rendered by Hugo) -are divided into two kinds: - -1. The files containing its textual content (and nothing else — -except Hugo front-matter: see below, and Markdown styling); and -1. All other files. (These contain ***no*** textual content — ideally.) - -Temporarily, let's affix the adjective _non-content_ -to the latter kind of source files. - -Non-content files are responsible for your web site's look and feel. -(Follow these article links from [Bop -Design](https://www.bopdesign.com/bop-blog/2013/11/what-is-the-look-and-feel-of-a-website-and-why-its-important/) -and -[Wikipedia](https://en.wikipedia.org/w/index.php?title=Look_and_feel&oldid=731052704) -if you wish for more information.) -They comprise its images, its CSS (for the sizes, colors and fonts), -its JavaScript (for the actions and reactions), and its Hugo templates -(which contain the rules Hugo uses to transform your content into HTML). - -Given these files, Hugo will render a static web site — -informed by your content — -which contains the above images, HTML, CSS and JavaScript, -ready to be served to visitors. - -Actually, a few of your invariant textual snippets -could reside in non-content files as well. -However, because someone might reuse your theme (eventually), -preferably you should keep those textual snippets in their own content files. -#### Where - -Regarding where to create your non-content files, you have two options. -The simplest is the `./layouts/` and `./static/` filesystem trees. -If you choose this way, -then you needn't worry about configuring Hugo to find them. -Invariably, these are the first two places Hugo seeks for templates -(as well as images, CSS and JavaScript); -so in that case, it's guaranteed to find all your non-content files. - -The second option is to create them in a filesystem tree -located somewhere under the `./themes/` directory. -If you choose that way, -then you must always tell Hugo where to search for them — -that's extra work, though. So, why bother? -#### Theme - -Well — the difference between creating your non-content files under -`./layouts/` and `./static/` and creating them under `./themes/` -is admittedly very subtle. -Non-content files created under `./layouts/` and `./static/` -cannot be customized without editing them directly. -On the other hand, non-content files created under `./themes/` -can be customized, in another way. That way is both conventional -(for Hugo web sites) and non-destructive. Therefore, -creating your non-content files under `./themes/` -makes it easier for other people to use them. - -The rest of this tutorial will call a set of non-content files a ***theme*** -if they comprise a filesystem tree rooted anywhere under the -`./themes/` directory. - -Note that you can use this tutorial to create your set of non-content files -under `./layouts/` and `./static/` if you wish. The only difference is that -you wouldn't need to edit your web site's configuration file -in order to select a theme. -### Home - -The home page, or landing page, -is the first page that many visitors to a web site will see. -Often this is `/index.html`, located at the root URL of the web site. -Since Hugo writes files into the `./public/` tree, -your home page will reside in file `./public/index.html`. -### Configure - -When Hugo runs, it first looks for an overall configuration file, -in order to read its settings, and applies them to the entire web site. -These settings override Hugo's default values. - -The file can be in TOML, YAML, or JSON format. -I prefer TOML for my configuration files. -If you prefer JSON or YAML, you'll need to translate my examples. -You'll also need to change the basename, since Hugo uses its extension -to determine how to process it. - -Hugo translates Markdown files into HTML. -By default, Hugo searches for Markdown files in the `./content/` tree -and template files under the `./themes/` directory. -It will render HTML files to the `./public/` tree. -You can override any of these defaults by specifying alternative locations -in the configuration file. -### Template - -_Templates_ direct Hugo in rendering content into HTML; -they bridge content and presentation. - -Rules in template files determine which content is published and where, -and precisely how it will be rendered into HTML files. -Templates also guide your web site's presentation -by specifying the CSS styling to use. - -Hugo uses its knowledge of each piece of content -to seek a template file to use in rendering it. -If it can't find a template that matches the content, it will zoom out, -one conceptual level; it will then resume the search from there. -It will continue to do so, till it finds a matching template, -or runs out of templates to try. -Its last resort is your web site's default template, -which could conceivably be missing. If it finds no suitable template, -it simply forgoes rendering that piece of content. - -It's important to note that _front-matter_ (see next) -can influence Hugo's template file selection process. -### Content - -Content is stored in text files which contain two sections. -The first is called _front-matter_: this is information about the content. -The second contains Markdown-formatted text, -destined for conversion to HTML format. -#### Front-Matter - -The _front-matter_ is meta-information describing the content. -Like the web site's configuration file, it can be written in the -TOML, YAML, or JSON formats. -Unlike the configuration file, Hugo doesn't use the file's extension -to determine the format. -Instead, it looks for markers in the file which signal this. -TOML is surrounded by "`+++`" and YAML by "`---`", but -JSON is enclosed in curly braces. I prefer to use TOML. -You'll need to translate my examples if you prefer YAML or JSON. - -Hugo informs its chosen template files with the front-matter information -before rendering the content in HTML. -#### Markdown - -Content is written in Markdown format, which makes it easy to create. -Hugo runs the content through a Markdown engine to transform it into HTML, -which it then renders to the output file. -### Template Kinds - -Here I'll discuss three kinds of Hugo templates: -_Single_, _List_, and _Partial_. -All these kinds take one or more pieces of content as input, -and transform the pieces, based on commands in the template. -#### Single - -A _Single_ template is used to render one piece of content. -For example, an article or a post is a single piece of content; -thus, it uses a Single template. -#### List - -A _List_ template renders a group of related content items. -This could be a summary of recent postings, -or all of the articles in a category. -List templates can contain multiple groups (or categories). - -The home page template is a special kind of List template. -This is because Hugo assumes that your home page will act as a portal -to all of the remaining content on your web site. -#### Partial - -A _Partial_ template is a template that's incapable of producing a web page, -by itself. To include a Partial template in your web site, -another template must call it, using the `partial` command. - -Partial templates are very handy for rolling up common behavior. -For example, you might want the same banner to appear on all -of your web site's pages — so, rather than copy your banner's text -into multiple content files, -as well as the other information relevant to your banner -into multiple template files (both Single and List), -you can instead create just one content file and one Partial template. -That way, whenever you decide to change the banner, you can do so -by editing one file only (or maybe two). -## Site - -Let's let Hugo help you create your new web site. -The `hugo new site` command will generate a skeleton — -it will give you a basic directory structure, along with -a usable configuration file: -```bash -$ cd /tmp/ - -$ hugo new site mySite - -$ cd mySite/ - -$ ls -l -total 8 -drwxr-xr-x 2 {user} {group} 68 {date} archetypes --rw-r--r-- 1 {user} {group} 107 {date} config.toml -drwxr-xr-x 2 {user} {group} 68 {date} content -drwxr-xr-x 2 {user} {group} 68 {date} data -drwxr-xr-x 2 {user} {group} 68 {date} layouts -drwxr-xr-x 2 {user} {group} 68 {date} static -drwxr-xr-x 2 {user} {group} 68 {date} themes -``` -Take a look in the `./content/` and `./themes/` directories to confirm -they are empty. - -The other directories -(`./archetypes/`, `./data/`, `./layouts/` and `./static/`) -are used for customizing a named theme. -That's a topic for a different tutorial, so please ignore them for now. -### Render - -Running the `hugo` command with no options will read -all of the available content and render the HTML files. Also, it will copy -all the static files (that's everything besides content). -Since we have an empty web site, Hugo won't be doing much. -However, generally speaking, Hugo does this very quickly: -```bash -$ hugo --verbose -INFO: {date} {source} Using config file: /tmp/mySite/config.toml -WARN: {date} {source} No theme set -INFO: {date} {source} /tmp/mySite/static/ is the only static directory available to sync from -INFO: {date} {source} syncing static files to /tmp/mySite/public/ -Started building site -WARN: {date} {source} Unable to locate layout for homepage: [index.html _default/list.html] -WARN: {date} {source} "/" is rendered empty -============================================================= -Your rendered home page is blank: /index.html is zero-length - * Did you specify a theme on the command-line or in your - "config.toml" file? (Current theme: "") -============================================================= -WARN: {date} {source} Unable to locate layout for 404 page: [404.html] -WARN: {date} {source} "404.html" is rendered empty -0 draft content -0 future content -0 expired content -0 pages created -0 non-page files copied -0 paginator pages created -0 tags created -0 categories created -in 4 ms -``` -The "`--verbose`" flag gives extra information that will be helpful -whenever we are developing a template. -Every line of the output starting with "INFO:" or "WARN:" is present -because we used that flag. The lines that start with "WARN:" -are warning messages. We'll go over them later. - -We can verify that the command worked by looking at the directory again: -```bash -$ ls -l -total 8 -drwxr-xr-x 2 {user} {group} 68 {date} archetypes --rw-r--r-- 1 {user} {group} 107 {date} config.toml -drwxr-xr-x 2 {user} {group} 68 {date} content -drwxr-xr-x 2 {user} {group} 68 {date} data -drwxr-xr-x 2 {user} {group} 68 {date} layouts -drwxr-xr-x 6 {user} {group} 204 {date} public -drwxr-xr-x 2 {user} {group} 68 {date} static -drwxr-xr-x 2 {user} {group} 68 {date} themes -``` -See that new `./public/` directory? -Hugo placed all its rendered content there. -When you're ready to publish your web site, that's the place to start. -For now, though, let's just confirm we have the files we expect -for a web site with no content: -```bash -$ ls -l public/ -total 16 --rw-r--r-- 1 {user} {group} 0 {date} 404.html --rw-r--r-- 1 {user} {group} 0 {date} index.html --rw-r--r-- 1 {user} {group} 511 {date} index.xml --rw-r--r-- 1 {user} {group} 210 {date} sitemap.xml -``` -Hugo rendered two XML files and some empty HTML files. -The XML files are used for RSS feeds. Hugo has an opinion about what -those feeds should contain, so it populated those files. -Hugo has no opinion on the look or content of your web site, -so it left those files empty. - -If you look back at the output from the `hugo server` command, -you'll notice that Hugo said: -```bash -0 pages created -``` -That's because Hugo doesn't count the home page, the 404 error page, -or the RSS feed files as pages. -### Serve - -Let's verify you can run the built-in web server — -that'll shorten your development cycle, dramatically. -Start it, by running the `hugo server` command. -If successful, you'll see output similar to the following: -```bash -$ hugo server --verbose -INFO: {date} {source} Using config file: /tmp/mySite/config.toml -WARN: {date} {source} No theme set -INFO: {date} {source} /tmp/mySite/static/ is the only static directory available to sync from -INFO: {date} {source} syncing static files to / -WARN: {date} {source} Unable to locate layout for homepage: [index.html _default/list.html] -WARN: {date} {source} "/" is rendered empty -============================================================= -Your rendered home page is blank: /index.html is zero-length - * Did you specify a theme on the command-line or in your - "config.toml" file? (Current theme: "") -============================================================= -WARN: {date} {source} Unable to locate layout for 404 page: [404.html] -WARN: {date} {source} "404.html" is rendered empty -0 draft content -0 future content -0 expired content -0 pages created -0 non-page files copied -0 paginator pages created -0 tags created -0 categories created -in 3 ms -Watching for changes in /tmp/mySite/{data,content,layouts,static} -Serving pages from memory -Web Server is available at http://localhost:1313/ (bind address 127.0.0.1) -Press Ctrl+C to stop -``` -Connect to the listed URL (it's on the line that begins with -`Web Server is available`). If everything's working correctly, -you should get a page that shows nothing. -### Warnings - -Let's go back and look at some of those warnings again: -```bash -WARN: {date} {source} Unable to locate layout for 404 page: [404.html] -WARN: {date} {source} Unable to locate layout for homepage: [index.html _default/list.html] -``` -The 404 warning is easy to explain — it's because we haven't created -the template file `layouts/404.html`. Hugo uses this to render an HTML file -which serves "page not found" errors. However, -the 404 page is a topic for a separate tutorial. - -Regarding the home page warning: the first layout Hugo looked for was -`layouts/index.html`. Note that Hugo uses this file for the home page only. - -It's good that Hugo lists the files it seeks, when -we give it the verbose flag. For the home page, these files are -`layouts/index.html` and `layouts/_default/list.html`. -Later, we'll cover some rules which explain these paths -(including their basenames). For now, just remember that -Hugo couldn't find a template to use for the home page, and it said so. - -All right! So, now — after these few steps — you have a working -installation, and a web site foundation you can build upon. -All that's left is to add some content, as well as a theme to display it. -## Theme - -Hugo doesn't ship with a default theme. However, a large number of themes -are easily available: for example, at -[hugoThemes](https://github.com/gohugoio/hugoThemes). -Also, Hugo comes with a command to generate them. - -We're going to generate a new theme called Zafta. -The goal of this tutorial is simply to show you how to create -(in a theme) the minimal files Hugo needs in order to display your content. -Therefore, the theme will exclude CSS — -it'll be functional, not beautiful. - -Every theme has its own opinions on content and layout. For example, this -Zafta theme prefers the Type "article" over the Types "blog" or "post." -Strong opinions make for simpler templates, but unconventional opinions -make themes tougher for other users. So when you develop a theme, you should -consider the value of adopting the terms used by themes similar to yours. -### Skeleton - -Let's press Ctrl+C and use the `hugo new theme` command -to generate the skeleton of a theme. The result is a directory structure -containing empty files for you to fill out: -```bash -$ hugo new theme zafta - -$ find themes -type f | xargs ls -l --rw-r--r-- 1 {user} {group} 8 {date} themes/zafta/archetypes/default.md --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/404.html --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/_default/list.html --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/_default/single.html --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/index.html --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/partials/footer.html --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/partials/header.html --rw-r--r-- 1 {user} {group} 1081 {date} themes/zafta/LICENSE.md --rw-r--r-- 1 {user} {group} 450 {date} themes/zafta/theme.toml -``` -The skeleton includes templates (files ending in `.html`), a license file, -a description of your theme (`theme.toml`), and a default archetype file. - -When you're developing a real theme, please remember to fill out files -`theme.toml` and `LICENSE.md`. They're optional, but if you're going to -distribute your theme, it tells the world who to praise (or blame). -It's also important to declare your choice of license, so people will know -whether (or where) they can use your theme. - -Note that the skeleton theme's template files are empty. Don't worry; -we'll change that shortly: -```bash -$ find themes/zafta -name '*.html' | xargs ls -l --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/404.html --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/_default/list.html --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/_default/single.html --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/index.html --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/partials/footer.html --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/partials/header.html -``` -### Select - -Now that we've created a theme we can work with, it's a good idea -to add its name to the configuration file. This is optional, because -it's possible to add "-t zafta" to all your commands. -I like to put it in the configuration file because I like -shorter command lines. If you don't put it in the configuration file, -or specify it on the command line, sometimes you won't get the template -you're expecting. - -So, let's edit your configuration file to add the theme name: -```toml -$ vi config.toml -theme = "zafta" -baseURL = "http://example.org/" -title = "My New Hugo Site" -languageCode = "en-us" -:wq -``` -### Themed Render - -Now that we have a theme (albeit empty), let's render the web site again: -```bash -$ hugo --verbose -INFO: {date} {source} Using config file: /tmp/mySite/config.toml -INFO: {date} {source} using a UnionFS for static directory comprised of: -INFO: {date} {source} Base: /tmp/mySite/themes/zafta/static -INFO: {date} {source} Overlay: /tmp/mySite/static/ -INFO: {date} {source} syncing static files to /tmp/mySite/public/ -Started building site -WARN: {date} {source} "/" is rendered empty -============================================================= -Your rendered home page is blank: /index.html is zero-length - * Did you specify a theme on the command-line or in your - "config.toml" file? (Current theme: "zafta") -============================================================= -WARN: {date} {source} "404.html" is rendered empty -0 draft content -0 future content -0 expired content -0 pages created -0 non-page files copied -0 paginator pages created -0 tags created -0 categories created -in 4 ms -``` -Did you notice the output is different? -Two previous warning messages have disappeared, which contained the words -"Unable to locate layout" for your home page and the 404 page. -And, a new informational message tells us Hugo is accessing your theme's tree -(`./themes/zafta/`). - -Let's check the `./public/` directory to see what Hugo rendered: -```bash -$ ls -l public/ -total 16 --rw-r--r-- 1 {user} {group} 0 {date} 404.html -drwxr-xr-x 2 {user} {group} 68 {date} css --rw-r--r-- 1 {user} {group} 0 {date} index.html --rw-r--r-- 1 {user} {group} 511 {date} index.xml -drwxr-xr-x 2 {user} {group} 68 {date} js --rw-r--r-- 1 {user} {group} 210 {date} sitemap.xml -``` -It's similar to what we had before, without a theme. -We'd expect so, since all your theme's templates are empty. But notice: -in `./public/`, Hugo created the `css/` and `js/` directories. -That's because Hugo found them in your theme's `static/` directory: -```bash -$ ls -l themes/zafta/static/ -total 0 -drwxr-xr-x 2 {user} {group} 68 {date} css -drwxr-xr-x 2 {user} {group} 68 {date} js -``` -#### Home - -In a Hugo web site, each kind of page is informed (primarily) by just one -of the many different kinds of templates available; -yet the home page is special, because it gets its own kind of template, -and its own template file. - -Hugo uses template file `layouts/index.html` to render the home page's HTML. -Although Hugo's documentation may state that this file is the home page's -only required template, Hugo's earlier warning message showed it actually -looks for two different templates: -```bash -WARN: {date} {source} Unable to locate layout for homepage: [index.html _default/list.html] -``` -#### Empty - -When Hugo generated your theme, it included an empty home page template. -Whenever Hugo renders your web site, it seeks that same template and uses it -to render the HTML for the home page. Currently, the template file is empty, -so the output HTML file is empty, too. Whenever we add rules to that template, -Hugo will use them in rendering the home page: -```bash -$ find * -name index.html | xargs ls -l --rw-r--r-- 1 {user} {group} 0 {date} public/index.html --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/index.html -``` -As we'll see later, Hugo follows this same pattern for all its templates. -## Static Files - -Hugo does two things when it renders your web site. -Besides using templates to transform your content into HTML, -it also incorporates your static files. Hugo's rule is simple: -unlike with templates and content, static files aren't transformed. -Hugo copies them over, exactly as they are. - -Hugo assumes that your web site will use both CSS and JavaScript, -so it generates some directories in your theme to hold them. -Remember opinions? Well, Hugo's opinion is that you'll store your CSS -in directory `static/css/`, and your JavaScript in directory `static/js/`. -If you don't like that, you can relocate these directories -or change their names (as long as they remain in your theme's `static/` tree), -or delete them completely. -Hugo is nice enough to offer its opinion; yet it still behaves nicely, -if you disagree: -```bash -$ find themes/zafta/* -type d | xargs ls -dl -drwxr-xr-x 3 {user} {group} 102 {date} themes/zafta/archetypes -drwxr-xr-x 6 {user} {group} 204 {date} themes/zafta/layouts -drwxr-xr-x 4 {user} {group} 136 {date} themes/zafta/layouts/_default -drwxr-xr-x 4 {user} {group} 136 {date} themes/zafta/layouts/partials -drwxr-xr-x 4 {user} {group} 136 {date} themes/zafta/static -drwxr-xr-x 2 {user} {group} 68 {date} themes/zafta/static/css -drwxr-xr-x 2 {user} {group} 68 {date} themes/zafta/static/js -``` -## Theme Development - -Generally (using any kind of software), working on a theme means -changing your files, serving your web site again, and then verifying -the resulting improvements in your browser. -With Hugo, this way of working is quite easy: - -- First purge the `./public/` tree. (This is optional but useful, -if you want to start with a clean slate.) -- Run the built-in Hugo web server. -- Open your web site in a browser — and then: - -1. Edit your theme; -1. Glance at your browser window to see your changes; and -1. Repeat. - -I'll throw in one more opinion: ***never*** directly edit a theme on a live -web site. Instead, always develop ***using a copy***. First, make some changes -to your theme and test them. Afterwards, **when you've got them working,** -copy them to your web site. For added safety, use a tool like Git to keep -some revision history of your content, and of your theme. Believe me: -it's too easy to lose your changes, and your mind! - -Check out the main Hugo web site for information about using Git with Hugo. -### Purge - -When rendering your web site, Hugo will create new files in the `./public/` -tree and update existing ones. But it won't delete files that are -no longer used. For example, files previously rendered with -(what is now) the wrong basename, or in the wrong directory, will remain. -Later, if you leave them, they'll likely confuse you. -Cleaning out your `./public/` files prior to rendering can help. - -When Hugo is running in web server mode (as of version 0.15), -it doesn't actually write the files. Instead, -it keeps all the rendered files in memory. So, you can "clean" up -your files simply by stopping and restarting the web server. -### Serve -#### Watch - -Hugo's watch functionality monitors the relevant content, theme and -(overriding) site trees for filesystem changes, -and renders your web site again automatically, when changes are detected. - -By default, watch is -enabled when in web server mode (`hugo server`), -but disabled for the web site renderer (`hugo`). - -In some use cases, -Hugo's web site renderer should continue running and watch — simply -type `hugo --watch` on the command line. - -Sometimes with Docker containers (and Heroku slugs), -the site sources may live on a read-only filesystem. -In that scenario, it makes no sense -for Hugo's web server to watch for file changes — so -use `hugo server --watch=false`. -#### Reload - -Hugo's built in web server includes -[LiveReload](/extras/livereload/) functionality. When any page is updated -in the filesystem, the web browser is told to refresh its currently-open tabs -from your web site. Usually, this happens faster than you can say, -"Wow, that's totally amazing!" -### Workflow - -Again, -I recommend you use the following commands as the basis for your workflow: -```bash -# purge old files. Hugo will recreate the public directory -$ rm -rf public/ - -# run Hugo in watch mode with LiveReload; -# when you're done, stop the web server -$ hugo server --verbose -Press Ctrl+C to stop -``` -Below is some sample output showing Hugo detecting a change in the home page -template. (Actually, the change is the edit we're about to do.) Once it's -rendered again, the web browser automatically reloads the page. - -(As I said above — it's amazing:) -```bash -$ rm -rf public/ - -$ hugo server --verbose -INFO: {date} {source} Using config file: /tmp/mySite/config.toml -INFO: {date} {source} using a UnionFS for static directory comprised of: -INFO: {date} {source} Base: /tmp/mySite/themes/zafta/static -INFO: {date} {source} Overlay: /tmp/mySite/static/ -INFO: {date} {source} syncing static files to / -Started building site -WARN: {date} {source} "/" is rendered empty -============================================================= -Your rendered home page is blank: /index.html is zero-length - * Did you specify a theme on the command-line or in your - "config.toml" file? (Current theme: "") -============================================================= -WARN: {date} {source} "404.html" is rendered empty -0 draft content -0 future content -0 expired content -0 pages created -0 non-page files copied -0 paginator pages created -0 tags created -0 categories created -in 4 ms -Watching for changes in /tmp/mySite/{data,content,layouts,static,themes} -Serving pages from memory -Web Server is available at http://localhost:1313/ (bind address 127.0.0.1) -Press Ctrl+C to stop -INFO: {date} {source} Received System Events: ["/tmp/mySite/themes/zafta/layouts/index.html": WRITE] - -Change detected, rebuilding site -{date} -Template changed /tmp/mySite/themes/zafta/layouts/index.html -WARN: {date} {source} "404.html" is rendered empty -0 draft content -0 future content -0 expired content -0 pages created -0 non-page files copied -0 paginator pages created -0 tags created -0 categories created -in 3 ms -``` -## Home Template - -The home page is one of the few special pages Hugo renders automatically. -As mentioned earlier, it looks in your theme's `layouts/` tree for one -of two files: - -1. `index.html` -1. `_default/list.html` - -We could edit the default template, but a good design principle is to edit -the most specific template available. That's not a hard-and-fast rule -(in fact, in this tutorial, we'll break it a few times), -but it's a good generalization. -### Static - -Right now, your home page is empty because you've added no content, -and because its template includes no logic. Let's change that by adding -some text to your home page template (`layouts/index.html`): -```html -$ vi themes/zafta/layouts/index.html - - - -

    Hugo says hello!

    - - -:wq -``` -Let's press Ctrl+C and render the web site, and then verify the results: -```html -$ rm -rf public/ - -$ hugo --verbose -INFO: {date} {source} Using config file: /tmp/mySite/config.toml -INFO: {date} {source} using a UnionFS for static directory comprised of: -INFO: {date} {source} Base: /tmp/mySite/themes/zafta/static -INFO: {date} {source} Overlay: /tmp/mySite/static/ -INFO: {date} {source} syncing static files to /tmp/mySite/public/ -Started building site -WARN: {date} {source} "404.html" is rendered empty -0 draft content -0 future content -0 expired content -0 pages created -0 non-page files copied -0 paginator pages created -0 tags created -0 categories created -in 4 ms - -$ ls -l public/index.html --rw-r--r-- 1 {user} {group} 72 {date} public/index.html - -$ cat public/index.html - - - -

    Hugo says hello!

    - - -``` -### Dynamic - -A ***dynamic*** home page? Because Hugo is a _static web site_ generator, -the word _dynamic_ seems odd, doesn't it? But this means arranging for your -home page to reflect the content in your web site automatically, -each time Hugo renders it. - -To accomplish that, later we'll add an iterator to your home page template. -## Article - -Now that Hugo is successfully rendering your home page with static content, -let's add more pages to your web site. We'll display some new articles -as a list on your home page; and we'll display each article -on its own page, too. - -Hugo has a command to generate an entry skeleton for new content, -just as it does for web sites and themes: -```bash -$ hugo --verbose new article/First.md -INFO: {date} {source} Using config file: /tmp/mySite/config.toml -INFO: {date} {source} attempting to create article/First.md of article -INFO: {date} {source} curpath: /tmp/mySite/themes/zafta/archetypes/default.md -INFO: {date} {source} creating /tmp/mySite/content/article/First.md -/tmp/mySite/content/article/First.md created - -$ ls -l content/article/ -total 8 --rw-r--r-- 1 {user} {group} 61 {date} First.md -``` -Let's generate a second article, while we're here: -```bash -$ hugo --verbose new article/Second.md -INFO: {date} {source} Using config file: /tmp/mySite/config.toml -INFO: {date} {source} attempting to create article/Second.md of article -INFO: {date} {source} curpath: /tmp/mySite/themes/zafta/archetypes/default.md -INFO: {date} {source} creating /tmp/mySite/content/article/Second.md -/tmp/mySite/content/article/Second.md created - -$ ls -l content/article/ -total 16 --rw-r--r-- 1 {user} {group} 61 {date} First.md --rw-r--r-- 1 {user} {group} 62 {date} Second.md -``` -Let's edit both those articles. Be careful to preserve their front-matter, -but append some text to their bodies, as follows: -```bash -$ vi content/article/First.md -In vel ligula tortor. Aliquam erat volutpat. -Pellentesque at felis eu quam tincidunt dignissim. -Nulla facilisi. - -Pellentesque tempus nisi et interdum convallis. -In quam ante, vulputate at massa et, rutrum -gravida dui. Phasellus tristique libero at ex. -:wq - -$ vi content/article/Second.md -Fusce lacus magna, maximus nec sapien eu, -porta efficitur neque. Aliquam erat volutpat. -Vestibulum enim nibh, posuere eu diam nec, -varius sagittis turpis. - -Praesent quis sapien egestas mauris accumsan -pulvinar. Ut mattis gravida venenatis. Vivamus -lobortis risus id nisi rutrum, at iaculis. -:wq -``` -So, for example, `./content/article/Second.md` becomes: -```toml -$ cat content/article/Second.md -+++ -date = "2040-01-18T21:08:08-06:00" -title = "Second" - -+++ -Fusce lacus magna, maximus nec sapien eu, -porta efficitur neque. Aliquam erat volutpat. -Vestibulum enim nibh, posuere eu diam nec, -varius sagittis turpis. - -Praesent quis sapien egestas mauris accumsan -pulvinar. Ut mattis gravida venenatis. Vivamus -lobortis risus id nisi rutrum, at iaculis. -``` -Let's render the web site, and then verify the results: -```bash -$ rm -rf public/ - -$ hugo --verbose -INFO: {date} {source} Using config file: /tmp/mySite/config.toml -INFO: {date} {source} using a UnionFS for static directory comprised of: -INFO: {date} {source} Base: /tmp/mySite/themes/zafta/static -INFO: {date} {source} Overlay: /tmp/mySite/static/ -INFO: {date} {source} syncing static files to /tmp/mySite/public/ -Started building site -INFO: {date} {source} found taxonomies: map[string]string{"tag":"tags", "category":"categories"} -WARN: {date} {source} "article" is rendered empty -WARN: {date} {source} "article/Second.html" is rendered empty -WARN: {date} {source} "article/First.html" is rendered empty -WARN: {date} {source} "404.html" is rendered empty -0 draft content -0 future content -0 expired content -2 pages created -0 non-page files copied -0 paginator pages created -0 tags created -0 categories created -in 7 ms -``` -The output says Hugo rendered ("created") two pages. -Those pages are your new articles: -```bash -$ find public -type f -name '*.html' | xargs ls -l --rw-r--r-- 1 {user} {group} 0 {date} public/404.html --rw-r--r-- 1 {user} {group} 0 {date} public/article/First/index.html --rw-r--r-- 1 {user} {group} 0 {date} public/article/index.html --rw-r--r-- 1 {user} {group} 0 {date} public/article/Second/index.html --rw-r--r-- 1 {user} {group} 72 {date} public/index.html -``` -The new pages are empty, because Hugo rendered their HTML from empty -template files. The home page doesn't show us the new content, either: -```html -$ cat public/index.html - - - -

    Hugo says hello!

    - - -``` -So, we have to edit the templates, in order to pick up the articles. -### Single & List - -Here again I'll discuss three kinds of Hugo templates. One kind is -the home page template we edited previously; it's applicable only to -the home page. Another kind is Single templates, which render output for -just one content file. The third kind are List templates, which group -multiple pieces of content before rendering output. - -It's important to note that, generally, List templates -(except the home page template) are named `list.html`; -and Single templates are named `single.html`. - -Hugo also has three other kinds of templates: -Partials, _Content Views_, and _Terms_. -We'll give examples of some Partial templates; but otherwise, -we won't go into much detail about these. -### Home - -You'll want your home page to list the articles you just created. -So, let's alter its template file (`layouts/index.html`) to show them. -Hugo runs each template's logic whenever it renders that template's web page -(of course): -```html -$ vi themes/zafta/layouts/index.html - - - - {{- range first 10 .Data.Pages }} -

    {{ .Title }}

    - {{- end }} - - -:wq -``` -#### Engine - -Hugo uses the [Go language's template -engine](https://gohugo.io/templates/go-templates/). -That engine scans your template files for commands enclosed between -"{{" and "}}" (these are doubled, curly braces — affectionately -known as "mustaches"). - -BTW, a hyphen, if placed immediately after an opening mustache, or -immediately before a closing one, will prevent extraneous newlines. -(This can make Hugo's output look better, when viewed as text.) - -So, the mustache commands in your newly-altered template are: - -1.  `range ...` -1.  `.Permalink` -1.  `.Title` -1.  `end` - -The `range` command is an iterator. We're using it to go through the latest -ten pages. (Hugo characterizes some of its HTML output files as "pages," -but not all — see above.) - -Looping through the list of data pages will consider each such HTML file -that Hugo renders (or rather — to speak more precisely — each -such HTML file that Hugo currently calculates it _will_ render). - -It's helpful to remember that Hugo sets some variables, such as `.Data`, quite -early in its overall processing. Hugo loads information from every content -file into that variable, and gives all the templates a chance to process that -variable's contents, before actually rendering any HTML output files. - -`.Permalink` supplies the URL which links to that article's page, and -`.Title` supplies the value of its "title" variable. Hugo obtains this -from the front-matter in the article's Markdown file. - -Automatically, the pages are considered in descending order of the generation -times of their Markdown files (actually, based on the value of the "date" -variable in their front-matter) so that the latest is first (naturally). - -The `end` command signals the end of the range iterator. The engine -loops back to the top of the iterator, whenever it finds `end.` -Everything between `range` and `end` is reevaluated, -each time the engine goes through the iterator. - -For the present template, this means that the titles of your latest -ten pages (or however many exist, if that's less) become the -[textContent](https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent) -of an equivalent number of copies Hugo makes, of your level-four -subheading tags (and anchor tags). `.Permalink` enables these to link -to the actual articles. - -Let's render your web site, and then verify the results: -```html -$ rm -rf public/ - -$ hugo --verbose -INFO: {date} {source} Using config file: /tmp/mySite/config.toml -INFO: {date} {source} using a UnionFS for static directory comprised of: -INFO: {date} {source} Base: /tmp/mySite/themes/zafta/static -INFO: {date} {source} Overlay: /tmp/mySite/static/ -INFO: {date} {source} syncing static files to /tmp/mySite/public/ -Started building site -INFO: {date} {source} found taxonomies: map[string]string{"tag":"tags", "category":"categories"} -WARN: {date} {source} "article" is rendered empty -WARN: {date} {source} "article/Second.html" is rendered empty -WARN: {date} {source} "article/First.html" is rendered empty -WARN: {date} {source} "404.html" is rendered empty -0 draft content -0 future content -0 expired content -2 pages created -0 non-page files copied -0 paginator pages created -0 tags created -0 categories created -in 7 ms - -$ find public -type f -name '*.html' | xargs ls -l --rw-r--r-- 1 {user} {group} 0 {date} public/404.html --rw-r--r-- 1 {user} {group} 0 {date} public/article/First/index.html --rw-r--r-- 1 {user} {group} 0 {date} public/article/index.html --rw-r--r-- 1 {user} {group} 0 {date} public/article/Second/index.html --rw-r--r-- 1 {user} {group} 232 {date} public/index.html - -$ cat public/index.html - - - -

    Second

    -

    First

    - - -``` -### All Done - -Congratulations! Your home page shows the titles of your two articles, along -with the links to them. The articles themselves are still empty. But, -let's take a moment to appreciate what we've done, so far! - -Your home page template (`layouts/index.html`) now renders output dynamically. -Believe it or not, by inserting the range command inside those doubled -curly braces, you've learned everything you need to know — -essentially — about developing a theme. - -All that's left is understanding which of your templates renders each content -file, and becoming more familiar with the commands for the template engine. -## More - -Well — if things were so simple, this tutorial would be much shorter! - -Some things are still useful to learn, because they'll make creating new -templates _much_ easier — so, I'll cover them, now. -### Base URL - -While developing and testing your theme, did you notice that the links in the -rendered `./public/index.html` file use the full "baseURL" from your -`./config.toml` file? That's because those files are intended to be deployed -to your web server. - -Whenever you test your theme, you start Hugo in web server mode -(with `hugo server`) and connect to it with your web browser. -That command is smart enough to replace the "baseURL" with -`http://localhost:1313` on the fly, so that the links automatically -work for you. - -That's another reason why we recommend testing with the built-in web server. -### Content - -The articles you've been working with are in your `./content/article/` -directory. That means their _Section_ (as far as templates are concerned) -is "article". Unless we do something unusual in their front-matter, their -_Type_ is also "article". -#### Search - -Hugo uses the Section and Type to find a template file for every piece of -content it renders. Hugo first will seek a template file in subdirectories of -`layouts/` that match its Section or Type name (i.e., in `layouts/SECTION/` -or `layouts/TYPE/`). If it can't find a file there, then it will look in the -`layouts/_default/` directory. Other documentation covers some twists about -categories and tags, but we won't use those in this tutorial. Therefore, -we can assume that Hugo will try first `layouts/article/single.html`, then -`layouts/_default/single.html`. - -Now that we know the search rule, let's see what's available: -```bash -$ find themes/zafta -name single.html | xargs ls -l --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/_default/single.html -``` -If you look back at the articles Hugo has rendered, you can see that -they were empty. Now we can see that this is because Hugo sought -`layouts/article/single.html` but couldn't find it, and template -`layouts/_default/single.html` was empty. Therefore, the rendered article -file was empty, too. - -So, we could either create a new template, `layouts/article/single.html`, -or edit the default one. -#### Default Single - -Since we know of no other content Types, let's start by editing the default -template file, `layouts/_default/single.html`. - -As we mentioned earlier, you always should edit (or create) the most -specific template first, in order to avoid accidentally changing how other -content is displayed. However, we're breaking that rule intentionally, -just so we can explore how the default is used. - -Remember, any content — for which we don't create a specific template -— will end up using this default template. That can be good or bad. -Bad, because I know we'll be adding different Types of content, and we'll -eventually undo some of the changes we've made. Good, because then we'll be -able to see some results immediately. It's also good to create the default -template first, because with it, we can start to develop the basic layout -for the web site. - -As we add more content Types, we'll refactor this file and move its logic -around. Hugo makes this fairly painless, so we'll accept the cost and proceed. - -Please see Hugo's documentation on template rendering, for all the details on -determining which template to use. And, as the documentation mentions, if -your web site is a single-page application (SPA), you can delete all the -other templates and work with just the default Single one. By itself, -that fact provides a refreshing amount of joy. - -Let's edit the default template file (`layouts/_default/single.html`): -```html -$ vi themes/zafta/layouts/_default/single.html - - - - {{ .Title }} - - -

    {{ .Title }}

    -
    {{ .Date.Format "Mon, Jan 2, 2006" }}
    - {{ .Content }} -

    Home

    - - -:wq -``` -#### Verify - -Let's render the web site, and verify the results: -```bash -$ rm -rf public/ - -$ hugo --verbose -INFO: {date} {source} Using config file: /tmp/mySite/config.toml -INFO: {date} {source} using a UnionFS for static directory comprised of: -INFO: {date} {source} Base: /tmp/mySite/themes/zafta/static -INFO: {date} {source} Overlay: /tmp/mySite/static/ -INFO: {date} {source} syncing static files to /tmp/mySite/public/ -Started building site -INFO: {date} {source} found taxonomies: map[string]string{"tag":"tags", "category":"categories"} -WARN: {date} {source} "article" is rendered empty -WARN: {date} {source} "404.html" is rendered empty -0 draft content -0 future content -0 expired content -2 pages created -0 non-page files copied -0 paginator pages created -0 tags created -0 categories created -in 7 ms - -$ find public -type f -name '*.html' | xargs ls -l --rw-r--r-- 1 {user} {group} 0 {date} public/404.html --rw-r--r-- 1 {user} {group} 473 {date} public/article/First/index.html --rw-r--r-- 1 {user} {group} 0 {date} public/article/index.html --rw-r--r-- 1 {user} {group} 514 {date} public/article/Second/index.html --rw-r--r-- 1 {user} {group} 232 {date} public/index.html -``` -Note that although Hugo rendered a file, to list your articles: -`./public/article/index.html`, the file is empty, because we don't have -a template for it. (However: see next.) The other HTML files contain your -content, as we can see below: -```html -$ cat public/article/First/index.html - - - - First - - -

    First

    -
    Wed, Jan 18, 2040
    -

    In vel ligula tortor. Aliquam erat volutpat. -Pellentesque at felis eu quam tincidunt dignissim. -Nulla facilisi.

    - -

    Pellentesque tempus nisi et interdum convallis. -In quam ante, vulputate at massa et, rutrum -gravida dui. Phasellus tristique libero at ex.

    - -

    Home

    - - - -$ cat public/article/Second/index.html - - - - Second - - -

    Second

    -
    Wed, Jan 18, 2040
    -

    Fusce lacus magna, maximus nec sapien eu, -porta efficitur neque. Aliquam erat volutpat. -Vestibulum enim nibh, posuere eu diam nec, -varius sagittis turpis.

    - -

    Praesent quis sapien egestas mauris accumsan -pulvinar. Ut mattis gravida venenatis. Vivamus -lobortis risus id nisi rutrum, at iaculis.

    - -

    Home

    - - -``` -Again, notice that your rendered article files have content. -You can run `hugo server` and use your browser to confirm this. -You should see your home page, and it should contain the titles of both -articles. Each title should be a link to its respective article. - -Each article should be displayed fully on its own page. And at the bottom of -each article, you should see a link which takes you back to your home page. -### Article List - -Your home page still lists your most recent articles. However — -remember, from above, that I mentioned an empty file, -`./public/article/index.html`? -Let's make that show a list of ***all*** of your articles -(not just the latest ten). - -We need to decide which template to edit. Key to this, is that -individual pages always come from Single templates. On the other hand, -only List templates are capable of rendering pages which display collections -(or lists) of other pages. - -Because the new page will show a listing, we should select a List template. -Let's take a quick look to see which List templates are available already: -```bash -$ find themes/zafta -name list.html | xargs ls -l --rw-r--r-- 1 {user} {group} 0 {date} themes/zafta/layouts/_default/list.html -``` -So, just as before with the single articles, so again now with the list of -articles, we must decide: whether to edit `layouts/_default/list.html`, -or to create `layouts/article/list.html`. -#### Default List - -We still don't have multiple content Types — so, remaining consistent, -let's edit the default List template: -```html -$ vi themes/zafta/layouts/_default/list.html - - - -

    Articles

    - {{- range first 10 .Data.Pages }} -

    {{ .Title }}

    - {{- end }} -

    Home

    - - -:wq -``` -Let's render everything again: -```bash -$ rm -rf public/ - -$ hugo --verbose -INFO: {date} {source} Using config file: /tmp/mySite/config.toml -INFO: {date} {source} using a UnionFS for static directory comprised of: -INFO: {date} {source} Base: /tmp/mySite/themes/zafta/static -INFO: {date} {source} Overlay: /tmp/mySite/static/ -INFO: {date} {source} syncing static files to /tmp/mySite/public/ -Started building site -INFO: {date} {source} found taxonomies: map[string]string{"tag":"tags", "category":"categories"} -WARN: {date} {source} "404.html" is rendered empty -0 draft content -0 future content -0 expired content -2 pages created -0 non-page files copied -0 paginator pages created -0 categories created -0 tags created -in 7 ms - -$ find public -type f -name '*.html' | xargs ls -l --rw-r--r-- 1 {user} {group} 0 {date} public/404.html --rw-r--r-- 1 {user} {group} 473 {date} public/article/First/index.html --rw-r--r-- 1 {user} {group} 327 {date} public/article/index.html --rw-r--r-- 1 {user} {group} 514 {date} public/article/Second/index.html --rw-r--r-- 1 {user} {group} 232 {date} public/index.html -``` -Now (as you can see), we have a list of articles. To confirm it, -type `hugo server`; then, in your browser, navigate to `/article/`. -(Later, we'll link to it.) -## About - -Let's add an About page, and try to display it at the top level -(as opposed to the next level down, where we placed your articles). -### Guide - -Hugo's default goal is to let the directory structure of the `./content/` -tree guide the location of the HTML it renders to the `./public/` tree. -Let's check this, by generating an About page at the content's top level: -```toml -$ hugo new About.md -/tmp/mySite/content/About.md created - -$ ls -l content/ -total 8 --rw-r--r-- 1 {user} {group} 61 {date} About.md -drwxr-xr-x 4 {user} {group} 136 {date} article - -$ vi content/About.md -+++ -date = "2040-01-18T22:01:00-06:00" -title = "About" - -+++ -Neque porro quisquam est qui dolorem -ipsum quia dolor sit amet consectetur -adipisci velit. -:wq -``` -### Check - -Let's render your web site, and check the results: -```html -$ rm -rf public/ - -$ hugo --verbose -INFO: {date} {source} Using config file: /tmp/mySite/config.toml -INFO: {date} {source} using a UnionFS for static directory comprised of: -INFO: {date} {source} Base: /tmp/mySite/themes/zafta/static -INFO: {date} {source} Overlay: /tmp/mySite/static/ -INFO: {date} {source} syncing static files to /tmp/mySite/public/ -Started building site -INFO: {date} {source} found taxonomies: map[string]string{"tag":"tags", "category":"categories"} -WARN: {date} {source} "404.html" is rendered empty -0 draft content -0 future content -0 expired content -3 pages created -0 non-page files copied -0 paginator pages created -0 tags created -0 categories created -in 9 ms - -$ ls -l public/ -total 24 --rw-r--r-- 1 {user} {group} 0 {date} 404.html -drwxr-xr-x 3 {user} {group} 102 {date} About -drwxr-xr-x 6 {user} {group} 204 {date} article -drwxr-xr-x 2 {user} {group} 68 {date} css --rw-r--r-- 1 {user} {group} 316 {date} index.html --rw-r--r-- 1 {user} {group} 2221 {date} index.xml -drwxr-xr-x 2 {user} {group} 68 {date} js --rw-r--r-- 1 {user} {group} 681 {date} sitemap.xml - -$ ls -l public/About/ -total 8 --rw-r--r-- 1 {user} {group} 305 {date} index.html - -$ cat public/About/index.html - - - - About - - -

    About

    -
    Wed, Jan 18, 2040
    -

    Neque porro quisquam est qui dolorem -ipsum quia dolor sit amet consectetur -adipisci velit.

    - -

    Home

    - - -``` -Oh, well. — Did you notice that your page wasn't rendered at the -top level? It was rendered to a subdirectory named `./public/About/`. -That name came from the basename of your Markdown file `./content/About.md`. -Interesting — but, we'll let that go, for now. -### Home - -One other thing — let's take a look at your home page: -```html -$ cat public/index.html - - - -

    About

    -

    Second

    -

    First

    - - -``` -Did you notice that the About link is listed with your articles? -That's not exactly where we want it; so, let's edit your home page template -(`layouts/index.html`): -```html -$ vi themes/zafta/layouts/index.html - - - -

    Articles

    - {{- range first 10 .Data.Pages -}} - {{- if eq .Type "article"}} -

    {{ .Title }}

    - {{- end -}} - {{- end }} -

    Pages

    - {{- range first 10 .Data.Pages -}} - {{- if eq .Type "page" }} -

    {{ .Title }}

    - {{- end -}} - {{- end }} - - -:wq -``` -Let's render your web site, and verify the results: -```html -$ rm -rf public/ - -$ hugo --verbose -INFO: {date} {source} Using config file: /tmp/mySite/config.toml -INFO: {date} {source} using a UnionFS for static directory comprised of: -INFO: {date} {source} Base: /tmp/mySite/themes/zafta/static -INFO: {date} {source} Overlay: /tmp/mySite/static/ -INFO: {date} {source} syncing static files to /tmp/mySite/public/ -Started building site -INFO: {date} {source} found taxonomies: map[string]string{"tag":"tags", "category":"categories"} -WARN: {date} {source} "404.html" is rendered empty -0 draft content -0 future content -0 expired content -3 pages created -0 non-page files copied -0 paginator pages created -0 tags created -0 categories created -in 9 ms - -$ cat public/index.html - - - -

    Articles

    -

    Second

    -

    First

    -

    Pages

    -

    About

    - - -``` -Good! This time, your home page has two Sections: "article" and "page", and -each Section contains the correct set of headings and links. -## Template Sharing - -If you've been following along on your computer, you might've noticed that -your home page doesn't show its title in your browser, although both of your -article pages do. That's because we didn't add your home page's title to its -template (`layouts/index.html`). That would be easy to do — but instead, -let's look at a better option. - -We can put the common information into a shared template. -These reside in the `layouts/partials/` directory. -### Header & Footer - -In Hugo (as elsewhere), a Partial is a template that's intended to be used -within other templates. We're going to create a Partial template that will -contain a header, for all of your page templates to use. That Partial will -enable us to maintain the header information in a single place, thus easing -our maintenance. Let's create both the header (`layouts/partials/header.html`) -and the footer (`layouts/partials/footer.html`): -```html -$ vi themes/zafta/layouts/partials/header.html - - - - {{ .Title }} - - -:wq - -$ vi themes/zafta/layouts/partials/footer.html -

    Home

    - - -:wq -``` -### Calling - -Any `partial` is called relative to its conventional location -`layouts/partials/`. So, you pass just the basename, followed by the context -(the period before the closing mustache). For example: -```bash -{{ partial "header.html" . }} -``` -#### From Home - -Let's change your home page template (`layouts/index.html`) -in order to use the new header Partial we just created: -```html -$ vi themes/zafta/layouts/index.html -{{ partial "header.html" . }} -

    Articles

    - {{- range first 10 .Data.Pages -}} - {{- if eq .Type "article"}} -

    {{ .Title }}

    - {{- end -}} - {{- end }} -

    Pages

    - {{- range first 10 .Data.Pages -}} - {{- if eq .Type "page" }} -

    {{ .Title }}

    - {{- end -}} - {{- end }} - - -:wq -``` -Render your web site and verify the results. Now, the title on your home page -should be "My New Hugo Site". This comes from the "title" variable -in the `./config.toml` file. -#### From Default - -Let's also edit the default templates (`layouts/_default/single.html` and -`layouts/_default/list.html`) to use your new Partials: -```html -$ vi themes/zafta/layouts/_default/single.html -{{ partial "header.html" . }} -

    {{ .Title }}

    -
    {{ .Date.Format "Mon, Jan 2, 2006" }}
    - {{ .Content }} -{{ partial "footer.html" . -}} -:wq - -$ vi themes/zafta/layouts/_default/list.html -{{ partial "header.html" . -}} -

    Articles

    - {{- range first 10 .Data.Pages }} -

    {{ .Title }}

    - {{- end }} -{{ partial "footer.html" . -}} -:wq -``` -Render your web site and verify the results. -Now, the title of your About page should reflect the value of the "title" -variable in its corresponding Markdown file (`./content/About.md`). -The same should be true for each of your article pages as well (i.e., -`./content/article/First.md` and `./content/article/Second.md`). -### DRY - -Don't Repeat Yourself (also known as DRY) is a desirable goal, -in any kind of source code development — -and Hugo's partials do a fine job to help with that. - -Part of the art of good templates is knowing when to add new ones, and when -to edit existing ones. While you're still figuring out the art of templates, -you should accept that you'll do some refactoring — Hugo makes this -easy and fast. And it's okay to delay splitting your templates into Partials. -## Section -### Date - -Articles commonly display the date they were published -(or finalized) — so, here, let's do the same. - -The front-matter of your articles contains a "date" variable -(as discussed above). Hugo sets this, when it creates each content file. -Now, sometimes an article requires many days to prepare, so its actual -publishing date might be later than the front-matter's "date". However, for -simplicity's sake, let's pretend this is the date we want to display, each time. - -In Hugo, in order to format a variable date (or time), -we must do it by formatting the Go language [reference -time](https://golang.org/pkg/time/); for example: -```bash -{{ .Date.Format "Mon, Jan 2, 2006" }} -``` -Now, your articles use the `layouts/_default/single.html` template (see above). -Because that template includes a date-formatting snippet, they show a -nice looking date. However, your About page uses the same default template. -Unfortunately, now it too shows its creation date (which makes no sense)! - -There are a couple of ways to make the date display only for articles. -We could use an "if" statement, to display the date only when the Type equals -"article." That is workable, and acceptable for web sites with only a couple -of content Types. It aligns with the principle of "code for today," too. -### Template - -Let's assume, though (for didactic purposes), that you've made your web site so -complex that you feel you must create a new template Type. In Hugo-speak, this -will be a new Section. It will contain your new, "article" Single template. - -Let's restore your default Single template (`layouts/_default/single.html`) -to its earlier state (before we forget): -```html -$ vi themes/zafta/layouts/_default/single.html -{{ partial "header.html" . }} -

    {{ .Title }}

    - {{ .Content }} -{{ partial "footer.html" . -}} -:wq -``` -Now, let's create your new template. If you remember Hugo's rules, -the template engine will prefer this version over the default. The first step -is to create (within your theme) its Section's directory: `layouts/article/`. -Then, create a Single template (`layouts/article/single.html`) within it: -```html -$ mkdir themes/zafta/layouts/article - -$ vi themes/zafta/layouts/article/single.html -{{ partial "header.html" . }} -

    {{ .Title }}

    -
    {{ .Date.Format "Mon, Jan 2, 2006" }}
    - {{ .Content }} -{{ partial "footer.html" . -}} -:wq -``` -Basically, we moved the date logic — from the default template, to the -new "article" Section, Single template: `layouts/article/single.html`. - -Let's render your web site and verify the results: -```html -$ rm -rf public/ - -$ hugo --verbose -INFO: {date} {source} Using config file: /tmp/mySite/config.toml -INFO: {date} {source} using a UnionFS for static directory comprised of: -INFO: {date} {source} Base: /tmp/mySite/themes/zafta/static -INFO: {date} {source} Overlay: /tmp/mySite/static/ -INFO: {date} {source} syncing static files to /tmp/mySite/public/ -Started building site -INFO: {date} {source} found taxonomies: map[string]string{"tag":"tags", "category":"categories"} -WARN: {date} {source} "404.html" is rendered empty -0 draft content -0 future content -0 expired content -3 pages created -0 non-page files copied -0 paginator pages created -0 tags created -0 categories created -in 10 ms - -$ cat public/article/First/index.html - - - - First - - - -

    First

    -
    Wed, Jan 18, 2040
    -

    In vel ligula tortor. Aliquam erat volutpat. -Pellentesque at felis eu quam tincidunt dignissim. -Nulla facilisi.

    - -

    Pellentesque tempus nisi et interdum convallis. -In quam ante, vulputate at massa et, rutrum -gravida dui. Phasellus tristique libero at ex.

    - -

    Home

    - - - -$ cat public/About/index.html - - - - About - - - -

    About

    -

    Neque porro quisquam est qui dolorem -ipsum quia dolor sit amet consectetur -adipisci velit.

    - -

    Home

    - - -``` -Now, as you can see, your articles show their dates, -and your About page (sensibly) doesn't. diff --git a/content/tutorials/github-pages-blog.md b/content/tutorials/github-pages-blog.md deleted file mode 100644 index 013642ded..000000000 --- a/content/tutorials/github-pages-blog.md +++ /dev/null @@ -1,197 +0,0 @@ ---- -aliases: - - /tutorials/github_pages_blog/ -author: Spencer Lyon, Gunnar Morling -lastmod: 2017-01-11 -date: 2014-03-21 -linktitle: Hosting on GitHub -toc: true -menu: - main: - parent: tutorials -next: /tutorials/how-to-contribute-to-hugo/ -prev: /tutorials/creating-a-new-theme -title: Hosting on GitHub Pages -weight: 10 ---- - -*This tutorial was contributed by [Spencer Lyon](http://spencerlyon.com/) (Personal/Organization Pages) and [Gunnar Morling](https://github.com/gunnarmorling/).* - -## Introduction - -This tutorial describes how to deploy your Hugo based website to [GitHub pages](https://pages.github.com/). - -The following sections are based on the assumption that you are working with a "Project Pages Site". -This means that you'll have your Hugo sources and the generated HTML output within a single repository -(in contrast, with a "User/Organization Pages Site", you'd have one repo for the sources and another repo for the published HTML files; -refer to the [GitHub Pages docs](https://help.github.com/articles/user-organization-and-project-pages/) to learn more). - -## Deployment via _/docs_ folder on master branch - -[As described](https://help.github.com/articles/configuring-a-publishing-source-for-github-pages/#publishing-your-github-pages-site-from-a-docs-folder-on-your-master-branch) in the GitHub Pages docs, you can deploy from a folder called _docs_ on your master branch. -This requires to change the Hugo publish directory in the site config (e.g. _config.toml_): - - publishDir = "docs" - -After running `hugo`, push your master branch to the remote repo and choose the _docs_ folder as the website source of your repo -(in your GitHub project, go to "Settings " -> "GitHub Pages" -> "Source" -> Select "master branch /docs folder"). -If that option isn't enabled, you likely haven't pushed your _docs_ folder yet. - -This is the simplest approach but requires the usage of a non-standard publish directory -(GitHub Pages cannot be configured to use another directory than _docs_ currently). -Also the presence of generated files on the master branch may not be to everyone's taste. - -## Deployment via gh-pages branch - -Alternatively, you can deploy site through a separate branch called "gh_pages". -That approach is a bit more complex but has some advantages: - -* It keeps sources and generated HTML in two different branches -* It uses the default _public_ folder -* It keeps the histories of source branch and gh-pages branch fully separated from each other - -### Preparations - -These steps only need to be done once (replace "upstream" with the name of your remote, e.g. "origin"): -First, add the _public_ folder to _.gitignore_ so it's ignored on the master branch: - - echo "public" >> .gitignore - -Then initialize the gh-pages branch as an empty [orphan branch](https://git-scm.com/docs/git-checkout/#git-checkout---orphanltnewbranchgt): - - git checkout --orphan gh-pages - git reset --hard - git commit --allow-empty -m "Initializing gh-pages branch" - git push upstream gh-pages - git checkout master - -### Building and Deployment - -Now check out the gh-pages branch into your _public_ folder, using git's [worktree feature](https://git-scm.com/docs/git-worktree) -(essentially, it allows you to have multiple branches of the same local repo to be checked out in different directories): - - rm -rf public - git worktree add -B gh-pages public upstream/gh-pages - -Regenerate the site using Hugo and commit the generated files on the gh-pages branch: - - hugo - cd public && git add --all && git commit -m "Publishing to gh-pages" && cd .. - -If the changes in your local gh-pages branch look alright, push them to the remote repo: - - git push upstream gh-pages - -After a short while you'll see the updated contents on your GitHub Pages site. - -### Putting it into a script - -To automate these steps, you can create a script _scripts/publish_to_ghpages.sh_ with the following contents: - -``` -#!/bin/sh - -DIR=$(dirname "$0") - -cd $DIR/.. - -if [[ $(git status -s) ]] -then - echo "The working directory is dirty. Please commit any pending changes." - exit 1; -fi - -echo "Deleting old publication" -rm -rf public -mkdir public -git worktree prune -rm -rf .git/worktrees/public/ - -echo "Checking out gh-pages branch into public" -git worktree add -B gh-pages public upstream/gh-pages - -echo "Removing existing files" -rm -rf public/* - -echo "Generating site" -hugo - -echo "Updating gh-pages branch" -cd public && git add --all && git commit -m "Publishing to gh-pages (publish.sh)" -``` - -This will abort if there are pending changes in the working directory and also makes sure that all previously existing output files are removed. -Adjust the script to taste, e.g. to include the final push to the remote repository if you don't need to take a look at the gh-pages branch before pushing. Or adding `echo yourdomainname.com >> CNAME` if you set up for your gh-pages to use customize domain. - -## Deployment with Git 2.4 and earlier - -The `worktree` command was only introduced in Git 2.5. -If you are still on an earlier version and cannot update, you can simply clone your local repo into the _public_ directory, only keeping the gh-pages branch: - - git clone .git --branch gh-pages public - -Having re-generated the site, you'd push back the gh-pages branch to your primary local repo: - - cd public && git add --all && git commit -m "Publishing to gh-pages" && git push origin gh-pages - -The other steps are the same as with the worktree approach. - -## Hosting Personal/Organization Pages - -As mentioned [in this GitHub's article](https://help.github.com/articles/user-organization-and-project-pages/), besides project pages, you may also want to host a user/organization page. Here are the key differences: - -> - You must use the `username.github.io` naming scheme. -> - Content from the `master` branch will be used to build and publish your GitHub Pages site. - -It becomes much simpler in that case: we'll create two separate repos, one for Hugo's content, and a git submodule with the `public` folder's content in it. - -Step by step: - -1. Create on GitHub `-hugo` repository (it will host Hugo's content) -2. Create on GitHub `.github.io` repository (it will host the `public` folder: the static website) -3. `git clone <-hugo-url> && cd -hugo` -4. Make your website work locally (`hugo server -t `) -5. Once you are happy with the results, Ctrl+C (kill server) and `rm -rf public` (don't worry, it can always be regenerated with `hugo -t `) -6. `git submodule add -b master git@github.com:/.github.io.git public` -7. Almost done: add a `deploy.sh` script to help you (and make it executable: `chmod +x deploy.sh`): - -``` -#!/bin/bash - -echo -e "\033[0;32mDeploying updates to GitHub...\033[0m" - -# Build the project. -hugo # if using a theme, replace by `hugo -t ` - -# Go To Public folder -cd public -# Add changes to git. -git add -A - -# Commit changes. -msg="rebuilding site `date`" -if [ $# -eq 1 ] - then msg="$1" -fi -git commit -m "$msg" - -# Push source and build repos. -git push origin master - -# Come Back -cd .. -``` -7. `./deploy.sh "Your optional commit message"` to send changes to `.github.io` (careful, you may also want to commit changes on the `-hugo` repo). - -That's it! Your personal page is running at [http://username.github.io/](http://username.github.io/) (after up to 10 minutes delay). - -## Using a custom domain - -If you'd like to use a custom domain for your GitHub Pages site, create a file _static/CNAME_ with the domain name as its sole contents. -This will put the CNAME file to the root of the published site as required by GitHub Pages. - -Refer to the [official documentation](https://help.github.com/articles/using-a-custom-domain-with-github-pages/) for further information. - -## Conclusion - -Hopefully this tutorial helped you to get your website off its feet and out into the open! If you have any further questions, feel free to contact the community through the [discussion forum](/community/mailing-list/). diff --git a/content/tutorials/hosting-on-gitlab.md b/content/tutorials/hosting-on-gitlab.md deleted file mode 100644 index 0c213d1ee..000000000 --- a/content/tutorials/hosting-on-gitlab.md +++ /dev/null @@ -1,68 +0,0 @@ ---- -author: Riku-Pekka Silvola -lastmod: 2016-06-23 -date: 2016-06-23 -linktitle: Hosting on GitLab -toc: true -menu: - main: - parent: tutorials -next: /tutorials/how-to-contribute-to-hugo/ -prev: /tutorials/github-pages-blog -title: Hosting on GitLab Pages -weight: 10 ---- -# Continuous deployment with GitLab - -## Introduction - -In this tutorial, we will use [GitLab](https://gitlab.com/) to build, deploy, and host a [Hugo](https://gohugo.io/) site. With Hugo and GitLab, this is incredibly easy. - -It is assumed that you know how to use git for version control and have a GitLab account, and that you have gone through the [quickstart guide]({{< relref "overview/quickstart.md" >}}) and already have a Hugo site on your local machine. - - -## Create .gitlab-ci.yml - -```bash -cd your-hugo-site -``` - -In the root directory of your Hugo site, create a `.gitlab-ci.yml` file. The `.gitlab-ci.yml` configures the GitLab CI on how to build your page. Simply add the content below. - -```yml -image: publysher/hugo - -pages: - script: - - hugo - artifacts: - paths: - - public - only: - - master -``` - -## Push Hugo site to GitLab -Next up, create a new repository on GitLab. It is *not* necessary to set the repository public. In addition, you might want to add `/public` to your .gitignore file, as there is no need to push compiled assets to GitLab. - -```bash -# initialize new git repository -git init - -# add /public directory to our .gitignore file -echo "/public" >> .gitignore - -# commit and push code to master branch -git add . -git commit -m "Initial commit" -git remote add origin https://gitlab.com/YourUsername/your-hugo-site.git -git push -u origin master -``` - -## Wait for your page to be built -That's it! You can now follow the CI agent building your page at https://gitlab.com/YourUsername/your-hugo-site/pipelines. -After the build has passed, your new website is available at https://YourUsername.gitlab.io/your-hugo-site/ - -## Suggested next steps - -GitLab supports using custom CNAME's and TLS certificates, but this is out of the scope of this tutorial. For more details on GitLab Pages, see [https://about.gitlab.com/2016/04/07/gitlab-pages-setup/](https://about.gitlab.com/2016/04/07/gitlab-pages-setup/) diff --git a/content/tutorials/installing-on-mac.md b/content/tutorials/installing-on-mac.md deleted file mode 100644 index 12bf01e2b..000000000 --- a/content/tutorials/installing-on-mac.md +++ /dev/null @@ -1,240 +0,0 @@ ---- -author: "Michael Henderson" -lastmod: 2016-08-10 -date: 2015-02-22 -linktitle: Installing on Mac -toc: true -menu: - main: - parent: tutorials -next: /tutorials/installing-on-windows -prev: /tutorials/how-to-contribute-to-hugo/ -title: Installing on a Mac -weight: 10 ---- - -# Installing Hugo on a Mac - -This tutorial aims to be a complete guide to installing Hugo on your Mac computer. - -## Assumptions - -1. You know how to open a terminal window. -2. You're running a modern 64-bit Mac. -3. You will use `~/Sites` as the starting point for your site. - -## Pick Your Method - -There are three ways to install Hugo on your Mac computer: the `brew` utility, from the distribution, or from source. -There's no "best" way to do this. You should use the method that works best for your use case. - -There are pros and cons for each. - -1. `Brew` is the simplest and least work to maintain. The drawbacks - aren't severe. The default package will be for the most recent - release, so it will not have bug-fixes until the next release - (unless you install it with the `--HEAD` option). The release to - `brew` may lag a few days behind because it has to be coordinated - with another team. Still, I'd recommend `brew` if you want to work - from a stable, widely used source. It works well and is really easy - to update. - -2. Downloading the tarball and installing from it is also easy. You have to have a few more command line skills. Updates are easy, too. You just repeat the process with the new binary. This gives you the flexibility to have multiple versions on your computer. If you don't want to use `brew`, then the binary is a good choice. - -3. Compiling from source is the most work. The advantage is that you don't have to wait for a release to add features or bug fixes. The disadvantage is that you need to spend more time managing the setup. It's not a lot, but it's more than with the other two options. - -Since this is a "beginner" how-to, I'm going to cover the first two -options in detail and go over the third more quickly. - -## Brew - -### Step 1: Install `brew` if you haven't already - -Go to the `brew` website, http://brew.sh/, and follow the directions there. The most important step is: - -``` -ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" -``` - -When I did this, I had some problems with directory permissions. Searches on Google pointed me to pages that walked me through updating permissions on the `/usr/local` directory. Seemed scary, but it's worked well since. - -### Step 2: Run the `brew` command to install `hugo` - -```bash -$ brew install hugo -==> Downloading https://homebrew.bintray.com/bottles/hugo-0.21.sierra.bottle.tar.gz -######################################################################## 100,0% -==> Pouring hugo-0.21.sierra.bottle.tar.gz -==> Using the sandbox -==> Caveats -Bash completion has been installed to: - /usr/local/etc/bash_completion.d -==> Summary -🍺 /usr/local/Cellar/hugo/0.21: 32 files, 17.4MB -``` - -(Note: Replace `brew install hugo` with `brew install hugo --HEAD` -if you want the absolute latest version in development, -but beware — there might be bugs!) - -`Brew` should have updated your path to include Hugo. Confirm by opening a new terminal window and running a few commands: - -```bash -$ # show the location of the hugo executable -$ which hugo -/usr/local/bin/hugo - -$ # show the installed version -$ ls -l $( which hugo ) -lrwxr-xr-x 1 mdhender admin 30 Mar 28 22:19 /usr/local/bin/hugo -> ../Cellar/hugo/0.13_1/bin/hugo - -$ # verify that hugo runs correctly -$ hugo version -Hugo Static Site Generator v0.13 BuildDate: 2015-03-09T21:34:47-05:00 -``` - -### Step 3: You're Done - -You've installed Hugo. Now you need to set up your site. Read the -[Quickstart guide](/overview/quickstart/), explore the rest of the -documentation, and if you still have questions -[just ask!](https://discourse.gohugo.io/ "Discussion forum") - -## From Tarball - -### Step 1: Decide on the location - -When installing from the tarball, you have to decide if you're going to install the binary in `/usr/local/bin` or in your home directory. There are three camps on this: - -1. Install it in `/usr/local/bin` so that all the users on your system have access to it. This is a good idea because it's a fairly standard place for executables. The downside is that you may need elevated privileges to put software into that location. Also, if there are multiple users on your system, they will all run the same version. Sometimes this can be an issue if you want to try out a new release. - -2. Install it in `~/bin` so that only you can execute it. This is a good idea because it's easy to do, easy to maintain, and doesn't require elevated privileges. The downside is that only you can run Hugo. If there are other users on your site, they have to maintain their own copies. That can lead to people running different versions. Of course, this does make it easier for you to experiment with different releases. - -3. Install it in your `sites` directory. This is not a bad idea if you have only one site that you're building. It keeps every thing in a single place. If you want to try out new releases, you can just make a copy of the entire site, update the Hugo executable, and have it. - -All three locations will work for you. I'm going to document the second option, mostly because I'm comfortable with it. - -### Step 2: Download the Tarball - -1. Open in your browser. - -2. Find the current release by scrolling down and looking for the green tag that reads "Latest Release." - -3. Download the current tarball for the Mac. The name will be something like `hugo_X.Y_osx-64bit.tgz`, where `X.YY` is the release number. - -4. By default, the tarball will be saved to your `~/Downloads` directory. If you chose to use a different location, you'll need to change that in the following steps. - -### Step 3: Confirm your download - -Verify that the tarball wasn't corrupted during the download: - -``` -$ tar tvf ~/Downloads/hugo_X.Y_osx-64bit.tgz --rwxrwxrwx 0 0 0 0 Feb 22 04:02 hugo_X.Y_osx-64bit/hugo_X.Y_osx-64bit.tgz --rwxrwxrwx 0 0 0 0 Feb 22 03:24 hugo_X.Y_osx-64bit/README.md --rwxrwxrwx 0 0 0 0 Jan 30 18:48 hugo_X.Y_osx-64bit/LICENSE.md -``` - -The `.md` files are documentation. The other file is the executable. - -### Step 4: Install into your bin directory - -``` -$ # create the directory if needed -$ mkdir -p ~/bin - -$ # make it the working directory -$ cd ~/bin - -$ # extract the tarball -$ tar -xvzf ~/Downloads/hugo_X.Y_osx-64bit.tgz -Archive: hugo_X.Y_osx-64bit.tgz - x ./ - x ./hugo - x ./LICENSE.md - x ./README.md - -$ # verify that it runs -$ ./hugo version -Hugo Static Site Generator v0.13 BuildDate: 2015-02-22T04:02:30-06:00 -``` - -You may need to add your bin directory to your `PATH` variable. The `which` command will check for us. If it can find `hugo`, it will print the full path to it. Otherwise, it will not print anything. - -``` -$ # check if hugo is in the path -$ which hugo -/Users/USERNAME/bin/hugo -``` - -If `hugo` is not in your `PATH`, add it by updating your `~/.bash_profile` file. First, start up an editor: - -``` -$ nano ~/.bash_profile -``` - -Add a line to update your `PATH` variable: - -``` -export PATH=$PATH:$HOME/bin -``` - -Then save the file by pressing Control-X, then Y to save the file and return to the prompt. - -Close the terminal and then open a new terminal to pick up the changes to your profile. Verify by running the `which hugo` command again. - -### Step 5: You're Done - -You've installed Hugo. Now you need to set up your site. Read the -[Quickstart guide](/overview/quickstart/), explore the rest of the -documentation, and if you still have questions -[just ask!](https://discourse.gohugo.io/ "Discussion forum") - -## Building from Source - -If you want to compile Hugo yourself, you'll need -[Go](http://golang.org), which is also available from Homebrew: `brew -install go`. - -### Step 1: Get the Source - -If you want to compile a specific version, go to - and download the source code -for the version of your choice. If you want to compile Hugo with all -the latest changes (which might include bugs), clone the Hugo -repository: - -``` -git clone https://github.com/gohugoio/hugo -``` - -### Step 2: Compiling - -Make the directory containing the source your working directory, then -fetch Hugo's dependencies: - -``` -mkdir -p src/github.com/spf13 -ln -sf $(pwd) src/github.com/gohugoio/hugo - -# set the build path for Go -export GOPATH=$(pwd) - -go get -``` - -This will fetch the absolute latest version of the dependencies, so if -Hugo fails to build it may be because the author of a dependency -introduced a breaking change. - -Then compile: - -``` -go build -o hugo main.go -``` - -Then place the `hugo` executable somewhere in your `$PATH`. - -### Step 3: You're Done - -You probably know where to go from here. diff --git a/content/tutorials/installing-on-windows.md b/content/tutorials/installing-on-windows.md deleted file mode 100644 index d249571f6..000000000 --- a/content/tutorials/installing-on-windows.md +++ /dev/null @@ -1,123 +0,0 @@ ---- -author: "Michael Henderson" -lastmod: 2016-07-18 -date: 2015-03-30 -linktitle: Installing on Windows -toc: true -menu: - main: - parent: tutorials -next: /tutorials/mathjax -prev: /tutorials/installing-on-mac -title: Installing on Windows -weight: 10 ---- - -# Installing Hugo on Windows - -This tutorial aims to be a complete guide to installing Hugo on your Windows computer. - -## Assumptions - -1. We'll call your website `example.com` for the purpose of this tutorial. -2. You will use `C:\Hugo\Sites` as the starting point for your site. -3. You will use `C:\Hugo\bin` to store executable files. - -## Setup Your Directories - -You'll need a place to store the Hugo executable, your content (the files that you build), and the generated files (the HTML that Hugo builds for you). - -1. Open Windows Explorer. -2. Create a new folder: `C:\Hugo` (assuming you want Hugo on your C drive – it can go anywhere.) -3. Create a subfolder in the Hugo folder: `C:\Hugo\bin`. -4. Create another subfolder in Hugo: `C:\Hugo\Sites`. - -## Technical users - -1. Download the latest zipped Hugo executable from the [Hugo Releases](https://github.com/gohugoio/hugo/releases) page. -2. Extract all contents to your `..\Hugo\bin` folder. -3. The hugo executable will be named as `hugo_hugo-version_platform_arch.exe`. Rename that executable to `hugo.exe` for ease of use. -4. In PowerShell or your preferred CLI, add the `hugo.exe` executable to your PATH by navigating to `C:\Hugo\bin` (or the location of your hugo.exe file) and use the command `set PATH=%PATH%;C:\Hugo\bin`. If the `hugo` command does not work after a reboot, you may have to run the command prompt as administrator. - -## Less technical users - -1. Go the [Hugo Releases](https://github.com/gohugoio/hugo/releases) page. -2. The latest release is announced on top. Scroll to the bottom of the release announcement to see the downloads. They're all ZIP files. -3. Find the Windows files near the bottom (they're in alphabetical order, so Windows is last) – download either the 32-bit or 64-bit file depending on whether you have 32-bit or 64-bit Windows. (If you don't know, [see here](https://esupport.trendmicro.com/en-us/home/pages/technical-support/1038680.aspx).) -4. Move the ZIP file into your `C:\Hugo\bin` folder. -5. Double-click on the ZIP file and extract its contents. Be sure to extract the contents into the same `C:\Hugo\bin` folder – Windows will do this by default unless you tell it to extract somewhere else. -6. You should now have three new files: hugo executable (example: hugo_0.18_windows_amd64.exe), license.md, and readme.md. (you can delete the ZIP download now.). Rename that hugo executable (hugo_hugo-version_platform_arch.exe) to hugo.exe for ease of use. -7. Now add Hugo to your Windows PATH settings: - - ### For Windows 10 users: - - - Right click on the **Start** button. - - Click on **System**. - - Click on **Advanced System Settings** on the left. - - Click on the **Environment Variables...** button on the bottom. - - In the User variables section, find the row that starts with PATH (PATH will be all caps). - - Double-click on **PATH**. - - Click the **New...** button. - - Type in the folder where `hugo.exe` was extracted, which is `C:\Hugo\bin` if you went by the instructions above. *The PATH entry should be the folder where Hugo lives, not the binary.* Press Enter when you're done typing. - - Click OK at every window to exit. - - > Note that the path editor in Windows 10 was added in the large [November 2015 Update](https://blogs.windows.com/windowsexperience/2015/11/12/first-major-update-for-windows-10-available-today/). You'll need to have that or a later update installed for the above steps to work. You can see what Windows 10 build you have by clicking on the  Start button → Settings → System → About. See [here](http://www.howtogeek.com/236195/how-to-find-out-which-build-and-version-of-windows-10-you-have/) for more.) - - ### For Windows 7 and 8.x users: - - Windows 7 and 8.1 do not include the easy path editor included in Windows 10, so non-technical users on those platforms are advised to install a free third-party path editor like [Windows Environment Variables Editor](http://eveditor.com/) or [Path Editor](https://patheditor2.codeplex.com/). - -## Verify the executable - -Run a few commands to verify that the executable is ready to run, and then build a sample site to get started. - -1. Open a command prompt window. - -2. At the prompt, type `hugo help` and press the Enter key. You should see output that starts with: - - {{< nohighlight >}}hugo is the main command, used to build your Hugo site. - -Hugo is a Fast and Flexible Static Site Generator -built with love by spf13 and friends in Go. - -Complete documentation is available at http://gohugo.io/. -{{< /nohighlight >}} - - If you do, then the installation is complete. If you don't, double-check the path that you placed the `hugo.exe` file in and that you typed that path correctly when you added it to your PATH variable. If you're still not getting the output, post a note on the Hugo discussion list (in the `Support` topic) with your command and the output. - -3. At the prompt, change your directory to the `Sites` directory. - - {{< nohighlight >}}C:\Program Files> cd C:\Hugo\Sites -C:\Hugo\Sites> -{{< /nohighlight >}} - -4. Run the command to generate a new site. I'm using `example.com` as the name of the site. - - {{< nohighlight >}}C:\Hugo\Sites> hugo new site example.com -{{< /nohighlight >}} - -5. You should now have a directory at `C:\Hugo\Sites\example.com`. Change into that directory and list the contents. You should get output similar to the following: - - {{< nohighlight >}}C:\Hugo\Sites>cd example.com -C:\Hugo\Sites\example.com>dir - Directory of C:\hugo\sites\example.com -  -04/13/2015 10:44 PM <DIR> . -04/13/2015 10:44 PM <DIR> .. -04/13/2015 10:44 PM <DIR> archetypes -04/13/2015 10:44 PM 83 config.toml -04/13/2015 10:44 PM <DIR> content -04/13/2015 10:44 PM <DIR> data -04/13/2015 10:44 PM <DIR> layouts -04/13/2015 10:44 PM <DIR> static - 1 File(s) 83 bytes - 7 Dir(s) 6,273,331,200 bytes free -{{< /nohighlight >}} - -You now have Hugo installed and a site to work with. You need to add a layout (or theme), then create some content. Go to http://gohugo.io/overview/quickstart/ for steps on doing that. - -## Troubleshooting - -@dhersam has created a nice video on common issues: - -{{< youtube c8fJIRNChmU >}} diff --git a/content/tutorials/mathjax.md b/content/tutorials/mathjax.md deleted file mode 100644 index e8d896354..000000000 --- a/content/tutorials/mathjax.md +++ /dev/null @@ -1,84 +0,0 @@ ---- -author: Spencer Lyon -lastmod: 2015-05-22 -date: 2014-03-20 -menu: - main: - parent: tutorials -next: /tutorials/migrate-from-jekyll -prev: /tutorials/installing-on-windows -title: MathJax Support -toc: true -weight: 10 ---- - -## What is MathJax? - -[MathJax](http://www.mathjax.org/) is a JavaScript library that allows the display of mathematical expressions described via a LaTeX-style syntax in the HTML (or Markdown) source of a web page. As it is a pure a JavaScript library, getting it to work within Hugo is fairly straightforward, but does have some oddities that will be discussed here. - -This is not an introduction into actually using MathJax to render typeset mathematics on your website. Instead, this page is a collection of tips and hints for one way to get MathJax working on a website built with Hugo. - -## Enabling MathJax - -The first step is to enable MathJax on pages that you would like to have typeset math. There are multiple ways to do this (adventurous readers can consult the [Loading and Configuring](http://docs.mathjax.org/en/latest/configuration.html) section of the MathJax documentation for additional methods of including MathJax), but the easiest way is to use [the officially recommended secure CDN](https://cdnjs.com/) by including the following HTML snippet in the source of a page: - - - -One way to ensure that this code is included in all pages is to put it in one of the templates that live in the `layouts/partials/` directory. For example, I have included this in the bottom of my template `footer.html` because I know that the footer will be included in every page of my website. - -### Options and Features - -MathJax is a stable open-source library with many features. I encourage the interested reader to view the [MathJax Documentation](http://docs.mathjax.org/en/latest/index.html), specifically the sections on [Basic Usage](http://docs.mathjax.org/en/latest/index.html#basic-usage) and [MathJax Configuration Options](http://docs.mathjax.org/en/latest/index.html#mathjax-configuration-options). - -## Issues with Markdown - -After enabling MathJax, any math entered in-between proper markers (see documentation) will be processed and typeset in the web page. One issue that comes up, however, with Markdown is that the underscore character (`_`) is interpreted by Markdown as a way to wrap text in `emph` blocks while LaTeX (MathJax) interprets the underscore as a way to create a subscript. This "double speak" of the underscore can result in some unexpected and unwanted behavior. - -### Solution - -There are multiple ways to remedy this problem. One solution is to simply escape each underscore in your math code by entering `\_` instead of `_`. This can become quite tedious if the equations you are entering are full of subscripts. - -Another option is to tell Markdown to treat the MathJax code as verbatim code and not process it. One way to do this is to wrap the math expression inside a `
    ` `
    ` block. Markdown would ignore these sections and they would get passed directly on to MathJax and processed correctly. This works great for display style mathematics, but for inline math expressions the line break induced by the `
    ` is not acceptable. The syntax for instructing Markdown to treat inline text as verbatim is by wrapping it in backticks (`` ` ``). You might have noticed, however, that the text included in between backticks is rendered differently than standard text (on this site these are items highlighted in red). To get around this problem, we could create a new CSS entry that would apply standard styling to all inline verbatim text that includes MathJax code. Below I will show the HTML and CSS source that would accomplish this (note this solution was adapted from [this blog post](http://doswa.com/2011/07/20/mathjax-in-markdown.html)---all credit goes to the original author). - - - - - -As before, this content should be included in the HTML source of each page that will be using MathJax. The next code snippet contains the CSS that is used to have verbatim MathJax blocks render with the same font style as the body of the page. - - - code.has-jax {font: inherit; - font-size: 100%; - background: inherit; - border: inherit; - color: #515151;} - -In the CSS snippet, notice the line `color: #515151;`. `#515151` is the value assigned to the `color` attribute of the `body` class in my CSS. In order for the equations to fit in with the body of a web page, this value should be the same as the color of the body. - -### Usage - -With this setup, everything is in place for a natural usage of MathJax on pages generated using Hugo. In order to include inline mathematics, just put LaTeX code in between `` `$ TeX Code $` `` or `` `\( TeX Code \)` ``. To include display style mathematics, just put LaTeX code in between `
    $$TeX Code$$
    `. All the math will be properly typeset and displayed within your Hugo generated web page! diff --git a/content/tutorials/migrate-from-jekyll.md b/content/tutorials/migrate-from-jekyll.md deleted file mode 100644 index 0fd5d4af7..000000000 --- a/content/tutorials/migrate-from-jekyll.md +++ /dev/null @@ -1,162 +0,0 @@ ---- -lastmod: 2015-12-24 -date: 2014-03-10 -linktitle: Migrating from Jekyll -toc: true -menu: - main: - parent: tutorials -prev: /tutorials/mathjax -next: /tutorials/create-a-multilingual-site -title: Migrate to Hugo from Jekyll -weight: 10 ---- - -**Note:** Hugo 0.15 comes with a `hugo import jekyll` command, see [import from Jekyll](/commands/hugo_import_jekyll/). -## Move static content to `static` -Jekyll has a rule that any directory not starting with `_` will be copied as-is to the `_site` output. Hugo keeps all static content under `static`. You should therefore move it all there. -With Jekyll, something that looked like - - ▾ / - ▾ images/ - logo.png - -should become - - ▾ / - ▾ static/ - ▾ images/ - logo.png - -Additionally, you'll want any files that should reside at the root (such as `CNAME`) to be moved to `static`. - -## Create your Hugo configuration file -Hugo can read your configuration as JSON, YAML or TOML. Hugo supports parameters custom configuration too. Refer to the [Hugo configuration documentation](/overview/configuration/) for details. - -## Set your configuration publish folder to `_site` -The default is for Jekyll to publish to `_site` and for Hugo to publish to `public`. If, like me, you have [`_site` mapped to a git submodule on the `gh-pages` branch](http://blog.blindgaenger.net/generate_github_pages_in_a_submodule.html), you'll want to do one of two alternatives: - -1. Change your submodule to point to map `gh-pages` to public instead of `_site` (recommended). - - git submodule deinit _site - git rm _site - git submodule add -b gh-pages git@github.com:your-username/your-repo.git public - -2. Or, change the Hugo configuration to use `_site` instead of `public`. - - { - .. - "publishDir": "_site", - .. - } - -## Convert Jekyll templates to Hugo templates -That's the bulk of the work right here. The documentation is your friend. You should refer to [Jekyll's template documentation](http://jekyllrb.com/docs/templates/) if you need to refresh your memory on how you built your blog and [Hugo's template](/layout/templates/) to learn Hugo's way. - -As a single reference data point, converting my templates for [heyitsalex.net](http://heyitsalex.net/) took me no more than a few hours. - -## Convert Jekyll plugins to Hugo shortcodes -Jekyll has [plugins](http://jekyllrb.com/docs/plugins/); Hugo has [shortcodes](/doc/shortcodes/). It's fairly trivial to do a port. - -### Implementation -As an example, I was using a custom [`image_tag`](https://github.com/alexandre-normand/alexandre-normand/blob/74bb12036a71334fdb7dba84e073382fc06908ec/_plugins/image_tag.rb) plugin to generate figures with caption when running Jekyll. As I read about shortcodes, I found Hugo had a nice built-in shortcode that does exactly the same thing. - -Jekyll's plugin: - -```ruby -module Jekyll - class ImageTag < Liquid::Tag - @url = nil - @caption = nil - @class = nil - @link = nil - // Patterns - IMAGE_URL_WITH_CLASS_AND_CAPTION = - IMAGE_URL_WITH_CLASS_AND_CAPTION_AND_LINK = /(\w+)(\s+)((https?:\/\/|\/)(\S+))(\s+)"(.*?)"(\s+)->((https?:\/\/|\/)(\S+))(\s*)/i - IMAGE_URL_WITH_CAPTION = /((https?:\/\/|\/)(\S+))(\s+)"(.*?)"/i - IMAGE_URL_WITH_CLASS = /(\w+)(\s+)((https?:\/\/|\/)(\S+))/i - IMAGE_URL = /((https?:\/\/|\/)(\S+))/i - def initialize(tag_name, markup, tokens) - super - if markup =~ IMAGE_URL_WITH_CLASS_AND_CAPTION_AND_LINK - @class = $1 - @url = $3 - @caption = $7 - @link = $9 - elsif markup =~ IMAGE_URL_WITH_CLASS_AND_CAPTION - @class = $1 - @url = $3 - @caption = $7 - elsif markup =~ IMAGE_URL_WITH_CAPTION - @url = $1 - @caption = $5 - elsif markup =~ IMAGE_URL_WITH_CLASS - @class = $1 - @url = $3 - elsif markup =~ IMAGE_URL - @url = $1 - end - end - def render(context) - if @class - source = "
    " - else - source = "
    " - end - if @link - source += "" - end - source += "" - if @link - source += "" - end - source += "
    #{@caption}
    " if @caption - source += "
    " - source - end - end -end -Liquid::Template.register_tag('image', Jekyll::ImageTag) -``` - -is written as this Hugo shortcode: - - -
    - {{ with .Get "link"}}{{ end }} - - {{ if .Get "link"}}{{ end }} - {{ if or (or (.Get "title") (.Get "caption")) (.Get "attr")}} -
    {{ if isset .Params "title" }} - {{ .Get "title" }}{{ end }} - {{ if or (.Get "caption") (.Get "attr")}}

    - {{ .Get "caption" }} - {{ with .Get "attrlink"}} {{ end }} - {{ .Get "attr" }} - {{ if .Get "attrlink"}} {{ end }} -

    {{ end }} -
    - {{ end }} -
    - - -### Usage -I simply changed: - - {% image full http://farm5.staticflickr.com/4136/4829260124_57712e570a_o_d.jpg "One of my favorite touristy-type photos. I secretly waited for the good light while we were "having fun" and took this. Only regret: a stupid pole in the top-left corner of the frame I had to clumsily get rid of at post-processing." ->http://www.flickr.com/photos/alexnormand/4829260124/in/set-72157624547713078/ %} - -to this (this example uses a slightly extended version named `fig`, different than the built-in `figure`): - - {{%/* fig class="full" src="http://farm5.staticflickr.com/4136/4829260124_57712e570a_o_d.jpg" title="One of my favorite touristy-type photos. I secretly waited for the good light while we were having fun and took this. Only regret: a stupid pole in the top-left corner of the frame I had to clumsily get rid of at post-processing." link="http://www.flickr.com/photos/alexnormand/4829260124/in/set-72157624547713078/" */%}} - -As a bonus, the shortcode named parameters are, arguably, more readable. - -## Finishing touches -### Fix content -Depending on the amount of customization that was done with each post with Jekyll, this step will require more or less effort. There are no hard and fast rules here except that `hugo server` is your friend. Test your changes and fix errors as needed. - -### Clean up -You'll want to remove the Jekyll configuration at this point. If you have anything else that isn't used, delete it. - -## A practical example in a diff -[Hey, it's Alex](http://heyitsalex.net/) was migrated in less than a _father-with-kids day_ from Jekyll to Hugo. You can see all the changes (and screw-ups) by looking at this [diff](https://github.com/alexandre-normand/alexandre-normand/compare/869d69435bd2665c3fbf5b5c78d4c22759d7613a...b7f6605b1265e83b4b81495423294208cc74d610). diff --git a/content/variables/_index.md b/content/variables/_index.md new file mode 100644 index 000000000..8e53af553 --- /dev/null +++ b/content/variables/_index.md @@ -0,0 +1,23 @@ +--- +title: Variables and Params +linktitle: Variables Overview +description: Page-, file-, taxonomy-, and site-level variables and parameters available in templates. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [variables and params] +#tags: [variables,params,values,globals] +draft: false +menu: + docs: + parent: "variables" + weight: 1 +weight: 01 #rem +sections_weight: 01 +aliases: [/templates/variables/] +toc: false +--- + +Hugo's templates are context aware and make a large number of values available to you as you're creating views for your website. + +[Go templates]: /templates/introduction/ "Understand context in Go templates by learning the language's fundamental templating functions." diff --git a/content/variables/files.md b/content/variables/files.md new file mode 100644 index 000000000..dd6c6efc2 --- /dev/null +++ b/content/variables/files.md @@ -0,0 +1,48 @@ +--- +title: File Variables +linktitle: +description: "You can access filesystem-related data for a content file in the `.File` variable." +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [variables and params] +#tags: [files] +draft: false +menu: + docs: + parent: "variables" + weight: 40 +weight: 40 +sections_weight: 40 +aliases: [/variables/file-variables/] +toc: false +--- + +{{% note "Rendering Local Files" %}} +For information on creating shortcodes and templates that tap into Hugo's file-related feature set, see [Local File Templates](/templates/files/). +{{% /note %}} + +The `.File` object contains the following fields: + +`.File.Path` +: the original relative path of the page (e.g., `content/posts/foo.en.md`) + +`.File.LogicalName` +: the name of the content file that represents a page (e.g., `foo.en.md`) + +`.File.TranslationBaseName` +: the filename without extension or optional language identifier (e.g., `foo`) + +`.File.BaseFileName` +: the filename without extension (e.g., `foo.en`) + +`.File.Ext` +: the file extension of the content file (e.g., `md`); this can also be called using `.File.Extension` as well. Note that it is *only* the extension without `.`. + +`.File.Lang` +: the language associated with the given file if Hugo's [Multilingual features][multilingual] are enabled (e.g., `en`) + +`.File.Dir` +: given the path `content/posts/dir1/dir2/`, the relative directory path of the content file will be returned (e.g., `posts/dir1/dir2/`) + +[Multilingual]: /content-management/multilingual/ \ No newline at end of file diff --git a/content/variables/git.md b/content/variables/git.md new file mode 100644 index 000000000..97ecb3c61 --- /dev/null +++ b/content/variables/git.md @@ -0,0 +1,54 @@ +--- +title: Git Info Variables +linktitle: Git Variables +description: Get the last Git revision information for every content file. +date: 2017-03-12 +publishdate: 2017-03-12 +lastmod: 2017-03-12 +categories: [variables and params] +#tags: [git] +draft: false +menu: + docs: + parent: "variables" + weight: 70 +weight: 70 +sections_weight: 70 +aliases: [/extras/gitinfo/] +toc: false +wip: false +--- + +{{% note "`.GitInfo` Performance Considerations" %}} +Hugo's Git integrations should be fairly performant but *can* increase your build time. This will depend on the size of your Git history. +{{% /note %}} + +## `.GitInfo` Prerequisites + +1. The Hugo site must be in a Git-enabled directory. +2. The Git executable must be installed and in your system `PATH`. +3. The `.GitInfo` feature must be enabled in your Hugo project by passing `--enableGitInfo` flag on the command line or by setting `enableGitInfo` to `true` in your [site's configuration file][configuration]. + +## The `.GitInfo` Object + +The `GitInfo` object contains the following fields: + +`.AbbreviatedHash` +: the abbreviated commit hash (e.g., `866cbcc`) + +`.AuthorName` +: the author's name, respecting `.mailmap` + +`.AuthorEmail` +: the author's email address, respecting `.mailmap` + +`.AuthorDate` +: the author date + +`.Hash` +: the commit hash (e.g., `866cbccdab588b9908887ffd3b4f2667e94090c3`) + +`.Subject` +: commit message subject (e.g., `tpl: Add custom index function`) + +[configuration]: /getting-started/configuration/ diff --git a/content/variables/hugo.md b/content/variables/hugo.md new file mode 100644 index 000000000..da83a91f7 --- /dev/null +++ b/content/variables/hugo.md @@ -0,0 +1,39 @@ +--- +title: Hugo-specific Variables +linktitle: Hugo Variables +description: The `.Hugo` variable provides easy access to Hugo-related data. +date: 2017-03-12 +publishdate: 2017-03-12 +lastmod: 2017-03-12 +categories: [variables and params] +#tags: [hugo,generator] +draft: false +menu: + docs: + parent: "variables" + weight: 60 +weight: 60 +sections_weight: 60 +aliases: [] +toc: false +wip: false +--- + +It contains the following fields: + +`.Hugo.Generator` +: `` tag for the version of Hugo that generated the site. `.Hugo.Generator` outputs a *complete* HTML tag; e.g. `` + +`.Hugo.Version` +: the current version of the Hugo binary you are using e.g. `0.13-DEV`
    + +`.Hugo.CommitHash` +: the git commit hash of the current Hugo binary e.g. `0e8bed9ccffba0df554728b46c5bbf6d78ae5247` + +`.Hugo.BuildDate` +: the compile date of the current Hugo binary formatted with RFC 3339 e.g. `2002-10-02T10:00:00-05:00`
    + +{{% note "Use the Hugo Generator Tag" %}} +We highly recommend using `.Hugo.Generator` in your website's ``. `.Hugo.Generator` is included by default in all themes hosted on [themes.gohugo.io](http://themes.gohugo.io). The generator tag allows the Hugo team to track the usage and popularity of Hugo. +{{% /note %}} + diff --git a/content/variables/menus.md b/content/variables/menus.md new file mode 100644 index 000000000..3f3f8fb33 --- /dev/null +++ b/content/variables/menus.md @@ -0,0 +1,50 @@ +--- +title: Menu Variables +linktitle: Menu Variables +description: A menu entry in a menu template has specific variables and functions to make menu management easier. +date: 2017-03-12 +publishdate: 2017-03-12 +lastmod: 2017-03-12 +categories: [variables and params] +#tags: [menus] +draft: false +menu: + docs: + parent: "variables" + weight: 50 +weight: 50 +sections_weight: 50 +aliases: [/variables/menu/] +toc: false +--- + +The [menu template][] has the following properties: + +`.URL` +: string + +`.Name` +: string + +`.Menu` +: string + +`.Identifier` +: string + +`.Pre` +: template.HTML + +`.Post` +: template.HTML + +`.Weight` +: int + +`.Parent` +: string + +`.Children` +: Menu + +[menu template]: /templates/menu-templates/ \ No newline at end of file diff --git a/content/variables/page.md b/content/variables/page.md new file mode 100644 index 000000000..78c811b9d --- /dev/null +++ b/content/variables/page.md @@ -0,0 +1,272 @@ +--- +title: Page Variables +linktitle: +description: Page-level variables are defined in a content file's front matter, derived from the content's file location, or extracted from the content body itself. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [variables and params] +#tags: [pages] +draft: false +menu: + docs: + parent: "variables" + weight: 20 +weight: 20 +sections_weight: 20 +aliases: [/variables/page/] +toc: true +--- + +The following is a list of page-level variables. Many of these will be defined in the front matter, derived from file location, or extracted from the content itself. + +{{% note "`.Scratch`" %}} +See [`.Scratch`](/functions/scratch/) for page-scoped, writable variables. +{{% /note %}} + +## Page Variables + +`.AlternativeOutputFormats` +: contains all alternative formats for a given page; this variable is especially useful `link rel` list in your site's ``. (See [Output Formats](/templates/output-formats/).) + +`.Content` +: the content itself, defined below the front matter. + +`.Data` +: the data specific to this type of page. + +`.Date` +: the date associated with the page; `.Date` pulls from the `date` field in a content's front matter. See also `.ExpiryDate`, `.PublishDate`, and `.Lastmod`. + +`.Description` +: the description for the page. + +`.Draft` +: a boolean, `true` if the content is marked as a draft in the front matter. + +`.ExpiryDate` +: the date on which the content is scheduled to expire; `.ExpiryDate` pulls from the `expirydate` field in a content's front matter. See also `.PublishDate`, `.Date`, and `.Lastmod`. + +`.FuzzyWordCount` +: the approximate number of words in the content. + +`.Hugo` +: see [Hugo Variables](/variables/hugo/). + +`.IsHome` +: `true` in the context of the [homepage](/templates/homepage/). + +`.IsNode` +: always `false` for regular content pages. + +`.IsPage` +: always `true` for regular content pages. + +`.IsTranslated` +: `true` if there are translations to display. + +`.Keywords` +: the meta keywords for the content. + +`.Kind` +: the page's *kind*. Possible return values are `page`, `home`, `section`, `taxonomy`, or `taxonomyTerm`. Note that there are also `RSS`, `sitemap`, `robotsTXT`, and `404` kinds, but these are only available during the rendering of each of these respective page's kind and therefore *not* available in any of the `Pages` collections. + +`.Lang` +: language taken from the language extension notation. + +`.Language` +: a language object that points to the language's definition in the site +`config`. + +`.Lastmod` +: the date the content was last modified; `.Lastmod` pulls from the `lastmod` field in a content's front matter. If `lastmod` is not set, Hugo will default to the `date` field. See also `.ExpiryDate`, `.Date`, and `.PublishDate`. + +`.LinkTitle` +: access when creating links to the content. If set, Hugo will use the `linktitle` from the front matter before `title`. + +`.Next` +: pointer to the following content (based on the `publishdate` field in front matter). + +`.NextInSection` +: pointer to the following content within the same section (based on `publishdate` field in front matter). + +`.OutputFormats` +: contains all formats, including the current format, for a given page. Can be combined the with [`.Get` function](/functions/get/) to grab a specific format. (See [Output Formats](/templates/output-formats/).) + +`.Pages` +: a collection of associated pages. This value will be `nil` for regular content pages. `.Pages` is an alias for `.Data.Pages`. + +`.Permalink` +: the Permanent link for this page; see [Permalinks](/content-management/urls/) + +`.Plain` +: the Page content stripped of HTML tags and presented as a string. + +`.PlainWords` +: the Page content stripped of HTML as a `[]string` using Go's [`strings.Fields`](https://golang.org/pkg/strings/#Fields) to split `.Plain` into a slice. + +`.Prev` +: Pointer to the previous content (based on `publishdate` in front matter). + +`.PrevInSection` +: Pointer to the previous content within the same section (based on `publishdate` in front matter). For example, `{{if .PrevInSection}}{{.PrevInSection.Permalink}}{{end}}`. + +`.PublishDate` +: the date on which the content was or will be published; `.Publishdate` pulls from the `publishdate` field in a content's front matter. See also `.ExpiryDate`, `.Date`, and `.Lastmod`. + +`.RSSLink` +: link to the taxonomies' RSS link. + +`.RawContent` +: raw markdown content without the front matter. Useful with [remarkjs.com]( +http://remarkjs.com) + +`.ReadingTime` +: the estimated time, in minutes, it takes to read the content. + +`.Ref` +: returns the permalink for a given reference (e.g., `.Ref "sample.md"`). `.Ref` does *not* handle in-page fragments correctly. See [Cross References](/content-management/cross-references/). + +`.RelPermalink` +: the relative permanent link for this page. + +`.RelRef` +: returns the relative permalink for a given reference (e.g., `RelRef +"sample.md"`). `.RelRef` does *not* handle in-page fragments correctly. See [Cross References](/content-management/cross-references/). + +`.Section` +: the [section](/content-management/sections/) this content belongs to. + +`.Site` +: see [Site Variables](/variables/site/). + +`.Summary` +: a generated summary of the content for easily showing a snippet in a summary view. The breakpoint can be set manually by inserting <!--more--> at the appropriate place in the content page. See [Content Summaries](/content-management/summaries/) for more details. + +`.TableOfContents` +: the rendered [table of contents](/content-management/toc/) for the page. + +`.Title` +: the title for this page. + +`.Translations` +: a list of translated versions of the current page. See [Multilingual Mode](/content-management/multilingual/) for more information. + +`.Truncated` +: a boolean, `true` if the `.Summary` is truncated. Useful for showing a "Read more..." link only when necessary. See [Summaries](/content-management/summaries/) for more information. + +`.Type` +: the [content type](/content-management/types/) of the content (e.g., `post`). + +`.URL` +: the URL for the page relative to the web root. Note that a `url` set directly in front matter overrides the default relative URL for the rendered page. + +`.UniqueID` +: the MD5-checksum of the content file's path. + +`.Weight` +: assigned weight (in the front matter) to this content, used in sorting. + +`.WordCount` +: the number of words in the content. + +## Page-level Params + +Any other value defined in the front matter in a content file, including taxonomies, will be made available as part of the `.Params` variable. + +```yaml +--- +title: My First Post +date: date: 2017-02-20T15:26:23-06:00 +categories: [one] +#tags: [two,three,four] +``` + +With the above front matter, the `tags` and `categories` taxonomies are accessible via the following: + +* `.Params.tags` +* `.Params.categories` + +{{% note "Casing of Params" %}} +Page-level `.Params` are *only* accessible in lowercase. +{{% /note %}} + +The `.Params` variable is particularly useful for the introduction of user-defined front matter fields in content files. For example, a Hugo website on book reviews could have the following front matter in `/content/review/book01.md`: + +```yaml +--- +... +affiliatelink: "http://www.my-book-link.here" +recommendedby: "My Mother" +... +--- +``` + +These fields would then be accessible to the `/themes/yourtheme/layouts/review/single.html` template through `.Params.affiliatelink` and `.Params.recommendedby`, respectively. + +Two common situations where this type of front matter field could be introduced is as a value of a certain attribute like `href=""` or by itself to be displayed as text to the website's visitors. + +{{% code file="/themes/yourtheme/layouts/review/single.html" %}} +```html +

    Buy this book

    +

    It was recommended by {{ .Params.recommendedby }}.

    +``` +{{% /code %}} + +This template would render as follows, assuming you've set [`uglyURLs`](/content-management/urls/) to `false` in your [site `config`](/getting-started/configuration/): + +{{% output file="yourbaseurl/review/book01/index.html" %}} +```html +

    Buy this book

    +

    It was recommended by my Mother.

    +``` +{{% /output %}} + +{{% note %}} +See [Archetypes](/content-management/archetypes/) for consistency of `Params` across pieces of content. +{{% /note %}} + +### The `.Param` Method + +In Hugo, you can declare params in individual pages and globally for your entire website. A common use case is to have a general value for the site param and a more specific value for some of the pages (i.e., a header image): + +```golang +{{ $.Param "header_image" }} +``` + +The `.Param` method provides a way to resolve a single value according to it's definition in a page parameter (i.e. in the content's front matter) or a site parameter (i.e., in your `config`). + +### Access Nested Fields in Front Matter + +When front matter contains nested fields like the following: + +```yaml +--- +author: + given_name: John + family_name: Feminella + display_name: John Feminella +--- +``` +`.Param` can access these fields by concatenating the field names together with a dot: + +``` +{{ $.Param "author.display_name" }} +``` + +If your front matter contains a top-level key that is ambiguous with a nested key, as in the following case: + +``` +--- +favorites.flavor: vanilla +favorites: + flavor: chocolate +--- +``` + +The top-level key will be preferred. Therefore, the following method, when applied to the previous example, will print `vanilla` and not `chocolate`: + +```golang +{{ $.Param "favorites.flavor" }} +=> vanilla +``` diff --git a/content/variables/shortcodes.md b/content/variables/shortcodes.md new file mode 100644 index 000000000..c3a3f920b --- /dev/null +++ b/content/variables/shortcodes.md @@ -0,0 +1,36 @@ +--- +title: Shortcode Variables +linktitle: Shortcode Variables +description: Shortcodes can access page variables and also have their own specific built-in variables. +date: 2017-03-12 +publishdate: 2017-03-12 +lastmod: 2017-03-12 +categories: [variables and params] +#tags: [shortcodes] +draft: false +menu: + docs: + parent: "variables" + weight: 20 +weight: 20 +sections_weight: 20 +aliases: [] +toc: false +--- + +[Shortcodes][shortcodes] have access to parameters delimited in the shortcode declaration via [`.Get`][getfunction], page- and site-level variables, and also the following shortcode-specific fields: + +`.Parent` +: provides access to the parent shortcode context in nested shortcodes. This can be very useful for inheritance of common shortcode parameters from the root. + +`.IsNamedParams` +: boolean that returns `true` when the shortcode in question uses [named rather than positional parameters][shortcodes] + +`.Inner` +: represents the content between the opening and closing shortcode tags when a [closing shortcode][markdownshortcode] is used + +[getfunction]: /functions/get/ +[markdownshortcode]: /content-management/shortcodes/#shortcodes-with-markdown +[shortcodes]: /templates/shortcode-templates/ + + diff --git a/content/variables/site.md b/content/variables/site.md new file mode 100644 index 000000000..d037cb065 --- /dev/null +++ b/content/variables/site.md @@ -0,0 +1,127 @@ +--- +title: Site Variables +linktitle: Site Variables +description: Many, but not all, site-wide variables are defined in your site's configuration. However, Hugo provides a number of built-in variables for convenient access to global values in your templates. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [variables and params] +#tags: [global,site] +draft: false +menu: + docs: + parent: "variables" + weight: 10 +weight: 10 +sections_weight: 10 +aliases: [/variables/site-variables/] +toc: true +--- + +The following is a list of site-level (aka "global") variables. Many of these variables are defined in your site's [configuration file][config], whereas others are built into Hugo's core for convenient usage in your templates. + +## Site Variables List + +`.Site.AllPages` +: array of all pages, regardless of their translation. + +`.Site.Author` +: a map of the authors as defined in the site configuration. + +`.Site.BaseURL` +: the base URL for the site as defined in the site configuration. + +`.Site.BuildDrafts` +: a boolean (default: `false`) to indicate whether to build drafts as defined in the site configuration. + +`.Site.Copyright` +: a string representing the copyright of your website as defined in the site configuration. + +`.Site.Data` +: custom data, see [Data Templates](/templates/data-templates/). + +`.Site.DisqusShortname` +: a string representing the shortname of the Disqus shortcode as defined in the site configuration. + +`.Site.Files` +: all source files for the Hugo website. + +`.Site.GoogleAnalytics` +: a string representing your tracking code for Google Analytics as defined in the site configuration. + +`.Site.IsMultiLingual` +: whether there are more than one language in this site. See [Multilingual](/content-management/multilingual/) for more information. + +`.Site.Language.Lang` +: the language code of the current locale (e.g., `en`). + +`.Site.Language.LanguageName` +: the full language name (e.g. `English`). + +`.Site.Language.Weight` +: the weight that defines the order in the `.Site.Languages` list. + +`.Site.Language` +: indicates the language currently being used to render the website. This object's attributes are set in site configurations' language definition. + +`.Site.LanguageCode` +: a string representing the language as defined in the site configuration. This is mostly used to populate the RSS feeds with the right language code. + +`.Site.LanguagePrefix` +: this can be used to prefix URLs to point to the correct language. It will even work when only one defined language. See also the functions [absLangURL](/functions/abslangurl/) and [relLangURL](/functions/rellangurl). + +`.Site.Languages` +: an ordered list (ordered by defined weight) of languages. + +`.Site.LastChange` +: a string representing the date/time of the most recent change to your site. This string is based on the [`date` variable in the front matter](/content-management/front-matter) of your content pages. + +`.Site.Menus` +: all of the menus in the site. + +`.Site.Pages` +: array of all content ordered by Date with the newest first. This array contains only the pages in the current language. + +`.Site.Permalinks` +: a string to override the default [permalink](/content-management/urls/) format as defined in the site configuration. + +`.Site.RegularPages` +: a shortcut to the *regular* page collection. `.Site.RegularPages` is equivalent to `where .Site.Pages "Kind" "page"`. + +`.Site.RSSLink` +: the URL for the site RSS. + +`.Site.Sections` +: top-level directories of the site. + +`.Site.Taxonomies` +: the [taxonomies](/taxonomies/usage/) for the entire site. Replaces the now-obsolete `.Site.Indexes` since v0.11. Also see section [Taxonomies elsewhere](#taxonomies-elsewhere). + +`.Site.Title` +: a string representing the title of the site. + +## The `.Site.Params` Variable + +`.Site.Params` is a container holding the values from the `params` section of your site configuration. + +### Example: `.Site.Params` + +The following `config.toml` defines a site-wide param for `description`: + +```toml +baseURL = "http://yoursite.example.com/" + +[params] + description = "Tesla's Awesome Hugo Site" + author = "Nikola Tesla" +``` + +You can use `.Site.Params` in a [partial template](/templates/partials/) to call the default site description: + +{{% code file="layouts/partials/head.html" %}} +```html + +``` +{{% /code %}} + +[config]: /getting-started/configuration/ \ No newline at end of file diff --git a/content/variables/sitemap.md b/content/variables/sitemap.md new file mode 100644 index 000000000..da4c12e74 --- /dev/null +++ b/content/variables/sitemap.md @@ -0,0 +1,32 @@ +--- +title: Sitemap Variables +linktitle: Sitemap Variables +description: +date: 2017-03-12 +publishdate: 2017-03-12 +lastmod: 2017-03-12 +categories: [variables and params] +#tags: [sitemap] +draft: false +menu: + docs: + parent: "variables" + weight: 80 +weight: 80 +sections_weight: 80 +aliases: [] +toc: false +--- + +A sitemap is a `Page` and therefore has all the [page variables][pagevars] available to use sitemap templates. They also have the following sitemap-specific variables available to them: + +`.Sitemap.ChangeFreq` +: the page change frequency + +`.Sitemap.Priority` +: the priority of the page + +`.Sitemap.Filename` +: the sitemap filename + +[pagevars]: /variables/page/ \ No newline at end of file diff --git a/content/variables/taxonomy.md b/content/variables/taxonomy.md new file mode 100644 index 000000000..7ab95d261 --- /dev/null +++ b/content/variables/taxonomy.md @@ -0,0 +1,86 @@ +--- +title: Taxonomy Variables +linktitle: +description: Taxonomy pages are of type `Page` and have all page-, site-, and list-level variables available to them. However, taxonomy terms templates have additional variables available to their templates. +date: 2017-02-01 +publishdate: 2017-02-01 +lastmod: 2017-02-01 +categories: [variables and params] +#tags: [taxonomies,terms] +draft: false +menu: + docs: + parent: "variables" + weight: 30 +weight: 30 +sections_weight: 30 +aliases: [] +toc: true +--- + +## Taxonomy Terms Page Variables + +[Taxonomy terms pages][taxonomytemplates] are of the type `Page` and have the following additional variables. + +For example, the following fields would be available in `layouts/_defaults/terms.html`, depending on how you organize your [taxonomy templates][taxonomytemplates]: + +`.Data.Singular` +: The singular name of the taxonomy (e.g., `tags => `tag`) + +`.Data.Plural` +: The plural name of the taxonomy (e.g., `tags => tags`) + +`.Data.Pages` +: The list of pages in the taxonomy + +`.Data.Terms` +: The taxonomy itself + +`.Data.Terms.Alphabetical` +: The taxonomy terms alphabetized + +`.Data.Terms.ByCount` +: The Terms ordered by popularity + +Note that `.Data.Terms.Alphabetical` and `.Data.Terms.ByCount` can also be reversed: + +* `.Data.Terms.Alphabetical.Reverse` +* `.Data.Terms.ByCount.Reverse` + +## Use `.Site.Taxonomies` Outside of Taxonomy Templates + +The `.Site.Taxonomies` variable holds all the taxonomies defined site-wide. `.Site.Taxonomies` is a map of the taxonomy name to a list of its values (e.g., `"tags" -> ["tag1", "tag2", "tag3"]``). Each value, though, is not a string but rather a *Taxonomy variable*. + +## The `.Taxonomy` Variable + +The `.Taxonomy` variable, available, for example, as `.Site.Taxonomies.tags`, contains the list of tags (values) and, for each tag, their corresponding content pages. + +### Example Usage of `.Site.Taxonomies` + +The following [partial template][partials] will list all your site's taxonomies, each of their keys, and all the content assigned to each of the keys. For more examples of how to order and render your taxonomies, see [Taxonomy Templates][taxonomytemplates]. + +{{% code file="all-taxonomies-keys-and-pages.html" download="all-taxonomies-keys-and-pages.html" %}} +```html +
    +
      + {{ range $taxonomyname, $taxonomy := .Site.Taxonomies }} +
    • {{ $taxonomyname }} +
        + {{ range $key, $value := $taxonomy }} +
      • {{ $key }}
        • + + {{ end }} +
      +
      • + {{ end }} +
    +
    +``` +{{% /code %}} + +[partials]: /templates/partials/ +[taxonomytemplates]: /templates/taxonomy-templates/ \ No newline at end of file diff --git a/data/articles.toml b/data/articles.toml new file mode 100644 index 000000000..379ae5562 --- /dev/null +++ b/data/articles.toml @@ -0,0 +1,731 @@ +[[article]] + title = "A visit to the Workshop: Hugo/Unix/Vim integration" + url = "https://blog.afoolishmanifesto.com/posts/hugo-unix-vim-integration/" + author = "fREW Schmidt" + date = "2017-07-22" + +[[article]] + title = "Hugo Easy Gallery - Automagical PhotoSwipe image gallery with a one-line shortcode" + url = "https://www.liwen.id.au/heg/" + author = "Li-Wen Yip" + date = "2017-03-25" + +[[article]] + title = "Automagical Image Gallery in Hugo with PhotoSwipe and jQuery" + url = "https://www.liwen.id.au/photoswipe/" + author = "Li-Wen Yip" + date = "2017-03-04" + +[[article]] + title = "Adding Isso Comments to Hugo" + url = "https://stiobhart.net/2017-02-24-isso-comments/" + author = "Stíobhart Matulevicz" + date = "2017-02-24" + +[[article]] + title = "Hugo Tutorial: How to Build & Host a (Very Fast) Static E-Commerce Site" + url = "https://snipcart.com/blog/hugo-tutorial-static-site-ecommerce" + author = "Snipcart" + date = "2017-02-23" + +[[article]] + title = "How to Password Protect a Hugo Site" + url = "https://www.aerobatic.com/blog/password-protect-a-hugo-site/" + author = "Aerobatic" + date = "2017-02-19" + +[[article]] + title = "Switching from Wordpress to Hugo" + url = "http://schnuddelhuddel.de/switching-from-wordpress-to-hugo/" + author = "Mario Martelli" + date = "2017-02-19" + +[[article]] + title = "Zero to HTTP/2 with AWS and Hugo" + url = "https://habd.as/zero-to-http-2-aws-hugo/" + author = "Josh Habdas" + date = "2017-02-16" + +[[article]] + title = "Deploy a Hugo site to Aerobatic with CircleCI" + url = "https://www.aerobatic.com/blog/hugo-github-circleci/" + author = "Aerobatic" + date = "2017-02-14" + +[[article]] + title = "NPM scripts for building and deploying Hugo site" + url = "https://www.aerobatic.com/blog/hugo-npm-buildtool-setup/" + author = "Aerobatic" + date = "2017-02-12" + +[[article]] + title = "Getting started with Hugo and the plain-blog theme, on NearlyFreeSpeech.Net" + url = "https://www.penwatch.net/cms/get_started_plain_blog/" + author = "Li-aung “Lewis” Yip" + date = "2017-02-12" + +[[article]] + title = "Choose Hugo over Jekyll" + url = "https://habd.as/choose-hugo-over-jekyll/" + author = "Josh Habdas" + date = "2017-02-10" + +[[article]] + title = "Build a Hugo site using Cloud9 IDE and host on App Engine" + url = "https://loyall.ch/lab/2017/01/build-a-static-website-with-cloud9-hugo-and-app-engine/" + author = "Pascal Aubort" + date = "2017-02-05" + +[[article]] + title = "Hugo Continuous Deployment with Bitbucket Pipelines and Aerobatic" + url = "https://www.aerobatic.com/blog/hugo-bitbucket-pipelines/" + author = "Aerobatic" + date = "2017-02-04" + +[[article]] + title = "How to use Firebase to host a Hugo site" + url = "https://www.m0d3rnc0ad.com/post/static-site-firebase/" + author = "Andrew Cuga" + date= "2017-02-04" + +[[article]] + title = "A publishing workflow for teams using static site generators" + url = "https://www.keybits.net/post/publishing-workflow-for-teams-using-static-site-generators/" + author = "Tom Atkins" + date = "2017-01-02" + +[[article]] + title = "How To Dynamically Use Google Fonts In A Hugo Website" + url = "https://stoned.io/web-development/hugo/How-To-Dynamically-Use-Google-Fonts-In-A-Hugo-Website/" + author = "Hash Borgir" + date = "2016-10-27" + +[[article]] + title = "Embedding Facebook In A Hugo Template" + url = "https://stoned.io/web-development/hugo/Embedding-Facebook-In-A-Hugo-Template/" + author = "Hash Borgir" + date = "2016-10-22" + +[[article]] + title = "通过 Gitlab-cl 将 Hugo blog 自动部署至 GitHub (Chinese, Continious integration)" + url = "https://zetaoyang.github.io/post/2016/10/17/gitlab-cl.html" + author = "Zetao Yang" + date = "2016-10-17" + +[[article]] + title = "A Step-by-Step Guide: Hugo on Netlify" + url = "https://www.netlify.com/blog/2016/09/21/a-step-by-step-guide-hugo-on-netlify/" + author = "Eli Williamson" + date = "2016-09-21" + +[[article]] + title = "Building our site: From Django & Wordpress to a static generator (Part I)" + url = "https://tryolabs.com/blog/2016/09/20/building-our-site-django-wordpress-to-static-part-i/" + author = "Alan Descoins" + date = "2016-09-20" + +[[article]] + title = "Webseitenmaschine - Statische Websites mit Hugo erzeugen (German, $)" + url = "http://www.heise.de/ct/ausgabe/2016-12-Statische-Websites-mit-Hugo-erzeugen-3211704.html" + author = "Christian Helmbold" + date = "2016-05-27" + +[[article]] + title = "Cómo hacer sitios web estáticos con Hugo y Go - Platzi (Video tutorial)" + url = "https://www.youtube.com/watch?v=qaXXpdiCHXE" + author = "Verónica López" + date = "2016-04-06" + +[[article]] + title = "CDNOverview: A CDN comparison site made with Hugo" + url = "https://www.cloakfusion.com/cdnoverview-cdn-comparison-site-made-hugo/" + author = "Thijs de Zoete" + date = "2016-02-23" + +[[article]] + title = "Hugo: A Modern WebSite Engine That Just Works" + url = "https://github.com/shekhargulati/52-technologies-in-2016/blob/master/07-hugo/README.md" + author = "Shekhar Gulati" + date = "2016-02-14" + +[[article]] + title = "Minify Hugo Generated HTML" + url = "http://ratson.name/blog/minify-hugo-generated-html/" + author = "Ratson" + date = "2016-02-02" + +[[article]] + title = "HugoのデプロイをWerckerからCircle CIに変更した - log" + url = "http://log.deprode.net/logs/2016-01-17/" + author = "Deprode" + date = "2016-01-17" + +[[article]] + title = "Static site generators: el futuro de las webs estáticas
    (Hugo, Jekyll, Flask y otros)" + url = "http://sitelabs.es/static-site-generators-futuro-las-webs-estaticas/" + author = "Eneko Sarasola" + date = "2016-01-09" + +[[article]] + title = "Writing a Lambda Function for Hugo" + url = "https://blog.jolexa.net/post/writing-a-lambda-function-for-hugo/" + author = "Jeremy Olexa" + date = "2016-01-01" + +[[article]] + title = "Ein Blog mit Hugo erstellen - Tutorial (Deutsch/German)" + url = "http://privat.albicker.org/tags/hugo.html" + author = "Bernhard Albicker" + date = "2015-12-30" + +[[article]] + title = "How to host Hugo static website generator on AWS Lambda" + url = "http://bezdelev.com/post/hugo-aws-lambda-static-website/" + author = "Ilya Bezdelev" + date = "2015-12-15" + +[[article]] + title = "Migrating from Pelican to Hugo" + url = "http://www.softinio.com/post/migrating-from-pelican-to-hugo/" + author = "Salar Rahmanian" + date = "2015-11-29" + +[[article]] + title = "Static Website Generators Reviewed: Jekyll, Middleman, Roots, Hugo" + url = "http://www.smashingmagazine.com/2015/11/static-website-generators-jekyll-middleman-roots-hugo-review/" + author = "Mathias Biilmann Christensen" + date = "2015-11-16" + +[[article]] + title = "How To Deploy a Hugo Site to Production with Git Hooks on Ubuntu 14.04" + url = "https://www.digitalocean.com/community/tutorials/how-to-deploy-a-hugo-site-to-production-with-git-hooks-on-ubuntu-14-04" + author = "Justin Ellingwood" + date = "2015-11-12" + +[[article]] + title = "How To Install and Use Hugo, a Static Site Generator, on Ubuntu 14.04" + url = "https://www.digitalocean.com/community/tutorials/how-to-install-and-use-hugo-a-static-site-generator-on-ubuntu-14-04" + author = "Justin Ellingwood" + date = "2015-11-09" + +[[article]] + title = "Switching from Wordpress to Hugo" + url = "http://justinfx.com/2015/11/08/switching-from-wordpress-to-hugo/" + author = "Justin Israel" + date = "2015-11-08" + +[[article]] + title = "Hands-on Experience with Hugo as a Static Site Generator" + url = "http://usersnap.com/blog/hands-on-experience-with-hugo-static-site-generator/" + author = "Thomas Peham" + date = "2015-10-15" + +[[article]] + title = "Statische Webseites mit Hugo erstellen/Vortrag mit Foliensatz (deutsch)" + url = "http://sfd.koelnerlinuxtreffen.de/2015/HaraldWeidner/" + author = "Harald Weidner" + date = "2015-09-19" + +[[article]] + title = "Moving from WordPress to Hugo" + url = "http://abhipandey.com/2015/09/moving-to-hugo/" + author = "Abhishek Pandey" + date = "2015-09-15" + +[[article]] + title = "通过webhook将Hugo自动部署至GitHub Pages和GitCafe Pages (Automated deployment)" + url = "http://blog.coderzh.com/2015/09/13/use-webhook-automated-deploy-hugo/" + author = "CoderZh" + date = "2015-09-13" + +[[article]] + title = "使用hugo搭建个人博客站点 (Using Hugo to build a personal blog site)" + url = "http://blog.coderzh.com/2015/08/29/hugo/" + author = "CoderZh" + date = "2015-08-29" + +[[article]] + title = "Good-Bye Wordpress, Hello Hugo! (German)" + url = "http://blog.arminhanisch.de/2015/08/blog-migration-zu-hugo/" + author = "Armin Hanisch" + date = "2015-08-18" + +[[article]] + title = "Générer votre site web statique avec Hugo (Generate your static site with Hugo)" + url = "http://www.linux-pratique.com/?p=191" + author = "Benoît Benedetti" + date = "2015-06-26" + +[[article]] + title = "Hugo向けの新しいテーマを作った (I created a new theme for Hugo)" + url = "https://yet.unresolved.xyz/blog/2016/10/03/how-to-make-of-hugo-theme/" + author = "Daisuke Tsuji" + date = "2015-06-20" + +[[article]] + title = "Hugo - Gerando um site com conteúdo estático. (Portuguese Brazil)" + url = "http://blog.ffrizzo.com/posts/hugo/" + author = "Fabiano Frizzo" + date = "2015-06-02" + +[[article]] + title = "An Introduction to Static Site Generators" + url = "http://davidwalsh.name/introduction-static-site-generators" + author = "Eduardo Bouças" + date = "2015-05-20" + +[[article]] + title = "Hugo Still Rules" + url = "http://cheekycoder.com/2015/05/hugo-still-rules/" + author = "Cheeky Coder" + date = "2015-05-18" + +[[article]] + title = "hugo - Static Site Generator" + url = "http://gscacco.github.io/post/hugo/" + author = "G Scaccoio" + date = "2015-05-04" + +[[article]] + title = "WindowsでHugoを使う" + url = "http://ureta.net/2015/05/hugo-on-windows/" + author = "うれ太郎" + date = "2015-05-01" + +[[article]] + title = "Hugoのshortcodesを用いてサイトにスライドなどを埋め込む" + url = "http://blog.yucchiy.com/2015/04/29/hugo-shortcode/" + author = "Yucchiy" + date = "2015-04-29" + +[[article]] + title = "HugoとCircleCIでGitHub PagesにBlogを公開してみたら超簡単だった" + url = "http://hori-ryota.github.io/blog/create-blog-with-hugo-and-circleci/" + author = "Hori Ryota" + date = "2015-04-17" + +[[article]] + title = "10 Best Static Site Generators" + url = "http://beebom.com/2015/04/best-static-site-generators" + author = "Aniruddha Mysore" + date = "2015-04-06" + +[[article]] + title = "Goodbye WordPress; Hello Hugo" + url = "http://willwarren.com/2015/04/05/goodbye-wordpress-hello-hugo/" + author = "Will Warren" + date = "2015-04-05" + +[[article]] + title = "Static Websites with Hugo on Google Cloud Storage" + url = "http://www.moxie.io/post/static-websites-with-hugo-on-google-cloud-storage/" + author = "Moxie Input/Output" + date = "2015-04-02" + +[[article]] + title = "De nuevo iniciando un blog" + url = "https://alvarolizama.net/" + author = "Alvaro Lizama" + date = "2015-03-29" + +[[article]] + title = "We moved our blog from Posthaven to Hugo after only three posts. Why?" + url = "http://blog.hypriot.com/post/moved-from-posthaven-to-hugo/" + author = "Hypriot" + date = "2015-03-27" + +[[article]] + title = "Top Static Site Generators in 2015" + url = "http://superdevresources.com/static-site-generators-2015/" + author = "Kanishk Kunal" + date = "2015-03-12" + +[[article]] + title = "Moving to Hugo" + url = "http://abiosoft.com/moving-to-hugo/" + author = "Abiola Ibrahim" + date = "2015-03-08" + +[[article]] + title = "Migrating a blog (yes, this one!) from Wordpress to Hugo" + url = "http://justindunham.net/migrating-from-wordpress-to-hugo/" + author = "Justin Dunham" + date = "2015-02-13" + +[[article]] + title = "blogをoctopressからHugoに乗り換えたメモ" + url = "http://blog.jigyakkuma.org/2015/02/11/hugo/" + author = "jigyakkuma" + date = "2015-02-11" + +[[article]] + title = "Hugoでブログをつくった" + url = "http://porgy13.github.io/post/new-hugo-blog/" + author = "porgy13" + date = "2015-02-07" + +[[article]] + title = "Hugoにブログを移行した" + url = "http://keichi.net/post/first/" + author = "Keichi Takahashi" + date = "2015-02-04" + +[[article]] + title = "Hugo静态网站生成器中文教程" + url = "http://nanshu.wang/post/2015-01-31/" + author = "Nanshu Wang" + date = "2015-01-31" + +[[article]] + title = "Hugo + Github Pages + Wercker CI = ¥0（無料）
    でコマンド 1 発（自動化）でサイト
    ・ブログを公開・運営・分析・収益化    " + url = "http://qiita.com/yoheimuta/items/8a619cac356bed89a4c9" + author = "Yohei Yoshimuta" + date = "2015-01-31" + +[[article]] + title = "Running Hugo websites on anynines" + url = "http://blog.anynines.com/running-hugo-websites-on-anynines/" + author = "Julian Weber" + date = "2015-01-30" + +[[article]] + title = "MiddlemanからHugoへ移行した" + url = "http://re-dzine.net/2015/01/hugo/" + author = "Haruki Konishi" + date = "2015-01-21" + +[[article]] + title = "WordPress から Hugo に乗り換えました" + url = "http://rakuishi.com/archives/wordpress-to-hugo/" + author = "rakuishi" + date = "2015-01-20" + +[[article]] + title = "HUGOを使ってサイトを立ち上げる方法" + url = "http://qiita.com/syui/items/869538099551f24acbbf" + author = "Syui" + date = "2015-01-17" + +[[article]] + title = "Jekyllが許されるのは小学生までだよね" + url = "http://t32k.me/mol/log/hugo/" + author = "Ishimoto Koji" + date = "2015-01-16" + +[[article]] + title = "Getting started with Hugo" + url = "http://anthonyfok.org/post/getting-started-with-hugo/" + author = "Anthony Fok" + date = "2015-01-12" + +[[article]] + title = "把这个博客静态化了 (Migrate to Hugo)" + url = "http://lich-eng.com/2015/01/03/migrate-to-hugo/" + author = "Li Cheng" + date = "2015-01-03" + +[[article]] + title = "Porting my blog with Hugo" + url = "http://blog.srackham.com/posts/porting-my-blog-with-hugo/" + author = "Stuart Rackham" + date = "2014-12-30" + +[[article]] + title = "Hugoを使ってみたときのメモ" + url = "http://machortz.github.io/posts/usinghugo/" + author = "Machortz" + date = "2014-12-29" + +[[article]] + title = "OctopressからHugoへ移行した" + url = "http://deeeet.com/writing/2014/12/25/hugo/" + author = "Taichi Nakashima" + date = "2014-12-25" + +[[article]] + title = "Migrating to Hugo From Octopress" + url = "http://nathanleclaire.com/blog/2014/12/22/migrating-to-hugo-from-octopress/" + author = "Nathan LeClaire" + date = "2014-12-22" + +[[article]] + title = "Dynamic Pages with GoHugo.io" + url = "http://cyrillschumacher.com/2014/12/21/dynamic-pages-with-gohugo.io/" + author = "Cyrill Schumacher" + date = "2014-12-21" + +[[article]] + title = "6 Static Blog Generators That Aren’t Jekyll" + url = "http://www.sitepoint.com/6-static-blog-generators-arent-jekyll/" + author = "David Turnbull" + date = "2014-12-08" + +[[article]] + title = "Travel Blogging Setup" + url = "http://www.stou.dk/2014/11/travel-blogging-setup/" + author = "Rasmus Stougaard" + date = "2014-11-23" + +[[article]] + title = "Hosting A Hugo Website Behind Nginx" + url = "http://www.bigbeeconsultants.co.uk/blog/hosting-hugo-website-behind-nginx" + author = "Rick Beton" + date = "2014-11-20" + +[[article]] + title = "使用Hugo搭建免费个人Blog (How to use Hugo)" + url = "http://ulricqin.com/post/how-to-use-hugo/" + author = "Ulric Qin 秦晓辉" + date = "2014-11-11" + +[[article]] + title = "Built in Speed and Built for Speed by Hugo" + url = "http://cheekycoder.com/2014/10/built-for-speed-by-hugo/" + author = "Cheeky Coder" + date = "2014-10-30" + +[[article]] + title = "Hugo para crear sitios web estáticos" + url = "http://www.webbizarro.com/noticias/1076/hugo-para-crear-sitios-web-estaticos/" + author = "Web Bizarro" + date = "2014-08-19" + +[[article]] + title = "Going with hugo" + url = "http://www.markuseliasson.se/article/going-with-hugo/" + author = "Markus Eliasson" + date = "2014-08-18" + +[[article]] + title = "Benchmarking Jekyll, Hugo and Wintersmith" + url = "http://fredrikloch.me/post/2014-08-12-Jekyll-and-its-alternatives-from-a-site-generation-point-of-view/" + author = "Fredrik Loch" + date = "2014-08-12" + +[[article]] + title = "Goodbye Octopress, Hello Hugo!" + url = "http://andreimihu.com/blog/2014/08/11/goodbye-octopress-hello-hugo/" + author = "Andrei Mihu" + date = "2014-08-11" + +[[article]] + title = "Beautiful sites for Open Source projects" + url = "http://beautifulopen.com/2014/08/09/hugo/" + author = "Beautiful Open" + date = "2014-08-09" + +[[article]] + title = "Hugo: Beyond the Defaults" + url = "http://npf.io/2014/08/hugo-beyond-the-defaults/" + author = "Nate Finch" + date = "2014-08-08" + +[[article]] + title = "First Impressions of Hugo" + url = "https://peteraba.com/blog/first-impressions-of-hugo/" + author = "Peter Aba" + date = "2014-06-06" + +[[article]] + title = "New Site Workflow" + url = "http://vurt.co.uk/post/new_website/" + author = "Giles Paterson" + date = "2014-08-05" + +[[article]] + title = "How I Learned to Stop Worrying and Love the (Static) Web" + url = "http://cognition.ca/post/about-hugo/" + author = "Joshua McKenty" + date = "2014-08-04" + +[[article]] + title = "Hugo - Static Site Generator" + url = "http://kenwoo.io/blog/hugo---static-site-generator/" + author = "Kenny Woo" + date = "2014-08-03" + +[[article]] + title = "Hugo Is Friggin' Awesome" + url = "http://npf.io/2014/08/hugo-is-awesome/" + author = "Nate Finch" + date = "2014-08-01" + +[[article]] + title = "再次搬家 (Move from WordPress to Hugo)" + url = "http://www.chingli.com/misc/move-from-wordpress-to-hugo/" + author = "青砾 (chingli)" + date = "2014-07-12" + +[[article]] + title = "Embedding Gists in Hugo" + url = "http://danmux.com/posts/embedded_gists/" + author = "Dan Mull" + date = "2014-07-05" + +[[article]] + title = "An Introduction To Hugo" + url = "http://www.cirrushosting.com/web-hosting-blog/an-introduction-to-hugo/" + author = "Dan Silber" + date = "2014-07-01" + +[[article]] + title = "Moving to Hugo" + url = "http://danmux.com/posts/hugo_based_blog/" + author = "Dan Mull" + date = "2014-05-29" + +[[article]] + title = "开源之静态站点生成器排行榜
    (Leaderboard of open-source static website generators)" + url = "http://code.csdn.net/news/2819909" + author = "CSDN.net" + date = "2014-05-23" + +[[article]] + title = "Finally, a satisfying and effective blog setup" + url = "http://michaelwhatcott.com/now-powered-by-hugo/" + author = "Michael Whatcott" + date = "2014-05-20" + +[[article]] + title = "Hugo from scratch" + url = "http://zackofalltrades.com/notes/2014/05/hugo-from-scratch/" + author = "Zack Williams" + date = "2014-05-18" + +[[article]] + title = "Why I switched away from Jekyll" + url = "http://www.jakejanuzelli.com/why-I-switched-away-from-jekyll/" + author = "Jake Januzelli" + date = "2014-05-10" + +[[article]] + title = "Welcome our new blog" + url = "http://blog.ninya.io/posts/welcome-our-new-blog/" + author = "Ninya.io" + date = "2014-04-11" + +[[article]] + title = "Mission Not Accomplished" + url = "http://johnsto.co.uk/blog/mission-not-accomplished/" + author = "Dave Johnston" + date = "2014-04-03" + +[[article]] + title = "Hugo - A Static Site Builder in Go" + url = "http://deepfriedcode.com/post/hugo/" + author = "Deep Fried Code" + date = "2014-03-30" + +[[article]] + title = "Adventures in Angular Podcast" + url = "http://devchat.tv/adventures-in-angular/003-aia-gdes" + author = "Matias Niemela" + date = "2014-03-28" + +[[article]] + title = "Hugo" + url = "http://bra.am/post/hugo/" + author = "bra.am" + date = "2014-03-23" + +[[article]] + title = "Converting Blogger To Markdown" + url = "http://trishagee.github.io/project/atom-to-hugo/" + author = "Trisha Gee" + date = "2014-03-20" + +[[article]] + title = "Moving to Hugo Static Web Pages" + url = "http://tepid.org/tech/hugo-web/" + author = "Tobias Weingartner" + date = "2014-03-16" + +[[article]] + title = "New Blog Engine: Hugo" + url = "https://blog.afoolishmanifesto.com/posts/hugo/" + author = "fREW Schmidt" + date = "2014-03-15" + +[[article]] + title = "Hugo + gulp.js = Huggle" + url = "http://ktmud.github.io/huggle/en/intro/)" + author = "Jesse Yang 杨建超" + date = "2014-03-08" + +[[article]] + title = "Powered by Hugo" + url = "http://kieranhealy.org/blog/archives/2014/02/24/powered-by-hugo/" + author = "Kieran Healy" + date = "2014-02-24" + +[[article]] + title = "静的サイトを素早く構築するために
    GoLangで作られたジェネレータHugo    " + url = "http://hamasyou.com/blog/2014/02/21/hugo/" + author = "
    Shogo Hamada
    濱田章吾
    " + date = "2014-02-21" + +[[article]] + title = "Latest Roundup of Useful Tools For Developers" + url = "http://codegeekz.com/latest-roundup-of-useful-tools-for-developers/" + author = "CodeGeekz" + date = "2014-02-13" + +[[article]] + title = "Hugo: Static Site Generator written in Go" + url = "http://www.braveterry.com/2014/02/06/hugo-static-site-generator-written-in-go/" + author = "Brave Terry" + date = "2014-02-06" + +[[article]] + title = "10 Useful HTML5 Tools for Web Designers and Developers" + url = "http://designdizzy.com/10-useful-html5-tools-for-web-designers-and-developers/" + author = "Design Dizzy" + date = "2014-02-04" + +[[article]] + title = "Hugo – Fast, Flexible Static Site Generator" + url = "http://cube3x.com/hugo-fast-flexible-static-site-generator/" + author = "Joby Joseph" + date = "2014-01-18" + +[[article]] + title = "Hugo: A new way to build static website" + url = "http://www.w3update.com/opensource/hugo-a-new-way-to-build-static-website.html" + author = "w3update" + date = "2014-01-17" + +[[article]] + title = "Xaprb now uses Hugo" + url = "http://xaprb.com/blog/2014/01/15/using-hugo/" + author = "Baron Schwartz" + date = "2014-01-15" + +[[article]] + title = "New jQuery Plugins And Resources That Web Designers Need" + url = "http://www.designyourway.net/blog/resources/new-jquery-plugins-and-resources-that-web-designers-need/" + author = "Design Your Way" + date = "2014-01-01" + +[[article]] + title = "On Blog Construction" + url = "http://alexla.sh/post/on-blog-construction/" + author = "Alexander Lash" + date = "2013-12-27" + +[[article]] + title = "Hugo" + url = "http://onethingwell.org/post/69070926608/hugo" + author = "One Thing Well" + date = "2013-12-05" + +[[article]] + title = "In Praise Of Hugo" + url = "http://sound-guru.com/blog/post/hello-world/" + author = "sound-guru.com" + date = "2013-10-19" + +[[article]] + title = "Hosting a blog on S3 and Cloudfront" + url = "http://www.danesparza.net/2013/07/hosting-a-blog-on-s3-and-cloudfront/" + author = "Dan Esparza" + date = "2013-07-24" diff --git a/data/docs.json b/data/docs.json index 83d614afa..90edb9bc8 100644 --- a/data/docs.json +++ b/data/docs.json @@ -6,63 +6,72 @@ "String": "application/javascript+js", "MainType": "application", "SubType": "javascript", - "Suffix": "js" + "Suffix": "js", + "Delimiter": "." }, { "Type": "application/json", "String": "application/json+json", "MainType": "application", "SubType": "json", - "Suffix": "json" + "Suffix": "json", + "Delimiter": "." }, { "Type": "application/rss", "String": "application/rss+xml", "MainType": "application", "SubType": "rss", - "Suffix": "xml" + "Suffix": "xml", + "Delimiter": "." }, { "Type": "application/xml", "String": "application/xml+xml", "MainType": "application", "SubType": "xml", - "Suffix": "xml" + "Suffix": "xml", + "Delimiter": "." }, { "Type": "text/calendar", "String": "text/calendar+ics", "MainType": "text", "SubType": "calendar", - "Suffix": "ics" + "Suffix": "ics", + "Delimiter": "." }, { "Type": "text/css", "String": "text/css+css", "MainType": "text", "SubType": "css", - "Suffix": "css" + "Suffix": "css", + "Delimiter": "." }, { "Type": "text/csv", "String": "text/csv+csv", "MainType": "text", "SubType": "csv", - "Suffix": "csv" + "Suffix": "csv", + "Delimiter": "." }, { "Type": "text/html", "String": "text/html+html", "MainType": "text", "SubType": "html", - "Suffix": "html" + "Suffix": "html", + "Delimiter": "." }, { "Type": "text/plain", "String": "text/plain+txt", "MainType": "text", "SubType": "plain", - "Suffix": "txt" + "Suffix": "txt", + "Delimiter": "." } ] }, @@ -169,6 +178,21 @@ "demoTheme/layouts/_default/list.html" ] }, + { + "Example": "AMP home, French language\".", + "OutputFormat": "AMP", + "Suffix": "html", + "Template Lookup Order": [ + "layouts/index.fr.amp.html", + "layouts/index.amp.html", + "layouts/index.fr.html", + "layouts/index.html", + "layouts/_default/list.fr.amp.html", + "layouts/_default/list.amp.html", + "layouts/_default/list.fr.html", + "layouts/_default/list.html" + ] + }, { "Example": "JSON home, no theme.", "OutputFormat": "JSON", @@ -961,6 +985,19 @@ ] ] }, + "Log": { + "Description": "", + "Args": [ + "a" + ], + "Aliases": null, + "Examples": [ + [ + "{{math.Log 1}}", + "0" + ] + ] + }, "Mod": { "Description": "Mod returns a % b.", "Args": [ diff --git a/data/homepagetweets.toml b/data/homepagetweets.toml new file mode 100644 index 000000000..67bf7b4bd --- /dev/null +++ b/data/homepagetweets.toml @@ -0,0 +1,258 @@ +[[tweet]] +name = "STOQE" +twitter_handle = "@STOQE" +quote = "I fear @GoHugoIO v0.22 might be so fast it creates a code vortex that time-warps me back to a time I used Wordpress. #gasp" +link = "https://twitter.com/STOQE/status/874184881701494784" +date = 2017-06-12T00:00:00Z + +[[tweet]] +name = "Christophe Diericx" +twitter_handle = "@spcrngr_" +quote = "The more I use gohugo.io, the more I really like it. Super intuitive/powerful static site generator...great job @GoHugoIO" +link = "https://twitter.com/spcrngr_/status/870863020905435136" +date = 2017-06-03T00:00:00Z + +[[tweet]] +name = "marcoscan" +twitter_handle = "@marcoscan" +quote = "Blog migrated from @WordPress to @GoHugoIO, with a little refresh of my theme, Vim shortcuts and a full featured deploy script #gohugo" +link = "https://twitter.com/marcoscan/status/869661175960752129" +date = 2017-05-30T00:00:00Z + +[[tweet]] +name = "Sandra Kuipers" +twitter_handle = "@SKuipersDesign" +quote = "Who knew static site building could be fun 🤔 Learning #gohugo today" +link = "https://twitter.com/SKuipersDesign/status/868796256902029312" +date = 2017-05-28T00:00:00Z + +[[tweet]] +name = "Netlify" +twitter_handle = "@Netlify" +quote = "Top Ten Static Site Generators of 2017. Congrats to the top 3: 1. @Jekyllrb 2. @GoHugoIO 3. @hexojs" +link = "https://twitter.com/Netlify/status/868122279221362688" +date = 2017-05-26T00:00:00Z + +[[tweet]] +name = "Phil Hawksworth" +twitter_handle = "@philhawksworth" +quote = "I've been keen on #JAMStack for some time, but @GoHugoIO is wooing me all over again. Great fun to build with. And speeeeedy." +link = "https://twitter.com/philhawksworth/status/866684170512326657" +date = 2017-05-22T00:00:00Z + +[[tweet]] +name = "Aras Pranckevicius" +twitter_handle = "@aras_p" +quote = "I've probably said it before...but having Hugo rebuild the whole website in 300ms is amazing. gohugo.io, #gohugo" +link = "https://twitter.com/aras_p/status/861157286823288832" +date = 2017-05-07T00:00:00Z + +[[tweet]] +name = "Hans Beck" +twitter_handle = "@EnrichedGamesHB" +quote = "Diving deeper into @GoHugoIO. A lot of docs there, top work! But I've the impressed that #gohugo is far easier than its feels from the docs!" +link = "https://twitter.com/EnrichedGamesHB/status/836854762440130560" +date = 2017-03-01T00:00:00Z + +[[tweet]] +name = "Alan Richardson" +twitter_handle = "@eviltester" +quote = "I migrated the @BlackOpsTesting .com website from docpad to Hugo last weekend. http://gohugo.io/ Super Fast HTML Generation @spf13 " +link = "https://twitter.com/eviltester/status/553520335115808768" +date = 2015-01-09T00:00:00Z + +[[tweet]] +name = "Janez Čadež‏" +twitter_handle = "@jamziSLO" +quote = "Building @garazaFRI website in #hugo. This static site generator is soooo damn fast! #gohugo #golang" +link = "https://twitter.com/jamziSLO/status/817720283977183234" +date = 2017-01-07T00:00:00Z + +[[tweet]] +name = "Execute‏‏" +twitter_handle = "@executerun" +quote = "Hah, #gohugo. I was working with #gohugo on #linux but now I realised how easy is to set-up it on #windows. Just need to add binary to #path!" +link = "https://twitter.com/executerun/status/809753145270272005" +date = 2016-12-16T00:00:00Z + +[[tweet]] +name = "Baron Schwartz" +twitter_handle = "@xaprb" +quote = "Hugo is impressively capable. It's a static site generator by @spf13 written in #golang . Just upgraded to latest release; very powerful. " +link = "https://twitter.com/xaprb/status/556894866488455169" +date = 2015-01-18T00:00:00Z + +[[tweet]] +name = "Dave Cottlehuber" +twitter_handle = "@dch__" +quote = "I just fell in love with #hugo, a static site/blog engine written by @spf13 in #golang + stellar docs" +link = "https://twitter.com/dch__/status/460158115498176512" +date = 2014-04-26T00:00:00Z + +[[tweet]] +name = "David Caunt" +twitter_handle = "@dcaunt" +quote = "I had a play with Hugo and it was good, uses Markdown files for content" +link = "https://twitter.com/dcaunt/statuses/406466996277374976" +date = 2013-11-29T00:00:00Z + +[[tweet]] +name = "David Gay" +twitter_handle = "@oddshocks" +quote = "Hugo is super-rad." +link = "https://twitter.com/oddshocks/statuses/405083217893421056" +date = 2013-11-25T00:00:00Z + +[[tweet]] +name = "Diti" +twitter_handle = "@DitiPengi" +quote = "The dev version of Hugo is AWESOME! <3 I promise, I will try to learn go ASAP and help contribute to the project! Just too great!" +link = "https://twitter.com/DitiPengi/status/472470974051676160" +date = 2014-05-30T00:00:00Z + +[[tweet]] +name = "Douglas Stephen " +twitter_handle = "@DougStephenJr" +quote = "Even as a long-time Octopress fan, I’ve gotta admit that this project Hugo looks very very cool" +link = "https://twitter.com/DougStephenJr/statuses/364512471660249088" +date = 2013-08-05T00:00:00Z + +[[tweet]] +name = "Hugo Rodger-Brown" +twitter_handle = "@hugorodgerbrown" +quote = "Finally someone builds me my own static site generator" +link = "https://twitter.com/hugorodgerbrown/statuses/364417910153818112" +date = 2013-05-08T00:00:00Z + +[[tweet]] +name = "Hugo Roy" +twitter_handle = "@hugoroyd" +quote = "Finally the answer to the question my parents have been asking: What does Hugo do?" +link = "https://twitter.com/hugoroyd/status/501704796727173120" +date = 2014-08-19T00:00:00Z + +[[tweet]] +name = "Daniel Miessler" +twitter_handle = "@DanielMiessler" +quote = "Websites for named vulnerabilities should run on static site generator platforms like Hugo. Read-only + burst traffic = static." +link = "https://twitter.com/DanielMiessler/status/704703841673957376" +date = 2016-03-01T00:00:00Z + +[[tweet]] +name = "Javier Segura" +twitter_handle = "@jsegura" +quote = "Another site generated with Hugo here! I'm getting in love with it." +link = "https://twitter.com/jsegura/status/465978434154659841" +date = 2014-05-12T00:00:00Z + +[[tweet]] +name = "Jim Biancolo" +twitter_handle = "@jimbiancolo" +quote = "I’m loving the static site generator renaissance we are currently enjoying. Hugo is new, looks great, written in Go" +link = "https://twitter.com/jimbiancolo/statuses/408678420348813314" +date = 2013-05-12T00:00:00Z + +[[tweet]] +name = "Jip J. Dekker" +twitter_handle = "@jipjdekker" +quote = "Building a personal website in Hugo. Works like a charm. And written in @golang!" +link = "https://twitter.com/jipjdekker/status/413783548735152131" +date = 2013-12-19T00:00:00Z + +[[tweet]] +name = "Jose Gonzalvo" +twitter_handle = "@jgonzalvo" +quote = "Checking out Hugo; Loving it so far. Like Jekyll but not so blog-oriented and written in go" +link = "https://twitter.com/jgonzalvo/statuses/408177855819173888" +date = 2013-12-04T00:00:00Z + +[[tweet]] +name = "Josh Matz" +twitter_handle = "@joshmatz" +quote = "A static site generator without the long build times? Yes, please!" +link = "https://twitter.com/joshmatz/statuses/364437436870696960" +date = 2013-08-05T00:00:00Z + +[[tweet]] +name = "Kieran Healy" +twitter_handle = "@kjhealy" +quote = "OK, so in today's speed battle of static site generators, @spf13's hugo is kicking everyone's ass, by miles." +link = "https://twitter.com/kjhealy/status/437349384809115648" +date = 2014-02-22T00:00:00Z + +[[tweet]] +name = "Ludovic Chabant" +twitter_handle = "@ludovicchabant" +quote = "Good work on Hugo, I’m impressed with the speed!" +link = "https://twitter.com/ludovicchabant/statuses/408806199602053120" +date = 2013-12-06T00:00:00Z + +[[tweet]] +name = "Luke Holder" +twitter_handle = "@lukeholder" +quote = "this is AWESOME. a single little executable and so fast." +link = "https://twitter.com/lukeholder/status/430352287936946176" +date = 2014-02-03T00:00:00Z + +[[tweet]] +name = "Markus Eliasson" +twitter_handle = "@markuseliasson" +quote = "Hugo is fast, dead simple to setup and well documented" +link = "https://twitter.com/markuseliasson/status/501594865877008384" +date = 2014-08-19T00:00:00Z + +[[tweet]] +name = "mercime" +twitter_handle = "@mercime_one" +quote = "Hugo: Makes the Web Fun Again" +link = "https://twitter.com/mercime_one/status/500547145087205377" +date = 2014-08-16T00:00:00Z + +[[tweet]] +name = "Michael Whatcott" +twitter_handle = "@mdwhatcott" +quote = "One more satisfied #Hugo blogger. Thanks @spf13 and friends!" +link = "https://twitter.com/mdwhatcott/status/469980686531571712" +date = 2014-05-23T00:00:00Z + +[[tweet]] +name = "Nathan Toups" +twitter_handle = "@rojoroboto" +quote = "I love Hugo! My site is generated with it now http://rjrbt.io" +link = "https://twitter.com/rojoroboto/status/423439915620106242" +date = 2014-01-15T00:00:00Z + +[[tweet]] +name = "Ruben Solvang" +twitter_handle = "@messo85" +quote = "#Hugo is the new @jekyllrb / @middlemanapp! Faster, easier and runs everywhere." +link = "https://twitter.com/messo85/status/472825062027182081" +date = 2014-05-31T00:00:00Z + +[[tweet]] +name = "Ryan Martinsen" +twitter_handle = "@popthestack" +quote = "Also, I re-launched my blog (it looks the same as before) using Hugo, a *fast* static engine. Very happy with it. gohugo.io" +link = "https://twitter.com/popthestack/status/549972754125307904" +date = 2014-12-30T00:00:00Z + +[[tweet]] +name = "The Lone Cuber" +twitter_handle = "@TheLoneCuber" +quote = "Jekyll is dead to me these days though... long live Hugo! Hugo is *by far* the best in its field. Thanks for making it happen." +link = "https://twitter.com/TheLoneCuber/status/495716684456398848" +date = 2014-08-02T00:00:00Z + +[[tweet]] +name = "The Lone Cuber" +twitter_handle = "@TheLoneCuber" +quote = "Finally, a publishing platform that's a joy to use. #NoMoreBarriers" +link = "https://twitter.com/TheLoneCuber/status/495731334711488512" +date = 2014-08-02T00:00:00Z + +[[tweet]] +name = "WorkHTML" +twitter_handle = "@workhtml" +quote = " #Hugo A very good alternative for #wordpress !!! A fast and modern static website engine gohugo.io " +link = "https://twitter.com/workhtml/status/563064361301053440" +date = 2015-02-04T00:00:00Z diff --git a/layouts/404.html b/layouts/404.html deleted file mode 100644 index 4b140fbdb..000000000 --- a/layouts/404.html +++ /dev/null @@ -1,5 +0,0 @@ -{{ partial "header.html" . }} -
    -Page Not Found. -
    -{{ partial "footer.html" . }} diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html deleted file mode 100644 index 076f46dda..000000000 --- a/layouts/_default/baseof.html +++ /dev/null @@ -1,12 +0,0 @@ -{{ partial "header.html" . }} -{{ if .Params.toc }} -
    -{{block "main" .}}{{end}} -
    -
    - {{ .TableOfContents }} -
    -{{ else }} -{{block "main" .}}{{end}} -{{ end }} -{{ partial "footer.html" . }} diff --git a/layouts/_default/list.html b/layouts/_default/list.html deleted file mode 100644 index f2b122c40..000000000 --- a/layouts/_default/list.html +++ /dev/null @@ -1,12 +0,0 @@ -{{ define "main" }} -{{ with .Content }} -{{ . }} -{{ end }} -
      - {{ range .Data.Pages }} -
    • - {{ .Title }} Updated {{ .Lastmod.Format "Mon, Jan 2, 2006" }} -
      • - {{ end }} -
    -{{ end }} diff --git a/layouts/_default/single.html b/layouts/_default/single.html deleted file mode 100644 index b8bcfa70c..000000000 --- a/layouts/_default/single.html +++ /dev/null @@ -1 +0,0 @@ -{{ define "main" }}{{ .Content }}{{ end }} diff --git a/layouts/index.html b/layouts/index.html deleted file mode 100644 index a212e1229..000000000 --- a/layouts/index.html +++ /dev/null @@ -1,319 +0,0 @@ - - - - - - - - Hugo :: A fast and modern static website engine - - {{ "" | safeHTML }} - - - {{ "" | safeHTML }} - - - {{ "" | safeHTML }} - - - - - {{ "" | safeHTML }} - - - - - - - - - - {{ "" | safeHTML }} - - {{ "" | safeHTML }} - - {{ "" | safeHTML }} -
    - - {{ "" | safeHTML }} -
    -
    - - {{ "" | safeHTML }} -
    -
    - -

    Make the Web Fun Again

    -

    - Introducing Hugo, a new idea for making website creation simple again. - Hugo works flexibly with many formats, and is ideal for - blogs, docs, portfolios and much more. - Hugo’s speed fosters - creativity—it makes building a website fun again. -

    -
    -
    - {{ "" | safeHTML }} - -
    -
    - {{ "" | safeHTML }} - - {{ "" | safeHTML }} -
    -
    - - {{ "" | safeHTML }} -
    -
    - - - -

    Run Anywhere

    -

    - Hugo is quite possibly the easiest software to install you’ve ever used: - simply download and run! - - Hugo doesn’t depend on administrative privileges, databases, runtimes, - interpreters or external libraries. - - Sites built with Hugo can be deployed on S3, GitHub Pages, Dropbox or any web host. -

    -
    -
    - {{ "" | safeHTML }} - -
    -
    - {{ "" | safeHTML }} - - {{ "" | safeHTML }} -
    -
    - - {{ "" | safeHTML }} -
    -
    - -

    Fast & Powerful

    -

    - Hugo is designed for speed and performance. Great care has been - taken to ensure build time with Hugo is as short as possible. - We’re talking milliseconds to build your entire site—for most setups! -

    -
    -
    - {{ "" | safeHTML }} - -
    -
    - {{ "" | safeHTML }} - - {{ "" | safeHTML }} -
    -
    - - {{ "" | safeHTML }} -
    -
    - -

    Flexible

    -

    - Hugo is designed to work the way you do. - Organize your content however you want with any URL structure. - Group your content using your own indexes and categories. - Define your own metadata in any format: YAML, TOML or JSON. - Best of all, Hugo handles all these variations - with virtually no configuration. Hugo - just works. -

    -
    -
    - {{ "" | safeHTML }} - -
    -
    - {{ "" | safeHTML }} - - - {{ "" | safeHTML }} -
    -
    - - {{ "" | safeHTML }} -
    -
    - -

    -
    -
    - {{ "" | safeHTML }} - - {{ "" | safeHTML }} -
    -
    - - {{ "" | safeHTML }} -
    -{{ partial "quotes.html" ((where $.Site.Data.references.quotes "date" "ge" (now.AddDate -2 0 0) | shuffle )) }} -
    - {{ "" | safeHTML }} - -
    -
    - {{ "" | safeHTML }} - -
    -
    - {{ "" | safeHTML }} - -
    - {{ "" | safeHTML }} - - {{ "" | safeHTML }} -
    -
    - - {{ "" | safeHTML }} -
    -
    - -

    Open and Free

    -

    - Hugo is open source and completely free. -

    -
    -
    - {{ "" | safeHTML }} - -
    -
    - {{ "" | safeHTML }} - - {{ "" | safeHTML }} -
    -
    - - {{ "" | safeHTML }} -
    -
    - - - -

    Built with

    -

    - Hugo is developed with love by spf13 and friends. - We welcome all contributions. - New to Go? We’ll help you. - Not a developer? No problem! Help - with docs, testing - and themes. -

    -
    -
    - {{ "" | safeHTML }} - -
    -
    - {{ "" | safeHTML }} - - {{ "" | safeHTML }} -
    -
    - - {{ "" | safeHTML }} -
    -
    -

    Getting Started

    - - Download - - - - Quickstart Guide - -

     

    -

    Using Homebrew?

    - 
    brew install hugo
    -
    -
    - {{ "" | safeHTML }} - -
    -
    - {{ "" | safeHTML }} - - {{ "" | safeHTML }} -
    -
    - - {{ "" | safeHTML }} -
    -
    -
      -
      • -
      • -
    -
    -

    Copyright © Steve Francia 2013–{{ now.Format "2006" }}

    -
    -
    - {{ "" | safeHTML }} - -
    -
    - {{ "" | safeHTML }} - - {{ "" | safeHTML }} - - - {{ "" | safeHTML }} - {{ `` | safeHTML }} - - - - - {{ "" | safeHTML }} - - -{{ "" | safeHTML }} -{{ template "partials/analytics.html" . }} - - diff --git a/layouts/index.redir b/layouts/index.redir deleted file mode 100644 index 2dfd2bc0f..000000000 --- a/layouts/index.redir +++ /dev/null @@ -1,6 +0,0 @@ -# Netlify redirects. See https://www.netlify.com/docs/redirects/ -{{ range $p := .Site.Pages -}} -{{ range .Aliases }} -{{ . | printf "%-35s" }} {{ $p.RelPermalink -}} -{{ end -}} -{{- end -}} diff --git a/layouts/partials/analytics.html b/layouts/partials/analytics.html deleted file mode 100644 index a30754c0a..000000000 --- a/layouts/partials/analytics.html +++ /dev/null @@ -1,10 +0,0 @@ - diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html deleted file mode 100644 index 6f9976448..000000000 --- a/layouts/partials/footer.html +++ /dev/null @@ -1,59 +0,0 @@ -
    -
    -

    Last revision: {{ .Lastmod.Format "January 2, 2006" }}{{ if .IsPage }}{{ with .GitInfo }} | {{ .Subject }} ({{ .AbbreviatedHash }}){{end }}{{ end }} - Hugo v{{ .Site.Params.release }} documentation -

    - {{ with getenv "REPOSITORY_URL" -}} - - - - {{- end }} -
    -
    - -
    - - - - -
    - {{ if .IsPage }} - {{ with .GetParam "next" }} - - {{ end }} - {{ end }} -
    - - - - - - - - - - - - - - - - - - - - - {{ template "partials/analytics.html" . }} - - diff --git a/layouts/partials/header.html b/layouts/partials/header.html deleted file mode 100644 index 8149a7bb6..000000000 --- a/layouts/partials/header.html +++ /dev/null @@ -1,93 +0,0 @@ - - - - - - - {{ with .Site.Params.author }}{{ end }} - {{ .Hugo.Generator }} - -{{ .Scratch.Add "title" "" }}{{ if isset .Site.Data.titles .Title }}{{ .Scratch.Set "title" (index .Site.Data.titles .Title).title }}{{ else }}{{ .Scratch.Set "title" .Title}}{{end}} - Hugo - {{ .Scratch.Get "title" }} - - - - - - - - - - - - - - - - -
    - - -
    -
    - -
    -
    - - - - -
    - - -
    - - -
    - - -{{ partial "menu.html" . }} - - -
    -
    - - - - - - - - - - - - - -
    -
    - {{ if .IsPage }} - {{ with .GetParam "prev" }} - - {{ end }} - {{ end }} -
    -
    -
    - - - -
    -
    -
    - {{ partial "search.html" . }} -
    -
    diff --git a/layouts/partials/menu.html b/layouts/partials/menu.html deleted file mode 100644 index d9667291d..000000000 --- a/layouts/partials/menu.html +++ /dev/null @@ -1,40 +0,0 @@ - - - diff --git a/layouts/partials/quotes.html b/layouts/partials/quotes.html deleted file mode 100644 index 3ba0db953..000000000 --- a/layouts/partials/quotes.html +++ /dev/null @@ -1,12 +0,0 @@ -{{ range . }} -
    -
    -

    - {{ .quote | safeHTML }} -

    - — {{ .name }} ({{ .twitter_handle }}) - {{ dateFormat "January 2, 2006" .date }} - -
    -
    -{{ end }} diff --git a/layouts/partials/search.html b/layouts/partials/search.html deleted file mode 100644 index 6a58160cc..000000000 --- a/layouts/partials/search.html +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/layouts/section/commands.html b/layouts/section/commands.html deleted file mode 100644 index afa045452..000000000 --- a/layouts/section/commands.html +++ /dev/null @@ -1,12 +0,0 @@ -{{ partial "header.html" . }} -

    Hugo Commands

    -

    Hugo’s CLI (command line interface) commands are listed here. -This autogenerated list is always up to date (thanks to - Cobra). -

    - -{{ partial "footer.html" . }} diff --git a/layouts/section/release-notes.html b/layouts/section/release-notes.html deleted file mode 100644 index 6af512603..000000000 --- a/layouts/section/release-notes.html +++ /dev/null @@ -1,6 +0,0 @@ -{{ define "main" }} -{{ range .Pages }} -

    {{ .Title }} {{ .Date.Format "Jan 2, 2006" }}

    -{{ .Content }} -{{ end }} -{{ end }} \ No newline at end of file diff --git a/layouts/section/showcase.html b/layouts/section/showcase.html deleted file mode 100644 index be13fc612..000000000 --- a/layouts/section/showcase.html +++ /dev/null @@ -1,17 +0,0 @@ -{{ partial "header.html" . }} - -

    Hugo-built Sites (with source)

    - -
    - {{ range .Data.Pages.ByDate }} - {{ .Render "thumbnail"}} - {{ end }} -
    - -
    - -
    -If you want to be added to this page, please send a pull request. Check out the how-to guide. -
    - -{{ partial "footer.html" . }} diff --git a/layouts/shortcodes/articlelist.html b/layouts/shortcodes/articlelist.html new file mode 100644 index 000000000..2755b1e2d --- /dev/null +++ b/layouts/shortcodes/articlelist.html @@ -0,0 +1,18 @@ + + + + + + + {{ range $ind, $art := $.Site.Data.articles.article }} + + + + + + {{ end }} + +
    Title + Author + Date +
    {{$art.title | markdownify }}{{ $art.author | markdownify }}{{ $art.date }}
    diff --git a/layouts/shortcodes/code.html b/layouts/shortcodes/code.html new file mode 100644 index 000000000..6df49956a --- /dev/null +++ b/layouts/shortcodes/code.html @@ -0,0 +1,15 @@ +
    + {{- with .Get "file" -}} +
    {{.}}
    + {{- end -}} + + {{ if ne (.Get "copy") "false" }} + + {{/* Functionality located within filesaver.js The copy here is located in the css with .copy class so it can be replaced with JS on success */}} + {{end}} +
    + {{- .Inner -}} +
    + +
    diff --git a/layouts/shortcodes/datatable-vertical.html b/layouts/shortcodes/datatable-vertical.html deleted file mode 100644 index 1d2629eca..000000000 --- a/layouts/shortcodes/datatable-vertical.html +++ /dev/null @@ -1,26 +0,0 @@ -{{ $package := (index .Params 0) }} -{{ $listname := (index .Params 1) }} -{{ $list := (index (index .Site.Data.docs $package) $listname) }} -{{ $fields := after 2 .Params }} - - {{ range $list }} - {{ range $k, $v := . }} - {{ $.Scratch.Set $k $v }} - {{ end }} - {{ end }} - - {{ range $i, $_ := $fields }} - - {{ $.Scratch.Set "i" $i }} - - {{ $field := (index $fields ($.Scratch.Get "i") ) }} - - {{ range $list }} - - {{ end }} - - - {{ end }} -
    {{ $field }} - {{ index . $field }} -
    \ No newline at end of file diff --git a/layouts/shortcodes/datatable.html b/layouts/shortcodes/datatable.html index f40605404..4e2814f5a 100644 --- a/layouts/shortcodes/datatable.html +++ b/layouts/shortcodes/datatable.html @@ -16,8 +16,7 @@ {{ end }} {{ range $fields }} {{ $.Scratch.Get . }} - {{ end }} + {{ end }} {{ end }} - diff --git a/layouts/shortcodes/directoryindex.html b/layouts/shortcodes/directoryindex.html index 02a4efadc..37e7d3ad1 100644 --- a/layouts/shortcodes/directoryindex.html +++ b/layouts/shortcodes/directoryindex.html @@ -7,7 +7,7 @@ {{- range $files }} {{ .Size }} - {{ .Name }} + {{ .Name }} {{- end }} diff --git a/layouts/shortcodes/docfile.html b/layouts/shortcodes/docfile.html new file mode 100644 index 000000000..2f982aae8 --- /dev/null +++ b/layouts/shortcodes/docfile.html @@ -0,0 +1,11 @@ +{{ $file := .Get 0}} +{{ $filepath := $file }} +{{ $syntax := index (split $file ".") 1 }} +{{ $syntaxoverride := eq (len .Params) 2 }} +
    +
    {{$filepath}}
    + + 
    {{- readFile $file -}}
    +
    diff --git a/layouts/shortcodes/exfile.html b/layouts/shortcodes/exfile.html new file mode 100644 index 000000000..226782957 --- /dev/null +++ b/layouts/shortcodes/exfile.html @@ -0,0 +1,12 @@ +{{ $file := .Get 0}} +{{ $filepath := replace $file "static/" ""}} +{{ $syntax := index (split $file ".") 1 }} +{{ $syntaxoverride := eq (len .Params) 2 }} +
    +
    {{$filepath}}
    + + 
    {{- readFile $file -}}
    + Source +
    diff --git a/layouts/shortcodes/exfm.html b/layouts/shortcodes/exfm.html new file mode 100644 index 000000000..c0429bbe1 --- /dev/null +++ b/layouts/shortcodes/exfm.html @@ -0,0 +1,13 @@ + +{{ $file := .Get 0}} +{{ $filepath := replace $file "static/" ""}} +{{ $syntax := index (split $file ".") 1 }} +{{ $syntaxoverride := eq (len .Params) 2 }} +
    +
    {{$filepath}}
    + + 
    {{- readFile $file -}}
    + Source +
    \ No newline at end of file diff --git a/layouts/shortcodes/gh.html b/layouts/shortcodes/gh.html index 0a28bf121..0d1a9498e 100644 --- a/layouts/shortcodes/gh.html +++ b/layouts/shortcodes/gh.html @@ -1,9 +1,9 @@ {{ range .Params }} -{{ if eq (substr . 0 1) "@" }} -{{ . }} -{{ else if eq (substr . 0 2) "0x" }} -{{ substr . 2 6 }} -{{ else }} -#{{ . }} -{{ end }} -{{ end }} + {{ if eq (substr . 0 1) "@" }} + {{ . }} + {{ else if eq (substr . 0 2) "0x" }} + {{ substr . 2 6 }} + {{ else }} + #{{ . }} + {{ end }} +{{ end }} \ No newline at end of file diff --git a/layouts/shortcodes/ghrepo.html b/layouts/shortcodes/ghrepo.html new file mode 100644 index 000000000..e9df40d6a --- /dev/null +++ b/layouts/shortcodes/ghrepo.html @@ -0,0 +1 @@ +GitHub repository \ No newline at end of file diff --git a/layouts/shortcodes/nohighlight.html b/layouts/shortcodes/nohighlight.html index d9cb5f302..238234f17 100644 --- a/layouts/shortcodes/nohighlight.html +++ b/layouts/shortcodes/nohighlight.html @@ -1 +1 @@ -
    {{ .Inner }}
    +
    {{ .Inner }}
    \ No newline at end of file diff --git a/layouts/shortcodes/note.html b/layouts/shortcodes/note.html new file mode 100644 index 000000000..fcf081bd5 --- /dev/null +++ b/layouts/shortcodes/note.html @@ -0,0 +1,8 @@ + diff --git a/layouts/shortcodes/output.html b/layouts/shortcodes/output.html new file mode 100644 index 000000000..df1a8ae89 --- /dev/null +++ b/layouts/shortcodes/output.html @@ -0,0 +1,11 @@ +{{$file := .Get "file"}} +{{$icon := index (split $file ".") 1 }} +
    +
    {{$file}}
    + +
    + {{- .Inner -}} +
    +
    \ No newline at end of file diff --git a/layouts/shortcodes/readfile.html b/layouts/shortcodes/readfile.html index f5b3459bf..f777abe26 100644 --- a/layouts/shortcodes/readfile.html +++ b/layouts/shortcodes/readfile.html @@ -1 +1,6 @@ -{{- .Get 0 | readFile -}} +{{$file := .Get "file"}} +{{- if eq (.Get "markdown") "true" -}} +{{- $file | readFile | markdownify -}} +{{- else -}} +{{ $file | readFile | safeHTML }} +{{- end -}} \ No newline at end of file diff --git a/layouts/shortcodes/tip.html b/layouts/shortcodes/tip.html new file mode 100644 index 000000000..0b56ac560 --- /dev/null +++ b/layouts/shortcodes/tip.html @@ -0,0 +1,8 @@ + diff --git a/layouts/shortcodes/todo.html b/layouts/shortcodes/todo.html new file mode 100644 index 000000000..50a099267 --- /dev/null +++ b/layouts/shortcodes/todo.html @@ -0,0 +1 @@ +{{ if .Inner }}{{ end }} \ No newline at end of file diff --git a/layouts/shortcodes/warning.html b/layouts/shortcodes/warning.html new file mode 100644 index 000000000..d05057e59 --- /dev/null +++ b/layouts/shortcodes/warning.html @@ -0,0 +1,8 @@ + diff --git a/layouts/shortcodes/youtube.html b/layouts/shortcodes/youtube.html deleted file mode 100644 index ce7dd0508..000000000 --- a/layouts/shortcodes/youtube.html +++ /dev/null @@ -1,4 +0,0 @@ -
    - -
    diff --git a/layouts/shortcodes/yt.html b/layouts/shortcodes/yt.html new file mode 100644 index 000000000..6915cec5f --- /dev/null +++ b/layouts/shortcodes/yt.html @@ -0,0 +1,11 @@ +
    + + {{if (.Get "thumbnail")}} +
    + {{else}} +
    + {{end}} +
    +{{ if (.Get "description") }} +
    {{ .Get "description" | markdownify }}
    +{{ end }} \ No newline at end of file diff --git a/layouts/showcase/thumbnail.html b/layouts/showcase/thumbnail.html deleted file mode 100644 index 5c36e5d2f..000000000 --- a/layouts/showcase/thumbnail.html +++ /dev/null @@ -1,17 +0,0 @@ -
    -
    -
    -
    - {{ .Description }} -

    - {{ .Title | safeHTML }} - {{ if (isset .Params "sourcelink") }} - source - {{ end }} -

    - {{ range .Params.tags }} - {{ . }} - {{ end }} -
    -
    -
    diff --git a/netlify.toml b/netlify.toml new file mode 100644 index 000000000..addb812a2 --- /dev/null +++ b/netlify.toml @@ -0,0 +1,18 @@ +[build] + publish = "public" + command = "hugo" + +[context.production.environment] + HUGO_VERSION = "0.25.1" + HUGO_ENV = "production" + HUGO_ENABLEGITINFO = "true" + +[context.deploy-preview.environment] + HUGO_VERSION = "0.25.1" + +[context.branch-deploy.environment] + HUGO_VERSION = "0.25.1" + +[context.next.environment] + HUGO_BASEURL = "https://next--gohugoio.netlify.com/" + HUGO_ENABLEGITINFO = "true" \ No newline at end of file diff --git a/static/_headers b/static/_headers index 53cc866dc..1216e42d4 100644 --- a/static/_headers +++ b/static/_headers @@ -1,4 +1,5 @@ /* X-Frame-Options: DENY X-XSS-Protection: 1; mode=block - X-Content-Type-Options: nosniff \ No newline at end of file + X-Content-Type-Options: nosniff + Referrer-Policy: origin-when-cross-origin diff --git a/static/contribute/development/accept-cla.png b/static/contribute/development/accept-cla.png new file mode 100755 index 000000000..929fda6ab Binary files /dev/null and b/static/contribute/development/accept-cla.png differ diff --git a/static/contribute/development/ci-errors.png b/static/contribute/development/ci-errors.png new file mode 100755 index 000000000..95cd290b6 Binary files /dev/null and b/static/contribute/development/ci-errors.png differ diff --git a/static/contribute/development/copy-remote-url.png b/static/contribute/development/copy-remote-url.png new file mode 100755 index 000000000..9006f4a48 Binary files /dev/null and b/static/contribute/development/copy-remote-url.png differ diff --git a/static/contribute/development/forking-a-repository.png b/static/contribute/development/forking-a-repository.png new file mode 100755 index 000000000..ea132cab3 Binary files /dev/null and b/static/contribute/development/forking-a-repository.png differ diff --git a/static/contribute/development/open-pull-request.png b/static/contribute/development/open-pull-request.png new file mode 100755 index 000000000..63b504fb2 Binary files /dev/null and b/static/contribute/development/open-pull-request.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/adding-a-github-pages-step.png b/static/hosting-and-deployment/deployment-with-wercker/adding-a-github-pages-step.png new file mode 100755 index 000000000..ff28a0661 Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/adding-a-github-pages-step.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/adding-the-project-to-github.png b/static/hosting-and-deployment/deployment-with-wercker/adding-the-project-to-github.png new file mode 100755 index 000000000..e1065bb00 Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/adding-the-project-to-github.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/and-we-ve-got-an-app.png b/static/hosting-and-deployment/deployment-with-wercker/and-we-ve-got-an-app.png new file mode 100755 index 000000000..7f8e10e70 Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/and-we-ve-got-an-app.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/configure-the-deploy-step.png b/static/hosting-and-deployment/deployment-with-wercker/configure-the-deploy-step.png new file mode 100755 index 000000000..550ea1bf2 Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/configure-the-deploy-step.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/creating-a-basic-hugo-site.png b/static/hosting-and-deployment/deployment-with-wercker/creating-a-basic-hugo-site.png new file mode 100755 index 000000000..78d238f88 Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/creating-a-basic-hugo-site.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/public-or-not.png b/static/hosting-and-deployment/deployment-with-wercker/public-or-not.png new file mode 100755 index 000000000..9d81a8ba4 Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/public-or-not.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/using-hugo-build.png b/static/hosting-and-deployment/deployment-with-wercker/using-hugo-build.png new file mode 100755 index 000000000..b0dbec94c Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/using-hugo-build.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/wercker-access.png b/static/hosting-and-deployment/deployment-with-wercker/wercker-access.png new file mode 100755 index 000000000..6e89c0ef3 Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/wercker-access.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/wercker-account-settings.png b/static/hosting-and-deployment/deployment-with-wercker/wercker-account-settings.png new file mode 100644 index 000000000..993a1d9e9 Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/wercker-account-settings.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/wercker-add-app.png b/static/hosting-and-deployment/deployment-with-wercker/wercker-add-app.png new file mode 100755 index 000000000..94ccef518 Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/wercker-add-app.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/wercker-git-connections.png b/static/hosting-and-deployment/deployment-with-wercker/wercker-git-connections.png new file mode 100755 index 000000000..d89c0cd8b Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/wercker-git-connections.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/wercker-search.png b/static/hosting-and-deployment/deployment-with-wercker/wercker-search.png new file mode 100755 index 000000000..d099cfd5c Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/wercker-search.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/wercker-select-owner.png b/static/hosting-and-deployment/deployment-with-wercker/wercker-select-owner.png new file mode 100755 index 000000000..111308508 Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/wercker-select-owner.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/wercker-select-repository.png b/static/hosting-and-deployment/deployment-with-wercker/wercker-select-repository.png new file mode 100755 index 000000000..e8835f21a Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/wercker-select-repository.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/wercker-sign-up-page.png b/static/hosting-and-deployment/deployment-with-wercker/wercker-sign-up-page.png new file mode 100644 index 000000000..28f469649 Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/wercker-sign-up-page.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/wercker-sign-up.png b/static/hosting-and-deployment/deployment-with-wercker/wercker-sign-up.png new file mode 100644 index 000000000..f24996889 Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/wercker-sign-up.png differ diff --git a/static/hosting-and-deployment/deployment-with-wercker/werckeryml.png b/static/hosting-and-deployment/deployment-with-wercker/werckeryml.png new file mode 100755 index 000000000..be46e6136 Binary files /dev/null and b/static/hosting-and-deployment/deployment-with-wercker/werckeryml.png differ diff --git a/static/hosting-and-deployment/hosting-on-bitbucket/bitbucket-blog-post.png b/static/hosting-and-deployment/hosting-on-bitbucket/bitbucket-blog-post.png new file mode 100755 index 000000000..b78f6fd15 Binary files /dev/null and b/static/hosting-and-deployment/hosting-on-bitbucket/bitbucket-blog-post.png differ diff --git a/static/hosting-and-deployment/hosting-on-bitbucket/bitbucket-create-repo.png b/static/hosting-and-deployment/hosting-on-bitbucket/bitbucket-create-repo.png new file mode 100755 index 000000000..e97f13465 Binary files /dev/null and b/static/hosting-and-deployment/hosting-on-bitbucket/bitbucket-create-repo.png differ diff --git a/static/hosting-and-deployment/hosting-on-netlify/netlify-add-new-site.jpg b/static/hosting-and-deployment/hosting-on-netlify/netlify-add-new-site.jpg new file mode 100644 index 000000000..17698d34a Binary files /dev/null and b/static/hosting-and-deployment/hosting-on-netlify/netlify-add-new-site.jpg differ diff --git a/static/hosting-and-deployment/hosting-on-netlify/netlify-authorize-added-permissions.jpg b/static/hosting-and-deployment/hosting-on-netlify/netlify-authorize-added-permissions.jpg new file mode 100644 index 000000000..eaae924e4 Binary files /dev/null and b/static/hosting-and-deployment/hosting-on-netlify/netlify-authorize-added-permissions.jpg differ diff --git a/static/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-1.jpg b/static/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-1.jpg new file mode 100644 index 000000000..347477dd2 Binary files /dev/null and b/static/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-1.jpg differ diff --git a/static/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-2.jpg b/static/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-2.jpg new file mode 100644 index 000000000..18bfd6fed Binary files /dev/null and b/static/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-2.jpg differ diff --git a/static/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-3.jpg b/static/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-3.jpg new file mode 100644 index 000000000..6f9b6477c Binary files /dev/null and b/static/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-3.jpg differ diff --git a/static/hosting-and-deployment/hosting-on-netlify/netlify-deploy-published.jpg b/static/hosting-and-deployment/hosting-on-netlify/netlify-deploy-published.jpg new file mode 100644 index 000000000..ed5eaf3c8 Binary files /dev/null and b/static/hosting-and-deployment/hosting-on-netlify/netlify-deploy-published.jpg differ diff --git a/static/hosting-and-deployment/hosting-on-netlify/netlify-deploying-site.gif b/static/hosting-and-deployment/hosting-on-netlify/netlify-deploying-site.gif new file mode 100644 index 000000000..c1f27c236 Binary files /dev/null and b/static/hosting-and-deployment/hosting-on-netlify/netlify-deploying-site.gif differ diff --git a/static/hosting-and-deployment/hosting-on-netlify/netlify-first-authorize.jpg b/static/hosting-and-deployment/hosting-on-netlify/netlify-first-authorize.jpg new file mode 100644 index 000000000..748122e89 Binary files /dev/null and b/static/hosting-and-deployment/hosting-on-netlify/netlify-first-authorize.jpg differ diff --git a/static/hosting-and-deployment/hosting-on-netlify/netlify-live-site.jpg b/static/hosting-and-deployment/hosting-on-netlify/netlify-live-site.jpg new file mode 100644 index 000000000..3edc49c43 Binary files /dev/null and b/static/hosting-and-deployment/hosting-on-netlify/netlify-live-site.jpg differ diff --git a/static/hosting-and-deployment/hosting-on-netlify/netlify-push-to-deploy.jpg b/static/hosting-and-deployment/hosting-on-netlify/netlify-push-to-deploy.jpg new file mode 100644 index 000000000..f23626218 Binary files /dev/null and b/static/hosting-and-deployment/hosting-on-netlify/netlify-push-to-deploy.jpg differ diff --git a/static/hosting-and-deployment/hosting-on-netlify/netlify-signup.jpg b/static/hosting-and-deployment/hosting-on-netlify/netlify-signup.jpg new file mode 100644 index 000000000..cd9a218b4 Binary files /dev/null and b/static/hosting-and-deployment/hosting-on-netlify/netlify-signup.jpg differ diff --git a/static/hosting-and-deployment/hosting-on-netlify/tibobeijennl.jpg b/static/hosting-and-deployment/hosting-on-netlify/tibobeijennl.jpg new file mode 100644 index 000000000..ad8726820 Binary files /dev/null and b/static/hosting-and-deployment/hosting-on-netlify/tibobeijennl.jpg differ diff --git a/static/images/contribute/development/accept-cla.png b/static/images/contribute/development/accept-cla.png new file mode 100755 index 000000000..929fda6ab Binary files /dev/null and b/static/images/contribute/development/accept-cla.png differ diff --git a/static/images/contribute/development/ci-errors.png b/static/images/contribute/development/ci-errors.png new file mode 100755 index 000000000..95cd290b6 Binary files /dev/null and b/static/images/contribute/development/ci-errors.png differ diff --git a/static/images/contribute/development/copy-remote-url.png b/static/images/contribute/development/copy-remote-url.png new file mode 100755 index 000000000..9006f4a48 Binary files /dev/null and b/static/images/contribute/development/copy-remote-url.png differ diff --git a/static/images/contribute/development/forking-a-repository.png b/static/images/contribute/development/forking-a-repository.png new file mode 100755 index 000000000..ea132cab3 Binary files /dev/null and b/static/images/contribute/development/forking-a-repository.png differ diff --git a/static/images/contribute/development/open-pull-request.png b/static/images/contribute/development/open-pull-request.png new file mode 100755 index 000000000..63b504fb2 Binary files /dev/null and b/static/images/contribute/development/open-pull-request.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/adding-a-github-pages-step.png b/static/images/hosting-and-deployment/deployment-with-wercker/adding-a-github-pages-step.png new file mode 100755 index 000000000..ff28a0661 Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/adding-a-github-pages-step.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/adding-the-project-to-github.png b/static/images/hosting-and-deployment/deployment-with-wercker/adding-the-project-to-github.png new file mode 100755 index 000000000..e1065bb00 Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/adding-the-project-to-github.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/and-we-ve-got-an-app.png b/static/images/hosting-and-deployment/deployment-with-wercker/and-we-ve-got-an-app.png new file mode 100755 index 000000000..7f8e10e70 Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/and-we-ve-got-an-app.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/configure-the-deploy-step.png b/static/images/hosting-and-deployment/deployment-with-wercker/configure-the-deploy-step.png new file mode 100755 index 000000000..550ea1bf2 Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/configure-the-deploy-step.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/creating-a-basic-hugo-site.png b/static/images/hosting-and-deployment/deployment-with-wercker/creating-a-basic-hugo-site.png new file mode 100755 index 000000000..78d238f88 Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/creating-a-basic-hugo-site.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/public-or-not.png b/static/images/hosting-and-deployment/deployment-with-wercker/public-or-not.png new file mode 100755 index 000000000..9d81a8ba4 Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/public-or-not.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/using-hugo-build.png b/static/images/hosting-and-deployment/deployment-with-wercker/using-hugo-build.png new file mode 100755 index 000000000..b0dbec94c Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/using-hugo-build.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/wercker-access.png b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-access.png new file mode 100755 index 000000000..6e89c0ef3 Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-access.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/wercker-account-settings.png b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-account-settings.png new file mode 100644 index 000000000..993a1d9e9 Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-account-settings.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/wercker-add-app.png b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-add-app.png new file mode 100755 index 000000000..94ccef518 Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-add-app.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/wercker-git-connections.png b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-git-connections.png new file mode 100755 index 000000000..d89c0cd8b Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-git-connections.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/wercker-search.png b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-search.png new file mode 100755 index 000000000..d099cfd5c Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-search.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/wercker-select-owner.png b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-select-owner.png new file mode 100755 index 000000000..111308508 Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-select-owner.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/wercker-select-repository.png b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-select-repository.png new file mode 100755 index 000000000..e8835f21a Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-select-repository.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/wercker-sign-up-page.png b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-sign-up-page.png new file mode 100644 index 000000000..28f469649 Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-sign-up-page.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/wercker-sign-up.png b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-sign-up.png new file mode 100644 index 000000000..f24996889 Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/wercker-sign-up.png differ diff --git a/static/images/hosting-and-deployment/deployment-with-wercker/werckeryml.png b/static/images/hosting-and-deployment/deployment-with-wercker/werckeryml.png new file mode 100755 index 000000000..be46e6136 Binary files /dev/null and b/static/images/hosting-and-deployment/deployment-with-wercker/werckeryml.png differ diff --git a/static/images/hosting-and-deployment/hosting-on-bitbucket/bitbucket-blog-post.png b/static/images/hosting-and-deployment/hosting-on-bitbucket/bitbucket-blog-post.png new file mode 100755 index 000000000..b78f6fd15 Binary files /dev/null and b/static/images/hosting-and-deployment/hosting-on-bitbucket/bitbucket-blog-post.png differ diff --git a/static/images/hosting-and-deployment/hosting-on-bitbucket/bitbucket-create-repo.png b/static/images/hosting-and-deployment/hosting-on-bitbucket/bitbucket-create-repo.png new file mode 100755 index 000000000..e97f13465 Binary files /dev/null and b/static/images/hosting-and-deployment/hosting-on-bitbucket/bitbucket-create-repo.png differ diff --git a/static/images/hosting-and-deployment/hosting-on-netlify/netlify-add-new-site.jpg b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-add-new-site.jpg new file mode 100644 index 000000000..17698d34a Binary files /dev/null and b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-add-new-site.jpg differ diff --git a/static/images/hosting-and-deployment/hosting-on-netlify/netlify-authorize-added-permissions.jpg b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-authorize-added-permissions.jpg new file mode 100644 index 000000000..eaae924e4 Binary files /dev/null and b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-authorize-added-permissions.jpg differ diff --git a/static/images/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-1.jpg b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-1.jpg new file mode 100644 index 000000000..347477dd2 Binary files /dev/null and b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-1.jpg differ diff --git a/static/images/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-2.jpg b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-2.jpg new file mode 100644 index 000000000..18bfd6fed Binary files /dev/null and b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-2.jpg differ diff --git a/static/images/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-3.jpg b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-3.jpg new file mode 100644 index 000000000..6f9b6477c Binary files /dev/null and b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-create-new-site-step-3.jpg differ diff --git a/static/images/hosting-and-deployment/hosting-on-netlify/netlify-deploy-published.jpg b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-deploy-published.jpg new file mode 100644 index 000000000..ed5eaf3c8 Binary files /dev/null and b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-deploy-published.jpg differ diff --git a/static/images/hosting-and-deployment/hosting-on-netlify/netlify-deploying-site.gif b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-deploying-site.gif new file mode 100644 index 000000000..c1f27c236 Binary files /dev/null and b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-deploying-site.gif differ diff --git a/static/images/hosting-and-deployment/hosting-on-netlify/netlify-first-authorize.jpg b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-first-authorize.jpg new file mode 100644 index 000000000..748122e89 Binary files /dev/null and b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-first-authorize.jpg differ diff --git a/static/images/hosting-and-deployment/hosting-on-netlify/netlify-live-site.jpg b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-live-site.jpg new file mode 100644 index 000000000..3edc49c43 Binary files /dev/null and b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-live-site.jpg differ diff --git a/static/images/hosting-and-deployment/hosting-on-netlify/netlify-push-to-deploy.jpg b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-push-to-deploy.jpg new file mode 100644 index 000000000..f23626218 Binary files /dev/null and b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-push-to-deploy.jpg differ diff --git a/static/images/hosting-and-deployment/hosting-on-netlify/netlify-signup.jpg b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-signup.jpg new file mode 100644 index 000000000..cd9a218b4 Binary files /dev/null and b/static/images/hosting-and-deployment/hosting-on-netlify/netlify-signup.jpg differ diff --git a/static/images/hosting-and-deployment/hosting-on-netlify/tibobeijennl.jpg b/static/images/hosting-and-deployment/hosting-on-netlify/tibobeijennl.jpg new file mode 100644 index 000000000..ad8726820 Binary files /dev/null and b/static/images/hosting-and-deployment/hosting-on-netlify/tibobeijennl.jpg differ diff --git a/static/images/icon-custom-outputs.svg b/static/images/icon-custom-outputs.svg new file mode 100644 index 000000000..ccf581f31 --- /dev/null +++ b/static/images/icon-custom-outputs.svg @@ -0,0 +1,36 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/images/quickstart/bookshelf-bleak-theme.png b/static/images/quickstart/bookshelf-bleak-theme.png new file mode 100755 index 000000000..ccd18c42d Binary files /dev/null and b/static/images/quickstart/bookshelf-bleak-theme.png differ diff --git a/static/images/quickstart/bookshelf-disqus.png b/static/images/quickstart/bookshelf-disqus.png new file mode 100755 index 000000000..3ce645a0c Binary files /dev/null and b/static/images/quickstart/bookshelf-disqus.png differ diff --git a/static/images/quickstart/bookshelf-new-default-image.png b/static/images/quickstart/bookshelf-new-default-image.png new file mode 100755 index 000000000..d7274c7a6 Binary files /dev/null and b/static/images/quickstart/bookshelf-new-default-image.png differ diff --git a/static/images/quickstart/bookshelf-only-picture.png b/static/images/quickstart/bookshelf-only-picture.png new file mode 100755 index 000000000..a363383bc Binary files /dev/null and b/static/images/quickstart/bookshelf-only-picture.png differ diff --git a/static/images/quickstart/bookshelf-robust-theme.png b/static/images/quickstart/bookshelf-robust-theme.png new file mode 100755 index 000000000..7c5e6b8d2 Binary files /dev/null and b/static/images/quickstart/bookshelf-robust-theme.png differ diff --git a/static/images/quickstart/bookshelf-updated-config.png b/static/images/quickstart/bookshelf-updated-config.png new file mode 100755 index 000000000..bbda606c7 Binary files /dev/null and b/static/images/quickstart/bookshelf-updated-config.png differ diff --git a/static/images/quickstart/bookshelf.png b/static/images/quickstart/bookshelf.png new file mode 100755 index 000000000..3b572adbb Binary files /dev/null and b/static/images/quickstart/bookshelf.png differ diff --git a/static/images/quickstart/default.jpg b/static/images/quickstart/default.jpg new file mode 100755 index 000000000..78d7bd28e Binary files /dev/null and b/static/images/quickstart/default.jpg differ diff --git a/static/images/quickstart/gh-pages-ui.png b/static/images/quickstart/gh-pages-ui.png new file mode 100644 index 000000000..3a7d10305 Binary files /dev/null and b/static/images/quickstart/gh-pages-ui.png differ diff --git a/static/images/site-hierarchy.svg b/static/images/site-hierarchy.svg new file mode 100644 index 000000000..7d1a043e8 --- /dev/null +++ b/static/images/site-hierarchy.svg @@ -0,0 +1,634 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/img/jonbeebe.net-thumbnail.png b/static/img/jonbeebe.net-thumbnail.png new file mode 100644 index 000000000..1e31d97c6 Binary files /dev/null and b/static/img/jonbeebe.net-thumbnail.png differ diff --git a/static/quickstart/bookshelf-bleak-theme.png b/static/quickstart/bookshelf-bleak-theme.png new file mode 100755 index 000000000..ccd18c42d Binary files /dev/null and b/static/quickstart/bookshelf-bleak-theme.png differ diff --git a/static/quickstart/bookshelf-disqus.png b/static/quickstart/bookshelf-disqus.png new file mode 100755 index 000000000..3ce645a0c Binary files /dev/null and b/static/quickstart/bookshelf-disqus.png differ diff --git a/static/quickstart/bookshelf-new-default-image.png b/static/quickstart/bookshelf-new-default-image.png new file mode 100755 index 000000000..d7274c7a6 Binary files /dev/null and b/static/quickstart/bookshelf-new-default-image.png differ diff --git a/static/quickstart/bookshelf-only-picture.png b/static/quickstart/bookshelf-only-picture.png new file mode 100755 index 000000000..a363383bc Binary files /dev/null and b/static/quickstart/bookshelf-only-picture.png differ diff --git a/static/quickstart/bookshelf-robust-theme.png b/static/quickstart/bookshelf-robust-theme.png new file mode 100755 index 000000000..7c5e6b8d2 Binary files /dev/null and b/static/quickstart/bookshelf-robust-theme.png differ diff --git a/static/quickstart/bookshelf-updated-config.png b/static/quickstart/bookshelf-updated-config.png new file mode 100755 index 000000000..bbda606c7 Binary files /dev/null and b/static/quickstart/bookshelf-updated-config.png differ diff --git a/static/quickstart/bookshelf.png b/static/quickstart/bookshelf.png new file mode 100755 index 000000000..3b572adbb Binary files /dev/null and b/static/quickstart/bookshelf.png differ diff --git a/static/quickstart/default.jpg b/static/quickstart/default.jpg new file mode 100755 index 000000000..78d7bd28e Binary files /dev/null and b/static/quickstart/default.jpg differ diff --git a/static/quickstart/gh-pages-ui.png b/static/quickstart/gh-pages-ui.png new file mode 100644 index 000000000..3a7d10305 Binary files /dev/null and b/static/quickstart/gh-pages-ui.png differ diff --git a/themes/gohugoioTheme b/themes/gohugoioTheme new file mode 160000 index 000000000..18141c496 --- /dev/null +++ b/themes/gohugoioTheme @@ -0,0 +1 @@ +Subproject commit 18141c496f18ac74bfef480403b4bbb69c44bbbe