Skip to content

Commit 31aaf11

Browse files
mattmakaimattmakai
committed
working on pelican post
1 parent c8ba2da commit 31aaf11

File tree

3 files changed

+86
-18
lines changed

3 files changed

+86
-18
lines changed

‎content/posts/170605-static-sites-pelican.markdown‎

Lines changed: 86 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
title: Generating Static Websites with Pelican, Jinja2 and Markdown
1+
title: How to Create Your First Static Website with Pelican and Jinja2
22
slug: generating-static-websites-pelican-jinja2-markdown
33
meta: Learn how to generate static websites with Python, the Pelican static site generator, Jinja2 and Markdown.
44
category: post
@@ -24,20 +24,20 @@ can further customize and expand with your own design and content.
2424

2525

2626
## Our Tools
27-
This tutorial will with with either [Python 2 or 3](/python-2-or-3.html),
28-
but Python 3 is strongly recommended for new applications. I used
27+
This tutorial should work with either [Python 2 or 3](/python-2-or-3.html),
28+
but Python 3 is strongly recommended for all new applications. I used
2929
[Python 3.6.1](https://www.python.org/downloads/release/python-361/) to
3030
write this post. In addition to Python, throughout this tutorial we
3131
will also use the following
3232
[application dependencies](/application-dependencies.html):
3333

34-
* [pelican](/pelican.html)
34+
* [Pelican](/pelican.html)
3535
[static site generator](/static-site-generator.html),
3636
[version 3.7.1](https://github.com/getpelican/pelican/releases/tag/3.7.1)
37-
* [markdown](/markdown.html) parsing library to handle Markdown as a content
37+
* [Markdown](/markdown.html) parsing library to handle Markdown as a content
3838
input format, version
3939
[2.6.8](https://github.com/waylan/Python-Markdown/releases/tag/2.6.8-final)
40-
* [jinja2](/jinja2.html), a Python [template engine](/template-engines.html),
40+
* [Jinja2](/jinja2.html), a Python [template engine](/template-engines.html),
4141
version [2.9.6](https://github.com/pallets/jinja/releases/tag/2.9.6)
4242
* [pip](https://pip.pypa.io/en/stable/) and
4343
[virtualenv](https://virtualenv.pypa.io/en/latest/), which come
@@ -56,25 +56,36 @@ Use and abuse the source code as you like for your own applications.
5656

5757

5858
## Install the Pelican and Markdown libraries
59-
Start by creating a new virtual environment for your project.
59+
Start by creating a new virtual environment for your project. My virtualenv
60+
is named `staticsite` with the following command but you can name yours
61+
whatever matches the project you are creating.
6062

6163
```bash
62-
python3 -m venv
64+
python3 -m venv staticsite
6365
```
64-
66+
67+
Activate the virtualenv.
68+
69+
```
70+
source staticsite/bin/activate
71+
```
72+
73+
When activated the virtualenv should prepend its name to your command prompt,
74+
as shown in the following screenshot of my terminal.
75+
6576
<img src="/img/170605-static-sites-pelican/activate-virtualenv.png" width="100%" class="technical-diagram img-rounded" style="border:1px solid #ccc" alt="Create and activate the Python virtual environment.">
6677

6778
Install the appropriate dependencies after your virtualenv is activated.
68-
The text `(staticsite)` should be prepended to your command prompt. Install
69-
the Pelican and Markdown Python libraries. Jinja2 will also be installed
70-
because Pelican specifies it as a dependency.
79+
Use the `pip` command to install Pelican and Markdown, which will also
80+
install Jinja2 because Pelican specifies it as a dependency.
81+
7182

7283
```bash
7384
pip install pelican==3.7.1 markdown==2.6.8
7485
```
7586

76-
Run the command and after everything is installed you should see output
77-
similar to the following "Sucessfully installed" message.
87+
Run the `pip` command and after everything is installed you should see output
88+
similar to the following "Successfully installed" message.
7889

7990
```bash
8091
Installing collected packages: pygments, pytz, six, feedgenerator, blinker, unidecode, MarkupSafe, jinja2, python-dateutil, docutils, pelican, markdown
@@ -85,8 +96,8 @@ Installing collected packages: pygments, pytz, six, feedgenerator, blinker, unid
8596
Successfully installed MarkupSafe-1.0 blinker-1.4 docutils-0.13.1 feedgenerator-1.9 jinja2-2.9.6 markdown-2.6.8 pelican-3.7.1 pygments-2.2.0 python-dateutil-2.6.0 pytz-2017.2 six-1.10.0 unidecode-0.4.20
8697
```
8798

88-
Now that our dependencies are installed we can start building our
89-
static site.
99+
Now that our dependencies are installed into the virtualenv we can start
100+
building our static site.
90101

91102

92103
## Generate a Basic Site
@@ -95,12 +106,25 @@ favorite [retro synthwave](https://www.youtube.com/watch?v=uYRZV8dV10w)
95106
artists as examples, but of course your site can contain whatever subjects
96107
that you want.
97108

109+
Create a new directory for our static site project and change into the
110+
directory.
111+
112+
```
113+
mkdir retrosynth
114+
cd retrosynth
115+
```
116+
117+
Run the `pelican-quickstart` command within the new project directory.
118+
98119
```bash
99120
(staticsite) $ pelican-quickstart
100121
```
101122

123+
The quickstart script will rattle off a bunch of questions. Follow
124+
along with the answers below or modify them for your own site name and
125+
desired configuration.
126+
102127
```bash
103-
(staticsite) $ pelican-quickstart
104128
Welcome to pelican-quickstart v3.7.1.
105129

106130
This script will help you create a new Pelican-based website.
@@ -129,10 +153,54 @@ Done. Your new project is available at /Users/matt/devel/py/retrosynth
129153
(staticsite) $
130154
```
131155

132-
What did we just create using the Pelican quickstart script?
156+
What did we just create using the Pelican quickstart script? Check out
157+
the new files in the directory.
158+
159+
```bash
160+
(staticsite) $ ls
161+
Makefile develop_server.sh pelicanconf.py
162+
content fabfile.py publishconf.py
163+
```
164+
165+
The quickstart created five files and one new directory:
166+
167+
* `Makefile`: Make convenience tasks for common operations such as running a
168+
development server, building a site and cleaning extraneous build files
169+
* `develop_server.sh`
170+
* `pelicanconf.py`
171+
* `fabfile.py`
172+
* `publishconf.py`
173+
* `content`: location for your markup files, which should be stored under
174+
`pages` and `posts` directories
175+
176+
We can use these files as the base for our new static site. Let's see what
177+
it looks like by default by running it via the `devserver` task in the
178+
Makefile.
179+
180+
```bash
181+
make devserver
182+
```
183+
184+
The Pelican development server will start serving up your site with a
185+
daeman process. Go to [localhost:8000](http://localhost:8000) in your web
186+
browser and you will see the first version of your static site.
187+
188+
<img src="/img/170605-static-sites-pelican/default-style.png" width="100%" class="technical-diagram img-rounded" style="border:1px solid #ccc" alt="Default styling on the Pelican static site.">
189+
190+
It is up to you whether you want to use the development server or not
191+
while creating your site. Every time I want to view my changes for
192+
Full Stack Python I actually regenerate the site using my own Makefile that
193+
wraps the `pelican` command. The `python -m http.server` command constantly
194+
serves up each build's changes.
195+
196+
Alright, now that we have our starter files we can get to work creating
197+
some initial content.
133198

134199

135200
## Building the site
201+
Pelican can accept both [Markdown](/markdown.html) and reStructureText
202+
markup files as input.
203+
136204

137205

138206
```bash

‎static/img/170605-static-sites-pelican/default-style.png‎

153 KB
Loading

‎static/img/logos/pony.png‎

11.2 KB
Loading

0 commit comments

Comments
 (0)