Skip to content

Commit 8973385

Browse files
committedMay 29, 2015
more fixes to theming tutorial
Signed-off-by: Chris Warrick <kwpolska@gmail.com>
1 parent 86aee59 commit 8973385

File tree

1 file changed

+11
-12
lines changed

1 file changed

+11
-12
lines changed
 

Diff for: ‎docs/creating-a-theme.txt

+11-12
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ So::
4040
# Look at it
4141
jekyll serve & google-chrome http://localhost:4000
4242

43-
If you do not want to install Jekyll, you can also see it in action at http://lanyon.getpoole.com/
43+
If you **do not want to install Jekyll**, you can also see it in action at http://lanyon.getpoole.com/
4444

4545
Some things jump to my mind:
4646

@@ -51,10 +51,10 @@ Some things jump to my mind:
5151
Also, from looking at `the project’s README <https://github.com/poole/lanyon/blob/master/README.md>`__
5252
it supports some nice configuration options:
5353

54-
1. color schemes
55-
2. reverse layout
56-
3. sidebar overlay instead of push
57-
4. show the sidebar open by default, or based on a page’s metadata
54+
1. Color schemes
55+
2. Reverse layout
56+
3. Sidebar overlay instead of push
57+
4. Open the sidebar by default, or on a per-page basis by using its metadata
5858

5959
Let’s try to make all those nice things survive the porting.
6060

@@ -103,6 +103,7 @@ First, we create a site with some content in it. We’ll use the ``nikola init``
103103
[2015-05-28T16:02:08Z] INFO: init: A new site with example data has been created at lanyon-port.
104104
[2015-05-28T16:02:08Z] INFO: init: See README.txt in that folder for more information.
105105

106+
106107
Then, we create an empty theme inheriting from base. This theme will use Mako templates. If you prefer Jinja2,
107108
then you should use ``base-jinja`` instead::
108109

@@ -111,7 +112,7 @@ then you should use ``base-jinja`` instead::
111112
$ mkdir themes/lanyon
112113
$ echo base > themes/lanyon/parent
113114

114-
Edit conf.py and set ``THEME = 'lanyon'``. Also set ``USE_BUNDLES = False`` (just do it for now, we’ll get to bundles later).
115+
Edit ``conf.py`` and set ``THEME = 'lanyon'``. Also set ``USE_BUNDLES = False`` (just do it for now, we’ll get to bundles later).
115116

116117
You can now build that site using ``nikola build`` and it will look like this:
117118

@@ -187,8 +188,8 @@ Luckily, since this is all under a very liberal license, we can just copy these
187188
Nikola, adapting the paths a little so that they follow our conventions::
188189

189190
$ mkdir -p themes/lanyon/assets/css
190-
$ cp ../lanyon/public/css/lanyon.css themes/lanyon/assets/css/
191191
$ cp ../lanyon/public/css/poole.css themes/lanyon/assets/css/
192+
$ cp ../lanyon/public/css/lanyon.css themes/lanyon/assets/css/
192193

193194
Notice I am *not* copying ``syntax.css``? That’s because Nikola handles that styles for syntax highlighting
194195
in a particular way, using a setting called ``CODE_COLOR_SCHEME`` where you can configure
@@ -235,8 +236,8 @@ And we will change it so it uses the lanyon styles instead of theme.css (again,
235236
<link href="/assets/css/all.css" rel="stylesheet" type="text/css">
236237
%else:
237238
<link href="/assets/css/rst.css" rel="stylesheet" type="text/css">
238-
<link href="/assets/css/lanyon.css" rel="stylesheet" type="text/css">
239239
<link href="/assets/css/poole.css" rel="stylesheet" type="text/css">
240+
<link href="/assets/css/lanyon.css" rel="stylesheet" type="text/css">
240241
<link href="/assets/css/code.css" rel="stylesheet" type="text/css">
241242
%if has_custom_css:
242243
<link href="/assets/css/custom.css" rel="stylesheet" type="text/css">
@@ -593,7 +594,7 @@ that. So, let’s use them. There is a ``html_site_title`` function in
593594
</div>
594595

595596
That’s a ``<h1>`` instead of a ``<h3>`` like Lanyon does, but hey, it’s the
596-
right thing to do. If you want to go with an ``<h3>>`, just
597+
right thing to do. If you want to go with an ``<h3>``, just
597598
change ``html_site_title`` itself.
598599

599600
And now we more or less have the correct page layout and styles. Except for a
@@ -719,8 +720,6 @@ the Lanyon original:
719720
${helper.mathjax_script(posts)}
720721
</%block>
721722

722-
Some of the typography problems were caused by loading ``lanyon.css`` and ``poole.css`` in the wrong order all the way back at the beginning of this tutorial.
723-
724723
With these changes, it looks… similar?
725724

726725
.. figure:: https://getnikola.com/images/lanyon-6.thumbnail.png
@@ -800,7 +799,7 @@ which makes sites load faster. To do that, your theme needs a ``bundles`` file w
800799

801800
For the Lanyon theme, it should be like this::
802801

803-
assets/css/all.css=rst.css,code.css,lanyon.css,poole.css,custom.css
802+
assets/css/all.css=rst.css,code.css,poole.css,lanyon.css,custom.css
804803

805804
**Note:** Some themes also support the ``USE_CDN`` option meaning that in some cases it will load one bundle with all CSS and in other will load some CSS files
806805
from a CDN and others from a bundle. This is complicated and probably not worth the effort.

0 commit comments

Comments
 (0)