github.com/rabbouni145/gg@v0.47.1/docs/content/en/content-management/urls.md (about) 1 --- 2 title: URL Management 3 linktitle: URL Management 4 description: Hugo supports permalinks, aliases, link canonicalization, and multiple options for handling relative vs absolute URLs. 5 date: 2017-02-01 6 publishdate: 2017-02-01 7 lastmod: 2017-03-09 8 keywords: [aliases,redirects,permalinks,urls] 9 categories: [content management] 10 menu: 11 docs: 12 parent: "content-management" 13 weight: 110 14 weight: 110 #rem 15 draft: false 16 aliases: [/extras/permalinks/,/extras/aliases/,/extras/urls/,/doc/redirects/,/doc/alias/,/doc/aliases/] 17 toc: true 18 --- 19 20 ## Permalinks 21 22 The default Hugo target directory for your built website is `public/`. However, you can change this value by specifying a different `publishDir` in your [site configuration][config]. The directories created at build time for a section reflect the position of the content's directory within the `content` folder and namespace matching its layout within the `contentdir` hierarchy. 23 24 The `permalinks` option in your [site configuration][config] allows you to adjust the directory paths (i.e., the URLs) on a per-section basis. This will change where the files are written to and will change the page's internal "canonical" location, such that template references to `.RelPermalink` will honor the adjustments made as a result of the mappings in this option. 25 26 {{% note "Default Publish and Content Folders" %}} 27 These examples use the default values for `publishDir` and `contentDir`; i.e., `public` and `content`, respectively. You can override the default values in your [site's `config` file](/getting-started/configuration/). 28 {{% /note %}} 29 30 For example, if one of your [sections][] is called `post` and you want to adjust the canonical path to be hierarchical based on the year, month, and post title, you could set up the following configurations in YAML and TOML, respectively. 31 32 ### Permalinks Configuration Example 33 34 {{< code-toggle file="config" copy="false" >}} 35 permalinks: 36 post: /:year/:month/:title/ 37 {{< /code-toggle >}} 38 39 Only the content under `post/` will have the new URL structure. For example, the file `content/post/sample-entry.md` with `date: 2017-02-27T19:20:00-05:00` in its front matter will render to `public/2017/02/sample-entry/index.html` at build time and therefore be reachable at `https://example.com/2017/02/sample-entry/`. 40 41 You can also configure permalinks of taxonomies with the same syntax, by using the plural form of the taxonomy instead of the section. You will probably only want to use the configuration values `:slug` or `:title`. 42 43 ### Permalink Configuration Values 44 45 The following is a list of values that can be used in a `permalink` definition in your site `config` file. All references to time are dependent on the content's date. 46 47 `:year` 48 : the 4-digit year 49 50 `:month` 51 : the 2-digit month 52 53 `:monthname` 54 : the name of the month 55 56 `:day` 57 : the 2-digit day 58 59 `:weekday` 60 : the 1-digit day of the week (Sunday = 0) 61 62 `:weekdayname` 63 : the name of the day of the week 64 65 `:yearday` 66 : the 1- to 3-digit day of the year 67 68 `:section` 69 : the content's section 70 71 `:sections` 72 : the content's sections hierarchy 73 74 `:title` 75 : the content's title 76 77 `:slug` 78 : the content's slug (or title if no slug is provided in the front matter) 79 80 `:filename` 81 : the content's filename (without extension) 82 83 ## Aliases 84 85 For people migrating existing published content to Hugo, there's a good chance you need a mechanism to handle redirecting old URLs. 86 87 Luckily, redirects can be handled easily with **aliases** in Hugo. 88 89 ### Example: Aliases 90 91 Let's assume you create a new piece of content at `content/posts/my-awesome-blog-post.md`. The content is a revision of your previous post at `content/posts/my-original-url.md`. You can create an `aliases` field in the front matter of your new `my-awesome-blog-post.md` where you can add previous paths. The following examples show how to create this field in TOML and YAML front matter, respectively. 92 93 #### TOML Front Matter 94 95 {{< code file="content/posts/my-awesome-post.md" copy="false" >}} 96 +++ 97 aliases = [ 98 "/posts/my-original-url/", 99 "/2010/01/01/even-earlier-url.html" 100 ] 101 +++ 102 {{< /code >}} 103 104 #### YAML Front Matter 105 106 {{< code file="content/posts/my-awesome-post.md" copy="false" >}} 107 --- 108 aliases: 109 - /posts/my-original-url/ 110 - /2010/01/01/even-earlier-url.html 111 --- 112 {{< /code >}} 113 114 Now when you visit any of the locations specified in aliases---i.e., *assuming the same site domain*---you'll be redirected to the page they are specified on. For example, a visitor to `example.com/posts/my-original-url/` will be immediately redirected to `example.com/posts/my-awesome-post/`. 115 116 ### Example: Aliases in Multilingual 117 118 On [multilingual sites][multilingual], each translation of a post can have unique aliases. To use the same alias across multiple languages, prefix it with the language code. 119 120 In `/posts/my-new-post.es.md`: 121 122 ``` 123 --- 124 aliases: 125 - /es/posts/my-original-post/ 126 --- 127 ``` 128 129 ### How Hugo Aliases Work 130 131 When aliases are specified, Hugo creates a directory to match the alias entry. Inside the directory, Hugo creates an `.html` file specifying the canonical URL for the page and the new redirect target. 132 133 For example, a content file at `posts/my-intended-url.md` with the following in the front matter: 134 135 ``` 136 --- 137 title: My New post 138 aliases: [/posts/my-old-url/] 139 --- 140 ``` 141 142 Assuming a `baseURL` of `example.com`, the contents of the auto-generated alias `.html` found at `https://example.com/posts/my-old-url/` will contain the following: 143 144 ``` 145 <!DOCTYPE html> 146 <html> 147 <head> 148 <title>https://example.com/posts/my-intended-url</title> 149 <link rel="canonical" href="https://example.com/posts/my-intended-url"/> 150 <meta name="robots" content="noindex"> 151 <meta http-equiv="content-type" content="text/html; charset=utf-8"/> 152 <meta http-equiv="refresh" content="0; url=https://example.com/posts/my-intended-url"/> 153 </head> 154 </html> 155 ``` 156 157 The `http-equiv="refresh"` line is what performs the redirect, in 0 seconds in this case. If an end user of your website goes to `https://example.com/posts/my-old-url`, they will now be automatically redirected to the newer, correct URL. The addition of `<meta name="robots" content="noindex">` lets search engine bots know that they should not crawl and index your new alias page. 158 159 ### Customize 160 You may customize this alias page by creating an `alias.html` template in the 161 layouts folder of your site (i.e., `layouts/alias.html`). In this case, the data passed to the template is 162 163 `Permalink` 164 : the link to the page being aliased 165 166 `Page` 167 : the Page data for the page being aliased 168 169 ### Important Behaviors of Aliases 170 171 1. Hugo makes no assumptions about aliases. They also do not change based 172 on your UglyURLs setting. You need to provide absolute paths to your web root 173 and the complete filename or directory. 174 2. Aliases are rendered *before* any content are rendered and therefore will be overwritten by any content with the same location. 175 176 ## Pretty URLs 177 178 Hugo's default behavior is to render your content with "pretty" URLs. No non-standard server-side configuration is required for these pretty URLs to work. 179 180 The following demonstrates the concept: 181 182 ``` 183 content/posts/_index.md 184 => example.com/posts/index.html 185 content/posts/post-1.md 186 => example.com/posts/post-1/ 187 ``` 188 189 ## Ugly URLs 190 191 If you would like to have what are often referred to as "ugly URLs" (e.g., example.com/urls.html), set `uglyurls = true` or `uglyurls: true` in your site's `config.toml` or `config.yaml`, respectively. You can also use the `--uglyURLs=true` [flag from the command line][usage] with `hugo` or `hugo server`. 192 193 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. The following are examples of the same content directory and what the eventual URL structure will be when Hugo runs with its default behavior. 194 195 See [Content Organization][contentorg] for more details on paths. 196 197 ``` 198 . 199 └── content 200 └── about 201 | └── _index.md // <- https://example.com/about/ 202 ├── post 203 | ├── firstpost.md // <- https://example.com/post/firstpost/ 204 | ├── happy 205 | | └── ness.md // <- https://example.com/post/happy/ness/ 206 | └── secondpost.md // <- https://example.com/post/secondpost/ 207 └── quote 208 ├── first.md // <- https://example.com/quote/first/ 209 └── second.md // <- https://example.com/quote/second/ 210 ``` 211 212 Here's the same organization run with `hugo --uglyURLs`: 213 214 ``` 215 . 216 └── content 217 └── about 218 | └── _index.md // <- https://example.com/about.html 219 ├── post 220 | ├── firstpost.md // <- https://example.com/post/firstpost.html 221 | ├── happy 222 | | └── ness.md // <- https://example.com/post/happy/ness.html 223 | └── secondpost.md // <- https://example.com/post/secondpost.html 224 └── quote 225 ├── first.md // <- https://example.com/quote/first.html 226 └── second.md // <- https://example.com/quote/second.html 227 ``` 228 229 230 ## Canonicalization 231 232 By default, all relative URLs encountered in the input are left unmodified, e.g. `/css/foo.css` would stay as `/css/foo.css`. The `canonifyURLs` field in your site `config` has a default value of `false`. 233 234 By setting `canonifyURLs` to `true`, all relative URLs would instead be *canonicalized* using `baseURL`. For example, assuming you have `baseURL = https://example.com/`, the relative URL `/css/foo.css` would be turned into the absolute URL `https://example.com/css/foo.css`. 235 236 Benefits of canonicalization include fixing all URLs to be absolute, which may aid with some parsing tasks. Note, however, that all modern browsers handle this on the client without issue. 237 238 Benefits of non-canonicalization include being able to have scheme-relative resource inclusion; e.g., so that `http` vs `https` can be decided according to how the page was retrieved. 239 240 {{% note "`canonifyURLs` default change" %}} 241 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. Please verify and adjust your website accordingly if you are upgrading from v0.10 or older versions. 242 {{% /note %}} 243 244 To find out the current value of `canonifyURLs` for your website, you may use the handy `hugo config` command added in v0.13. 245 246 ``` 247 hugo config | grep -i canon 248 ``` 249 250 Or, if you are on Windows and do not have `grep` installed: 251 252 ``` 253 hugo config | FINDSTR /I canon 254 ``` 255 256 ## Override URLs with Front Matter 257 258 In addition to specifying permalink values in your site configuration for different content sections, Hugo provides even more granular control for individual pieces of content. 259 260 Both `slug` and `url` can be defined in individual front matter. For more information on content destinations at build time, see [Content Organization][contentorg]. 261 262 ## Relative URLs 263 264 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. 265 266 Setting `relativeURLs` to `true` in your [site configuration][config] will cause Hugo to rewrite all relative URLs to be relative to the current content. 267 268 For example, if your `/post/first/` page contains a link to `/about/`, Hugo will rewrite the URL to `../../about/`. 269 270 [config]: /getting-started/configuration/ 271 [contentorg]: /content-management/organization/ 272 [front matter]: /content-management/front-matter/ 273 [multilingual]: /content-management/multilingual/ 274 [sections]: /content-management/sections/ 275 [usage]: /getting-started/usage/