Permalink
Browse files

add a page describing how to add pages

  • Loading branch information...
1 parent 5db965e commit 89615249137c9edc6055199393658c72eda20cc7 @cobyism committed Sep 10, 2012
Showing with 55 additions and 1 deletion.
  1. +55 −1 _posts/2012-07-01-pages.md
View
@@ -5,4 +5,58 @@ prev_section: posts
next_section: variables
---
-Move along, people. Nothing to see here.
+As well as [writing posts](../posts), the other thing you may want to do with your Jekyll site is create static pages. This is pretty simple to do, simply by taking advantage of the way Jekyll copies files and directories.
+
+## Homepage
+
+Just about every web server configuration you’ll come across will look for a HTML file called `index.html` (by convention) in the site root folder and display that as the homepage. Unless the web server you’re using is configured to look for some different filename as the default, this file will turn into the homepage of your Jekyll-generated site.
+
+<div class="note">
+ <h5>ProTip™: Use layouts on your homepage</h5>
+ <p>Any HTML file on your site can make use of layouts and includes, even the homepage. It’s usually a good idea to extract everything that is the same across all your pages into an included file in a layout.</p>
+</div>
+
+## Where additional pages live
+
+Where you put HTML files for pages depends on how you want the pages to work, since there are two main ways of creating pages:
+
+- By placing named HTML files for each page in the site root folder.
+- Create a folder in the site root for each page, and placing an index.html file in each page folder.
+
+Both methods work fine (and can be used in conduction with each other), with the only real difference being the resulting URLs each page has.
+
+### Named HTML files
+
+The simplest way of adding a page is just to add a HTML file in the root directory with a suitable name for the page you want to create. For a site with a homepage, an about page, and a contact page, here’s what the root directory and associated URLs might look like.
+
+{% highlight bash %}
+.
+|-- _config.yml
+|-- _includes
+|-- _layouts
+|-- _posts
+|-- _site
+|-- about.html #=> http://yoursite.com/about.html
+|-- index.html #=> http://yoursite.com/
+`-- contact.html #=> http://yoursite.com/contact.html
+{% endhighlight %}
+
+### Named folders containing index HTML files
+
+There is nothing wrong with the above method, however some people like to keep their URLs free from things like filename extensions. To achieve clean URLs for pages using Jekyll, you simply need to create a folder for each top-level page you want, and then place an `index.html` file in each page’s folder. This way the page URL ends up being the folder name, and the web server will serve up the respective `index.html` file. An example of what this structure would look like is as follows:
+
+{% highlight bash %}
+.
+|-- _config.yml
+|-- _includes
+|-- _layouts
+|-- _posts
+|-- _site
+|-- about
+| `-- index.html #=> http://yoursite.com/about/
+|-- contact
+| `-- index.html #=> http://yoursite.com/contact/
+`-- index.html #=> http://yoursite.com/
+{% endhighlight %}
+
+This approach may not suit everyone, but for people who like clear URLs it’s simple and it works. In the end the decision is yours!

0 comments on commit 8961524

Please sign in to comment.