jekyll 1.0.0.beta3 → 1.0.0.beta4
Sign up to get free protection for your applications and to get access to all the features.
Potentially problematic release.
This version of jekyll might be problematic. Click here for more details.
- data/CONTRIBUTING.md +3 -2
- data/History.txt +10 -0
- data/README.textile +1 -2
- data/bin/jekyll +1 -4
- data/features/step_definitions/jekyll_steps.rb +0 -8
- data/jekyll.gemspec +5 -4
- data/lib/jekyll.rb +13 -3
- data/lib/jekyll/filters.rb +14 -0
- data/lib/jekyll/generators/pagination.rb +20 -8
- data/lib/jekyll/post.rb +4 -0
- data/lib/jekyll/site.rb +1 -0
- data/site/_posts/2012-07-01-configuration.md +84 -83
- data/site/_posts/2012-07-01-contributing.md +58 -37
- data/site/_posts/2012-07-01-extras.md +43 -31
- data/site/_posts/2012-07-01-frontmatter.md +60 -16
- data/site/_posts/2012-07-01-github-pages.md +39 -8
- data/site/_posts/2012-07-01-home.md +30 -11
- data/site/_posts/2012-07-01-installation.md +31 -8
- data/site/_posts/2012-07-01-migrations.md +34 -10
- data/site/_posts/2012-07-01-pages.md +49 -26
- data/site/_posts/2012-07-01-pagination.md +136 -43
- data/site/_posts/2012-07-01-permalinks.md +25 -15
- data/site/_posts/2012-07-01-plugins.md +94 -50
- data/site/_posts/2012-07-01-posts.md +75 -24
- data/site/_posts/2012-07-01-structure.md +68 -8
- data/site/_posts/2012-07-01-templates.md +62 -45
- data/site/_posts/2012-07-01-usage.md +36 -17
- data/site/_posts/2012-07-01-variables.md +133 -23
- data/site/css/style.css +1 -1
- data/test/source/_posts/2013-03-19-not-a-post.markdown/.gitkeep +0 -0
- data/test/test_filters.rb +17 -0
- data/test/test_post.rb +23 -0
- data/test/test_site.rb +3 -1
- metadata +11 -4
|
@@ -4,30 +4,45 @@ title: Welcome
|
|
|
4
4
|
next_section: installation
|
|
5
5
|
---
|
|
6
6
|
|
|
7
|
-
This site aims to be a comprehensive guide to Jekyll. We’ll cover everything
|
|
7
|
+
This site aims to be a comprehensive guide to Jekyll. We’ll cover everything
|
|
8
|
+
from getting your site up and running, creating and managing your content,
|
|
9
|
+
customizing the way your site works and looks, deploying to various
|
|
10
|
+
environments, as well as some advice on participating in the future development
|
|
11
|
+
of Jekyll itself.
|
|
8
12
|
|
|
9
13
|
## So what is Jekyll, exactly?
|
|
10
14
|
|
|
11
|
-
Jekyll is a simple, blog-aware, static site generator. It takes a template
|
|
15
|
+
Jekyll is a simple, blog-aware, static site generator. It takes a template
|
|
16
|
+
directory containing raw text files in various formats, runs it through
|
|
17
|
+
[Markdown](http://daringfireball.net/projects/markdown/) (or
|
|
18
|
+
[Textile](http://textile.sitemonks.com/)) and [Liquid](http://liquidmarkup.org/)
|
|
19
|
+
converters, and spits out a complete, ready-to-publish static website suitable
|
|
20
|
+
for serving with your favorite web server. Jekyll also happens to be the engine
|
|
21
|
+
behind [GitHub Pages](http://pages.github.com), which means you can use Jekyll
|
|
22
|
+
to host your project’s page, blog, or website from GitHub’s servers **for
|
|
23
|
+
free**.
|
|
12
24
|
|
|
13
25
|
## Quick-start guide
|
|
14
26
|
|
|
15
|
-
For the impatient, here's how to get Jekyll up and running.
|
|
27
|
+
For the impatient, here's how to get a boilerplate Jekyll site up and running.
|
|
16
28
|
|
|
17
29
|
{% highlight bash %}
|
|
18
30
|
~ $ gem install jekyll
|
|
19
|
-
~ $
|
|
20
|
-
~ $ cd
|
|
21
|
-
|
|
22
|
-
~/my/new/site $ jekyll serve
|
|
31
|
+
~ $ jekyll new myblog
|
|
32
|
+
~ $ cd myblog
|
|
33
|
+
~/myblog $ jekyll serve
|
|
23
34
|
# => Now browse to http://localhost:4000
|
|
24
35
|
{% endhighlight %}
|
|
25
36
|
|
|
26
|
-
That's nothing though. The real magic happens when you start creating
|
|
37
|
+
That's nothing, though. The real magic happens when you start creating blog
|
|
38
|
+
posts, using the front-matter to control templates and layouts, and taking
|
|
39
|
+
advantage of all the awesome configuration options Jekyll makes available.
|
|
27
40
|
|
|
28
41
|
## ProTips™, Notes, and Warnings
|
|
29
42
|
|
|
30
|
-
Throughout this guide there are a number of small-but-handy pieces of
|
|
43
|
+
Throughout this guide there are a number of small-but-handy pieces of
|
|
44
|
+
information that can make using Jekyll easier, more interesting, and less
|
|
45
|
+
hazardous. Here’s what to look out for.
|
|
31
46
|
|
|
32
47
|
<div class="note">
|
|
33
48
|
<h5>ProTips™ help you get more from Jekyll</h5>
|
|
@@ -36,7 +51,8 @@ Throughout this guide there are a number of small-but-handy pieces of informatio
|
|
|
36
51
|
|
|
37
52
|
<div class="note info">
|
|
38
53
|
<h5>Notes are handy pieces of information</h5>
|
|
39
|
-
<p>These are for the extra tidbits sometimes necessary to understand
|
|
54
|
+
<p>These are for the extra tidbits sometimes necessary to understand
|
|
55
|
+
Jekyll.</p>
|
|
40
56
|
</div>
|
|
41
57
|
|
|
42
58
|
<div class="note warning">
|
|
@@ -44,4 +60,7 @@ Throughout this guide there are a number of small-but-handy pieces of informatio
|
|
|
44
60
|
<p>Be aware of these messages if you wish to avoid certain death.</p>
|
|
45
61
|
</div>
|
|
46
62
|
|
|
47
|
-
If you come across anything along the way that we haven’t covered, or if you
|
|
63
|
+
If you come across anything along the way that we haven’t covered, or if you
|
|
64
|
+
know of a tip you think others would find handy, please [file an
|
|
65
|
+
issue](https://github.com/mojombo/jekyll/issues/new) and we’ll see about
|
|
66
|
+
including it in this guide.
|
|
@@ -5,11 +5,15 @@ prev_section: home
|
|
|
5
5
|
next_section: usage
|
|
6
6
|
---
|
|
7
7
|
|
|
8
|
-
Getting Jekyll installed and ready-to-go should only take a few minutes. If it
|
|
8
|
+
Getting Jekyll installed and ready-to-go should only take a few minutes. If it
|
|
9
|
+
ever becomes a pain in the ass, please [file an
|
|
10
|
+
issue](https://github.com/mojombo/jekyll/issues/new) (or submit a pull request)
|
|
11
|
+
describing the issue you encountered, and how we might make the process easier.
|
|
9
12
|
|
|
10
13
|
### Requirements
|
|
11
14
|
|
|
12
|
-
Installing Jekyll is easy and straight-forward, but there
|
|
15
|
+
Installing Jekyll is easy and straight-forward, but there are a few requirements
|
|
16
|
+
you’ll need to make sure your system has before you start.
|
|
13
17
|
|
|
14
18
|
- [Ruby](http://www.ruby-lang.org/en/downloads/)
|
|
15
19
|
- [RubyGems](http://rubygems.org/pages/download)
|
|
@@ -17,27 +21,46 @@ Installing Jekyll is easy and straight-forward, but there’s a few requirements
|
|
|
17
21
|
|
|
18
22
|
<div class="note info">
|
|
19
23
|
<h5>Running Jekyll on Windows</h5>
|
|
20
|
-
<p>
|
|
24
|
+
<p>
|
|
25
|
+
It is possible to get
|
|
26
|
+
<a href="http://www.madhur.co.in/blog/2011/09/01/runningjekyllwindows.html">
|
|
27
|
+
Jekyll running on Windows</a>, but the official documentation does not
|
|
28
|
+
support installation on Windows platforms.
|
|
29
|
+
</p>
|
|
21
30
|
</div>
|
|
22
31
|
|
|
23
32
|
## Install with RubyGems
|
|
24
33
|
|
|
25
34
|
The best way to install Jekyll is via
|
|
26
|
-
[RubyGems](http://docs.rubygems.org/read/chapter/3). At the terminal prompt,
|
|
35
|
+
[RubyGems](http://docs.rubygems.org/read/chapter/3). At the terminal prompt,
|
|
36
|
+
simply run the following command to install Jekyll:
|
|
27
37
|
|
|
28
38
|
{% highlight bash %}
|
|
29
|
-
gem install jekyll
|
|
39
|
+
$ gem install jekyll
|
|
30
40
|
{% endhighlight %}
|
|
31
41
|
|
|
32
|
-
All Jekyll’s gem
|
|
42
|
+
All Jekyll’s gem dependencies are automatically installed by the above command,
|
|
43
|
+
so you won’t have to worry about them at all. If you have problems installing
|
|
44
|
+
Jekyll, check out the [troubleshooting](../troubleshooting) page or [report an
|
|
45
|
+
issue](https://github.com/mojombo/jekyll/issues/new) so the Jekyll community can
|
|
46
|
+
improve the experience for everyone.
|
|
33
47
|
|
|
34
48
|
## Optional Extras
|
|
35
49
|
|
|
36
|
-
There are a number of (optional) extra features that Jekyll supports that you
|
|
50
|
+
There are a number of (optional) extra features that Jekyll supports that you
|
|
51
|
+
may want to install, depending on how you plan to use Jekyll. These extras
|
|
52
|
+
include syntax highlighting of code snippets using
|
|
53
|
+
[Pygments](http://pygments.org/), LaTeX support, and the use of alternative
|
|
54
|
+
content rendering engines. Check out [the extras page](../extras) for more
|
|
55
|
+
information.
|
|
37
56
|
|
|
38
57
|
<div class="note">
|
|
39
58
|
<h5>ProTip™: Enable Syntax Highlighting</h5>
|
|
40
|
-
<p>
|
|
59
|
+
<p>
|
|
60
|
+
If you’re the kind of person who is using Jekyll, then chances are you’ll
|
|
61
|
+
want to enable syntax highlighting using Pygments. You should really
|
|
62
|
+
<a href="../extras">check out how to do that</a> before you go any further.
|
|
63
|
+
</p>
|
|
41
64
|
</div>
|
|
42
65
|
|
|
43
66
|
Now that you’ve got everything installed, let’s get to work!
|
|
@@ -5,29 +5,53 @@ prev_section: variables
|
|
|
5
5
|
next_section: templates
|
|
6
6
|
---
|
|
7
7
|
|
|
8
|
-
If you’re switching to Jekyll from another blogging system, Jekyll’s
|
|
8
|
+
If you’re switching to Jekyll from another blogging system, Jekyll’s importers
|
|
9
|
+
can help you with the move. Most methods listed on this page require read access
|
|
10
|
+
to the database to generate posts from your old system. Each method generates
|
|
11
|
+
`.markdown` posts in the `_posts` directory based on the entries in the foreign
|
|
12
|
+
system.
|
|
9
13
|
|
|
10
14
|
## Preparing for migrations
|
|
11
15
|
|
|
12
|
-
|
|
16
|
+
Because the importers have many of their own dependencies, they are made
|
|
17
|
+
available via a separate gem called `jekyll-import`. To use them, all you need
|
|
18
|
+
to do is install the gem, and they will become available as part of Jekyll's
|
|
19
|
+
standard command line interface.
|
|
13
20
|
|
|
14
21
|
{% highlight bash %}
|
|
15
|
-
$
|
|
16
|
-
$ gem install sequel mysqlplus
|
|
22
|
+
$ gem install jekyll-import
|
|
17
23
|
{% endhighlight %}
|
|
18
24
|
|
|
19
|
-
You should now be all set to run the
|
|
25
|
+
You should now be all set to run the importers below. If you ever get stuck, you
|
|
26
|
+
can see help for each importer:
|
|
27
|
+
|
|
28
|
+
{% highlight bash %}
|
|
29
|
+
$ jekyll help import # => See list of importers
|
|
30
|
+
$ jekyll help import IMPORTER # => See importer specific help
|
|
31
|
+
{% endhighlight %}
|
|
32
|
+
|
|
33
|
+
Where IMPORTER is the name of the specific importer.
|
|
20
34
|
|
|
21
35
|
<div class="note info">
|
|
22
36
|
<h5>Note: Always double-check migrated content</h5>
|
|
23
|
-
<p>
|
|
37
|
+
<p>
|
|
38
|
+
|
|
39
|
+
Importers may not distinguish between published or private posts, so
|
|
40
|
+
you should always check that the content Jekyll generates for you appears as
|
|
41
|
+
you intended.
|
|
42
|
+
|
|
43
|
+
</p>
|
|
24
44
|
</div>
|
|
25
45
|
|
|
46
|
+
<!-- TODO all these need to be fixed -->
|
|
47
|
+
|
|
26
48
|
## WordPress
|
|
27
49
|
|
|
28
50
|
### Wordpress export files
|
|
29
51
|
|
|
30
|
-
If hpricot is not already installed, you will need to run `gem install hpricot`.
|
|
52
|
+
If hpricot is not already installed, you will need to run `gem install hpricot`.
|
|
53
|
+
Next, export your blog using the Wordpress export utility. Assuming that the
|
|
54
|
+
exported file is saved as `wordpress.xml`, here is the command you need to run:
|
|
31
55
|
|
|
32
56
|
{% highlight bash %}
|
|
33
57
|
$ ruby -rubygems -e 'require "jekyll/migrators/wordpressdotcom";
|
|
@@ -48,7 +72,7 @@ $ ruby -rubygems -e 'require "jekyll/migrators/wordpress";
|
|
|
48
72
|
Jekyll::WordPress.process("database", "user", "pass")'
|
|
49
73
|
{% endhighlight %}
|
|
50
74
|
|
|
51
|
-
If you are using Webfaction and have to set an [SSH tunnel](http://docs.webfaction.com/user-guide/databases.html?highlight=mysql#starting-an-ssh-tunnel-with-ssh),
|
|
75
|
+
If you are using Webfaction and have to set up an [SSH tunnel](http://docs.webfaction.com/user-guide/databases.html?highlight=mysql#starting-an-ssh-tunnel-with-ssh), be sure to make the hostname (`127.0.0.1`) explicit, otherwise MySQL may block your access based on `localhost` and `127.0.0.1` not being equivalent in its authentication system:
|
|
52
76
|
|
|
53
77
|
{% highlight bash %}
|
|
54
78
|
$ ruby -rubygems -e 'require "jekyll/migrators/wordpress";
|
|
@@ -65,7 +89,7 @@ While the above methods work, they do not import much of the metadata that is us
|
|
|
65
89
|
|
|
66
90
|
## Drupal
|
|
67
91
|
|
|
68
|
-
If you’re migrating from [Drupal](), there is [a migrator](https://github.com/mojombo/jekyll/blob/master/lib/jekyll/migrators/drupal.rb) for you too:
|
|
92
|
+
If you’re migrating from [Drupal](http://drupal.org), there is [a migrator](https://github.com/mojombo/jekyll/blob/master/lib/jekyll/migrators/drupal.rb) for you too:
|
|
69
93
|
|
|
70
94
|
{% highlight bash %}
|
|
71
95
|
$ ruby -rubygems -e 'require "jekyll/migrators/drupal";
|
|
@@ -177,4 +201,4 @@ $ ruby -rubygems -e 'require "jekyll/migrators/tumblr";
|
|
|
177
201
|
|
|
178
202
|
## Other Systems
|
|
179
203
|
|
|
180
|
-
If you have a system that there isn’t currently a migrator for, you should consider writing one and sending us a pull request.
|
|
204
|
+
If you have a system that there isn’t currently a migrator for, you should consider writing one and sending us a pull request.
|
|
@@ -5,58 +5,81 @@ prev_section: posts
|
|
|
5
5
|
next_section: variables
|
|
6
6
|
---
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
In addition to [writing posts](../posts), another thing you may want to do with
|
|
9
|
+
your Jekyll site is create static pages. By taking advantage of the way Jekyll
|
|
10
|
+
copies files and directories, this is easy to do.
|
|
9
11
|
|
|
10
12
|
## Homepage
|
|
11
13
|
|
|
12
|
-
Just about every web server configuration you
|
|
14
|
+
Just about every web server configuration you come across will look for an HTML
|
|
15
|
+
file called `index.html` (by convention) in the site's root folder and display
|
|
16
|
+
that as the homepage. Unless the web server you’re using is configured to look
|
|
17
|
+
for some different filename as the default, this file will turn into the
|
|
18
|
+
homepage of your Jekyll-generated site.
|
|
13
19
|
|
|
14
20
|
<div class="note">
|
|
15
21
|
<h5>ProTip™: Use layouts on your homepage</h5>
|
|
16
|
-
<p>
|
|
22
|
+
<p>
|
|
23
|
+
Any HTML file on your site can use layouts and/or includes, even the
|
|
24
|
+
homepage. Common content, like headers and footers, make excellent
|
|
25
|
+
candidates for extraction into a layout.
|
|
26
|
+
</p>
|
|
17
27
|
</div>
|
|
18
28
|
|
|
19
29
|
## Where additional pages live
|
|
20
30
|
|
|
21
|
-
Where you put HTML files for pages depends on how you want the pages to work
|
|
31
|
+
Where you put HTML files for pages depends on how you want the pages to work.
|
|
32
|
+
There are two main ways of creating pages:
|
|
22
33
|
|
|
23
|
-
-
|
|
24
|
-
- Create a folder in the site root for each page, and
|
|
34
|
+
- Place named HTML files for each page in your site's root folder.
|
|
35
|
+
- Create a folder in the site's root for each page, and place an index.html file
|
|
36
|
+
in each page folder.
|
|
25
37
|
|
|
26
|
-
Both methods work fine (and can be used in
|
|
38
|
+
Both methods work fine (and can be used in conjunction with each other), with the
|
|
39
|
+
only real difference being the resulting URLs.
|
|
27
40
|
|
|
28
41
|
### Named HTML files
|
|
29
42
|
|
|
30
|
-
The simplest way of adding a page is just to add
|
|
43
|
+
The simplest way of adding a page is just to add an HTML file in the root
|
|
44
|
+
directory with a suitable name for the page you want to create. For a site with
|
|
45
|
+
a homepage, an about page, and a contact page, here’s what the root directory
|
|
46
|
+
and associated URLs might look like:
|
|
31
47
|
|
|
32
48
|
{% highlight bash %}
|
|
33
49
|
.
|
|
34
50
|
|-- _config.yml
|
|
35
|
-
|-- _includes
|
|
36
|
-
|-- _layouts
|
|
37
|
-
|-- _posts
|
|
38
|
-
|-- _site
|
|
39
|
-
|-- about.html
|
|
40
|
-
|-- index.html
|
|
41
|
-
└── contact.html
|
|
51
|
+
|-- _includes/
|
|
52
|
+
|-- _layouts/
|
|
53
|
+
|-- _posts/
|
|
54
|
+
|-- _site/
|
|
55
|
+
|-- about.html # => http://yoursite.com/about.html
|
|
56
|
+
|-- index.html # => http://yoursite.com/
|
|
57
|
+
└── contact.html # => http://yoursite.com/contact.html
|
|
42
58
|
{% endhighlight %}
|
|
43
59
|
|
|
44
60
|
### Named folders containing index HTML files
|
|
45
61
|
|
|
46
|
-
There is nothing wrong with the above method, however some people like to keep
|
|
62
|
+
There is nothing wrong with the above method, however some people like to keep
|
|
63
|
+
their URLs free from things like filename extensions. To achieve clean URLs for
|
|
64
|
+
pages using Jekyll, you simply need to create a folder for each top-level page
|
|
65
|
+
you want, and then place an `index.html` file in each page’s folder. This way
|
|
66
|
+
the page URL ends up being the folder name, and the web server will serve up the
|
|
67
|
+
respective `index.html` file. Here's an example of what this structure might
|
|
68
|
+
look like:
|
|
47
69
|
|
|
48
70
|
{% highlight bash %}
|
|
49
71
|
.
|
|
50
72
|
├── _config.yml
|
|
51
|
-
├── _includes
|
|
52
|
-
├── _layouts
|
|
53
|
-
├── _posts
|
|
54
|
-
├── _site
|
|
55
|
-
├── about
|
|
56
|
-
| └── index.html
|
|
57
|
-
├── contact
|
|
58
|
-
| └── index.html
|
|
59
|
-
└── index.html
|
|
73
|
+
├── _includes/
|
|
74
|
+
├── _layouts/
|
|
75
|
+
├── _posts/
|
|
76
|
+
├── _site/
|
|
77
|
+
├── about/
|
|
78
|
+
| └── index.html # => http://yoursite.com/about/
|
|
79
|
+
├── contact/
|
|
80
|
+
| └── index.html # => http://yoursite.com/contact/
|
|
81
|
+
└── index.html # => http://yoursite.com/
|
|
60
82
|
{% endhighlight %}
|
|
61
83
|
|
|
62
|
-
This approach may not suit everyone, but for people who like
|
|
84
|
+
This approach may not suit everyone, but for people who like clean URLs it’s
|
|
85
|
+
simple and it works. In the end the decision is yours!
|
|
@@ -5,117 +5,210 @@ prev_section: permalinks
|
|
|
5
5
|
next_section: plugins
|
|
6
6
|
---
|
|
7
7
|
|
|
8
|
-
With many websites—especially blogs—it’s very common to break the main listing
|
|
8
|
+
With many websites—especially blogs—it’s very common to break the main listing
|
|
9
|
+
of posts up into smaller lists and display them over multiple pages. Jekyll has
|
|
10
|
+
pagination built-in, so you can automatically generate the appropriate files and
|
|
11
|
+
folders you need for paginated listings.
|
|
9
12
|
|
|
10
13
|
<div class="note info">
|
|
11
14
|
<h5>Pagination only works within HTML files</h5>
|
|
12
|
-
<p>
|
|
15
|
+
<p>
|
|
16
|
+
Pagination does not work with Markdown or Textile files in your Jekyll site.
|
|
17
|
+
It will only work when used within HTML files. Since you’ll likely be using
|
|
18
|
+
this for the list of Posts, this shouldn't be an issue.
|
|
19
|
+
</p>
|
|
13
20
|
</div>
|
|
14
21
|
|
|
15
22
|
## Enable pagination
|
|
16
23
|
|
|
17
|
-
|
|
24
|
+
To enable pagination for your blog, add a line to the `_config.yml` file that
|
|
25
|
+
specifies how many items should be displayed per page:
|
|
18
26
|
|
|
19
27
|
{% highlight yaml %}
|
|
20
28
|
paginate: 5
|
|
21
29
|
{% endhighlight %}
|
|
22
30
|
|
|
23
|
-
The number should be the maximum number of
|
|
31
|
+
The number should be the maximum number of Posts you’d like to be displayed per-
|
|
32
|
+
page in the generated site.
|
|
33
|
+
|
|
34
|
+
## Liquid Attributes Available
|
|
35
|
+
|
|
36
|
+
The pagination plugin exposes the `paginator` liquid object with the following
|
|
37
|
+
attributes:
|
|
38
|
+
|
|
39
|
+
<table>
|
|
40
|
+
<thead>
|
|
41
|
+
<tr>
|
|
42
|
+
<th>Attribute</th>
|
|
43
|
+
<th>Description</th>
|
|
44
|
+
</tr>
|
|
45
|
+
</thead>
|
|
46
|
+
<tbody>
|
|
47
|
+
<tr>
|
|
48
|
+
<td><p><code>page</code></p></td>
|
|
49
|
+
<td><p>current page number</p></td>
|
|
50
|
+
</tr>
|
|
51
|
+
<tr>
|
|
52
|
+
<td><p><code>per_page</code></p></td>
|
|
53
|
+
<td><p>number of posts per page</p></td>
|
|
54
|
+
</tr>
|
|
55
|
+
<tr>
|
|
56
|
+
<td><p><code>posts</code></p></td>
|
|
57
|
+
<td><p>a list of posts for the current page</p></td>
|
|
58
|
+
</tr>
|
|
59
|
+
<tr>
|
|
60
|
+
<td><p><code>total_posts</code></p></td>
|
|
61
|
+
<td><p>total number of posts in the site</p></td>
|
|
62
|
+
</tr>
|
|
63
|
+
<tr>
|
|
64
|
+
<td><p><code>total_pages</code></p></td>
|
|
65
|
+
<td><p>number of pagination pages</p></td>
|
|
66
|
+
</tr>
|
|
67
|
+
<tr>
|
|
68
|
+
<td><p><code>previous_page</code></p></td>
|
|
69
|
+
<td>
|
|
70
|
+
<p>
|
|
71
|
+
page number of the previous pagination page,
|
|
72
|
+
or <code>nil</code> if no previous page exists
|
|
73
|
+
</p>
|
|
74
|
+
</td>
|
|
75
|
+
</tr>
|
|
76
|
+
<tr>
|
|
77
|
+
<td><p><code>previous_page_path</code></p></td>
|
|
78
|
+
<td>
|
|
79
|
+
<p>
|
|
80
|
+
path of previous pagination page,
|
|
81
|
+
or <code>nil</code> if no previous page exists
|
|
82
|
+
</p>
|
|
83
|
+
</td>
|
|
84
|
+
</tr>
|
|
85
|
+
<tr>
|
|
86
|
+
<td><p><code>next_page</code></p></td>
|
|
87
|
+
<td>
|
|
88
|
+
<p>
|
|
89
|
+
page number of the next pagination page,
|
|
90
|
+
or <code>nil</code> if no subsequent page exists
|
|
91
|
+
</p>
|
|
92
|
+
</td>
|
|
93
|
+
</tr>
|
|
94
|
+
<tr>
|
|
95
|
+
<td><p><code>next_page_path</code></p></td>
|
|
96
|
+
<td>
|
|
97
|
+
<p>
|
|
98
|
+
path of next pagination page,
|
|
99
|
+
or <code>nil</code> if no subsequent page exists
|
|
100
|
+
</p>
|
|
101
|
+
</td>
|
|
102
|
+
</tr>
|
|
103
|
+
</tbody>
|
|
104
|
+
</table>
|
|
24
105
|
|
|
25
106
|
<div class="note info">
|
|
26
107
|
<h5>Pagination does not support tags or categories</h5>
|
|
27
108
|
<p>Pagination pages through every post in the <code>posts</code> variable regardless of variables defined in the YAML Front Matter of each. It does not currently allow paging over groups of posts linked by a common tag or category.</p>
|
|
28
109
|
</div>
|
|
29
110
|
|
|
30
|
-
## Render the paginated
|
|
111
|
+
## Render the paginated Posts
|
|
31
112
|
|
|
32
|
-
The next thing you need to do is to actually display your posts in a list using
|
|
113
|
+
The next thing you need to do is to actually display your posts in a list using
|
|
114
|
+
the `paginator` variable that will now be available to you. You’ll probably want
|
|
115
|
+
to do this in one of the main pages of your site. Here’s one example of a simple
|
|
116
|
+
way of rendering paginated Posts in a HTML file:
|
|
33
117
|
|
|
34
118
|
{% highlight html %}
|
|
119
|
+
{% raw %}
|
|
35
120
|
---
|
|
36
121
|
layout: default
|
|
37
122
|
title: My Blog
|
|
38
123
|
---
|
|
39
124
|
|
|
40
125
|
<!-- This loops through the paginated posts -->
|
|
41
|
-
{
|
|
42
|
-
<h1><a href="{{
|
|
126
|
+
{% for post in paginator.posts %}
|
|
127
|
+
<h1><a href="{{ post.url }}">{{ post.title }}</a></h1>
|
|
43
128
|
<p class="author">
|
|
44
|
-
<span class="date">{{
|
|
129
|
+
<span class="date">{{ post.date }}</span>
|
|
45
130
|
</p>
|
|
46
131
|
<div class="content">
|
|
47
|
-
{{
|
|
132
|
+
{{ post.content }}
|
|
48
133
|
</div>
|
|
49
|
-
{
|
|
134
|
+
{% endfor %}
|
|
50
135
|
|
|
51
136
|
<!-- Pagination links -->
|
|
52
137
|
<div class="pagination">
|
|
53
|
-
{
|
|
54
|
-
<a href="/page{{
|
|
55
|
-
{
|
|
138
|
+
{% if paginator.previous_page %}
|
|
139
|
+
<a href="/page{{ paginator.previous_page }}" class="previous">Previous</a>
|
|
140
|
+
{% else %}
|
|
56
141
|
<span class="previous">Previous</span>
|
|
57
|
-
{
|
|
58
|
-
<span class="page_number ">Page: {{
|
|
59
|
-
{
|
|
60
|
-
<a href="/page{{
|
|
61
|
-
{
|
|
142
|
+
{% endif %}
|
|
143
|
+
<span class="page_number ">Page: {{ paginator.page }} of {{ paginator.total_pages }}</span>
|
|
144
|
+
{% if paginator.next_page %}
|
|
145
|
+
<a href="/page{{ paginator.next_page }}" class="next">Next</a>
|
|
146
|
+
{% else %}
|
|
62
147
|
<span class="next ">Next</span>
|
|
63
|
-
{
|
|
148
|
+
{% endif %}
|
|
64
149
|
</div>
|
|
150
|
+
{% endraw %}
|
|
65
151
|
{% endhighlight %}
|
|
66
152
|
|
|
67
153
|
<div class="note warning">
|
|
68
154
|
<h5>Beware the page one edge-case</h5>
|
|
69
|
-
<p>
|
|
155
|
+
<p>
|
|
156
|
+
Jekyll does not generate a ‘page1’ folder, so the above code will not work
|
|
157
|
+
when a <code>/page1</code> link is produced. See below for a way to handle
|
|
158
|
+
this if it’s a problem for you.
|
|
159
|
+
</p>
|
|
70
160
|
</div>
|
|
71
161
|
|
|
72
|
-
The following HTML snippet should handle page one, and render a list of each
|
|
162
|
+
The following HTML snippet should handle page one, and render a list of each
|
|
163
|
+
page with links to all but the current page.
|
|
73
164
|
|
|
74
165
|
{% highlight html %}
|
|
166
|
+
{% raw %}
|
|
75
167
|
<div id="post-pagination" class="pagination">
|
|
76
|
-
{
|
|
168
|
+
{% if paginator.previous_page %}
|
|
77
169
|
<p class="previous">
|
|
78
|
-
{
|
|
170
|
+
{% if paginator.previous_page == 1 %}
|
|
79
171
|
<a href="/">Previous</a>
|
|
80
|
-
{
|
|
81
|
-
<a href="
|
|
82
|
-
{
|
|
172
|
+
{% else %}
|
|
173
|
+
<a href="{{ paginator.previous_page_path }}">Previous</a>
|
|
174
|
+
{% endif %}
|
|
83
175
|
</p>
|
|
84
|
-
{
|
|
176
|
+
{% else %}
|
|
85
177
|
<p class="previous disabled">
|
|
86
178
|
<span>Previous</span>
|
|
87
179
|
</p>
|
|
88
|
-
{
|
|
180
|
+
{% endif %}
|
|
89
181
|
|
|
90
182
|
<ul class="pages">
|
|
91
183
|
<li class="page">
|
|
92
|
-
{
|
|
184
|
+
{% if paginator.page == 1 %}
|
|
93
185
|
<span class="current-page">1</span>
|
|
94
|
-
{
|
|
186
|
+
{% else %}
|
|
95
187
|
<a href="/">1</a>
|
|
96
|
-
{
|
|
188
|
+
{% endif %}
|
|
97
189
|
</li>
|
|
98
190
|
|
|
99
|
-
{
|
|
191
|
+
{% for count in (2..paginator.total_pages) %}
|
|
100
192
|
<li class="page">
|
|
101
|
-
{
|
|
102
|
-
<span class="current-page">{{
|
|
103
|
-
{
|
|
104
|
-
<a href="/page{{
|
|
105
|
-
{
|
|
193
|
+
{% if count == paginator.page %}
|
|
194
|
+
<span class="current-page">{{ count }}</span>
|
|
195
|
+
{% else %}
|
|
196
|
+
<a href="/page{{ count }}">{{ count }}</a>
|
|
197
|
+
{% endif %}
|
|
106
198
|
</li>
|
|
107
|
-
{
|
|
199
|
+
{% endfor %}
|
|
108
200
|
</ul>
|
|
109
201
|
|
|
110
|
-
{
|
|
202
|
+
{% if paginator.next_page %}
|
|
111
203
|
<p class="next">
|
|
112
|
-
<a href="
|
|
204
|
+
<a href="{{ paginator.next_page_path }}">Next</a>
|
|
113
205
|
</p>
|
|
114
|
-
{
|
|
206
|
+
{% else %}
|
|
115
207
|
<p class="next disabled">
|
|
116
208
|
<span>Next</span>
|
|
117
209
|
</p>
|
|
118
|
-
{
|
|
210
|
+
{% endif %}
|
|
119
211
|
|
|
120
212
|
</div>
|
|
213
|
+
{% endraw %}
|
|
121
214
|
{% endhighlight %}
|