1HOVERCRAFT(1) Hovercraft! HOVERCRAFT(1)
2
3
4
6 hovercraft - Hovercraft! Documentation
7
8 Contents:
9
11 GUI tools are limiting
12 I used to do presentations with typical slideshow software, such as
13 OpenOffice/LibreOffice Impress, but these tools felt restricted and
14 limiting. I need to do a lot of reorganizing and moving around, and
15 that might mean changing things from bullet lists to headings to text
16 to pictures and back to bullet lists over again. This happens through
17 the whole process. I might realize something that was just a bullet
18 point needs to be a slide, or that a set of slides for time reasons
19 need to be shortened down to bullet points. Much of the reorganization
20 comes from seeing what fits on one slide and what does not, and how I
21 need to pace the presentation, and to some extent even what kinda of
22 pictures I can find to illustrate what I try to say, and if the pic‐
23 tures are funny or not.
24
25 Presentation software should give you complete freedom to reorganize
26 your presentation on every level, not only by reorganizing slides.
27
28 The solution for me and many others, is to use a text-markup language,
29 like reStructuredText, Markdown or similar, and then use a tool that
30 generates an HTML slide show from that.
31
32 Text-markup gives you the convenience and freedom to quickly move parts
33 around as you like.
34
35 I chose reStructuredText, because I know it and because it has a mas‐
36 sive feature set. When I read the documentations of other text-markup
37 langages it was not obvious if they has the features I needed or not.
38
39 Pan, rotate and zoom
40 The tools that exist to make presentations from text-markup will make
41 slideshows that has a sequence of slides from left to right. But the
42 fashion now is to have presentations that rotate and zoom in and out.
43 One open source solution for that is impress.js.
44
45 With impress.js you can make modern cool presentations.
46
47 But impress.js requires you to write your presentation as HTML, which
48 is annoying, and the markup isn't flexible enough to let you quickly
49 reorganize things from bullet points to headings etc.
50
51 You also have to position each slide separately, and if you insert a
52 new slide in the middle, you have to reposition all the slides that
53 follow.
54
55 Hovercraft!
56 So what I want is a tool that takes the power, flexibility and conve‐
57 nience of reStructuredText and allows me to generate pan, rotate and
58 zoom presentations with impress.js, without having to manually reposi‐
59 tion each slide if I reorganize a little bit of the presentation. I
60 couldn't find one, so I made Hovercraft.
61
62 Hovercraft’s power comes from the combination of reStructuredText’s
63 convenience with the cool of impress.js, together with a flexible and
64 powerful solution to position the slides.
65
66 There are four ways to position slides:
67
68 1. Absolute positioning: You simply add X and Y coordinates to a
69 slide, in pixels. Doing only this will not be fun, but someone
70 might need it.
71
72 2. Relative positioning: By specifying x and/or y with with a start‐
73 ing r, you specify the distance from the previous slide. By using
74 this form of positioning you can insert a slide, and the other
75 slides will just move to make space for the new slide.
76
77 3. Automatically: If you don’t specify any position the slide will
78 have the same settings as the previous slide. With a relative
79 positioning, this means the slide will move as long as the previ‐
80 ous slide moved. This defaults to moving 1600px to the right,
81 which means that if you supply no positions at all anywhere in
82 the presentation, you get the standard slide-to-the-left presen‐
83 tation.
84
85 4. With an SVG path: In this last way of positioning, you can take
86 an SVG path from an SVG document and stick it into the presenta‐
87 tion, and that slide + all slides following that has no explicit
88 positioning will be positioned on that path. This can be a bit
89 fiddly to use, but can create awesome results, such as position‐
90 ing the slides as snaking Python or similar.
91
92 Hovercraft! also includes impress-console, a presenter console that
93 will show you your notes, slide previews and the time, essential tools
94 for any presentation.
95
97 You can either use Hovercraft! to generate the presentation as HTML in
98 a target directory, or you can let Hovercraft! serve the presentation
99 from its builtin webserver.
100
101 The latter have several benefits. One is that most webbrowsers will be
102 very reluctant to open popup-windows from pages served from the file
103 system. This is a security measure which can be changed, but it's eas‐
104 ier to just point the browser to http://localhost:8000 instead.
105
106 The second benefit is that Hovercraft! will monitor the source files
107 for the presentation, and if they are modified Hovercraft! will gener‐
108 ate the presentation again automatically. That way you don't have to
109 run Hovercraft! everytime you save a file, you only need to refresh
110 the browser.
111
112 Parameters
113 hovercraft [-h] [-t TEMPLATE] [-c CSS] [-a] [-s] [-n] [-p PORT] <pre‐
114 sentation> [<targetdir>]
115
116 Positional arguments:
117
118 <presentation>
119 The path to the reStructuredText presentation file.
120
121 <targetdir>
122 The directory where the presentation is saved. Will be cre‐
123 ated if it does not exist. If you do not specify a targetdir
124 Hovercraft! will instead start a webserver and serve the pre‐
125 sentation from that server.
126
127 Optional arguments:
128
129 -h, --help
130 Show this help.
131
132 -t TEMPLATE, --template TEMPLATE
133 Specify a template. Must be a .cfg file, or a directory with
134 a template.cfg file. If not given it will use a default tem‐
135 plate.
136
137 -c CSS, --css CSS
138 An additional CSS file for the presentation to use. See also
139 the :css: settings of the presentation.
140
141 -a, --auto-console
142 Open the presenter console automatically. This is useful when
143 you are rehearsing and making sure the presenter notes are
144 correct. You can also set this by having :auto-console: true
145 first in the presentation.
146
147 -s, --skip-help Do not show the initial help popup. You can also set
148 this by having :skip-help: true first in the presentation.
149
150 -n, --skip-notes
151 Do not include presenter notes in the output.
152
153 -p PORT, --port PORT
154 The address and port that the server uses. Ex 8080 or
155 127.0.0.1:9000. Defaults to 0.0.0.0:8000.
156
157 Built in templates
158 There are two templates that come with Hovercraft! One is called
159 default and will be used unless you specify a template. This is the
160 template you will use most of the time.
161
162 The second is called simple and it doesn't have a presenter console.
163 This template is especially useful if you combine it with the
164 --skip-notes parameter to prepare a version of your presentation to be
165 put online.
166
168 A note on terminology
169 Traditionally a presentation is made up of slides. Calling them
170 "slides" is not really relevant in an impress.js context, as they can
171 overlap and doesn't necessarily slide. The name "steps" is better, but
172 it's also more ambiguous. Hence impress.js uses the terms "slide" and
173 "step" as meaning the same thing, and so does Hovercraft!
174
175 Hovercraft! syntax
176 Presentations are reStructuredText files. If you are reading this docu‐
177 mentation from the source code, then you are looking at a reStructured‐
178 Text document already.
179
180 It's fairly simple, you underline headings to mark them as headings:
181
182 This becomes a h1
183 =================
184
185 And this a h2
186 -------------
187
188 The different ways of underlining them doesn't mean anything, instead
189 the order of them is relevant, so the first type of underline encoun‐
190 tered in the file will make a level 1 heading, the second type a level
191 2 heading and so on. In this file = is used for level 1, and - for
192 level 2.
193
194 You can also mark text as italic or bold, with *single asterixes* or
195 **double asterixes** respectively.
196
197 You can also have bullet lists:
198
199 * Bullet 1
200
201 * Bullet 1.1
202
203 * Bullet 2
204
205 * Bullet 3
206
207 And numbered lists:
208
209 1. Item 1
210
211 1.1. Item 1.1
212
213 2. Item 2
214
215 3. Item 3
216
217 You can include images:
218
219 .. image:: path/to/image.png
220 :height: 600px
221 :width: 800px
222
223 As you see you can also specify height and width and loads of other
224 parameters, but they are all optional.
225
226 And you can mark text as being preformatted. You do that by ending the
227 previous row with double colons, or have a row of double colons by
228 itself:
229
230 ::
231
232 This code here will be preformatted
233 and shown with a monospaced font
234 and all spaces preserved.
235
236 If you want to add source code, you can use the code directive, and get
237 syntax highlighting:
238
239 .. code:: python
240
241 def some_example_code(foo):
242 return foo * foo
243
244 The syntax highlighting is done by Pygments and supports lots and lots
245 of languages.
246
247 You are also likely to want to put a title on the presentation. You do
248 that by having a .. title:: statement before the first slide:
249
250 .. title:: This is the presentation title
251
252 That is the most important things you'll need to know about reStruc‐
253 turedText for making presentations. There is a lot more to know, and a
254 lot of advanced features like links, footnotes, and more. It is in fact
255 advanced enough so you can write a whole book in it, but for all that
256 you need to read the documentation.
257
258 External files
259 Any image file referenced in the presentation by a relative path will
260 be copied to the target directory, keeping it's relative path to the
261 presentation. The same goes for images or fonts referenced in any CSS
262 files used by the presentation or the template.
263
264 Images or fonts referenced by absolute paths or URI's will not be
265 copied.
266
267 Styling your Presentation
268 The css that is included by the default template are three files.
269
270 · impressConsole.css contains the CSS needed for the presenter console
271 to work,
272
273 · highlight.css contains a default style for code syntax highlighting,
274 as that otherwise would be a lot of work. If you don't like the
275 default colors or styles in the highlighting, this is the file you
276 should copy and modify.
277
278 · hovercraft.css, which only includes the bare minimum: It hides the
279 impress.js fallback message, the presenter notes, and sets up a use‐
280 ful default of having a step width be 1000 pixels wide.
281
282 For this reason you want to include your own CSS to style your slides.
283 To include a CSS file you add a :css:-field at the top of the presenta‐
284 tion:
285
286 :css: css/presentation.css
287
288 You can also optionally specify that the css should be only valid for
289 certain CSS media:
290
291 :css-screen,projection: css/presentation.css
292 :css-print: css/print.css
293
294 You can specify any number of css files in this way. You can also add
295 one extra CSS-file via a command-line parameter:
296 hovercraft --extra-css=my_extra.css presentationfile.rst outdir/
297
298 Styling a specific slide
299 If you want to have specific styling for a specific slide, it is a good
300 idea to give that slide a unique ID:
301
302 :id: the-slide-id
303
304 You can then style that slide specifically with:
305
306 div#the-slide-id {
307 /* Custom CSS here */
308 }
309
310 If you don't give it a specific ID, it will get an ID based on its
311 sequence number. And that means the slide's ID will change if you
312 insert or remove slides that came before it, and in that case your cus‐
313 tom stylings of that slide will stop working.
314
315 Portable presentations
316 Since Hovercraft! generates HTML5 presentations, you can use any com‐
317 puter that has a modern browser installed to view or show the presenta‐
318 tion. This allows you both to put up the presentation online and to use
319 a borrowed computer for your conference or customer presentation.
320
321 When you travel you don't know what equipment you have to use when you
322 show your presentaton, and it's surprisingly common to encounter a pro‐
323 jector that refuses to talk to your computer. It is also very easy to
324 forget your dongle if you have a MacBook, and there have even been
325 cases of computers going completely black and dead when you connect
326 them to a projector, even though all other computers seem to work fine.
327
328 The main way of making sure your presentation is portable is to try it
329 on different browsers and different computers. But the latter can be
330 unfeasible, not everyone has both Windows, Linux and OS X computers at
331 home. To help make your presentations portable it is a good idea to
332 define your own @font-face's and use them, so you are sure that the
333 target browser will use the same fonts as you do. Hovercraft! will
334 automatically find @font-face definitions and copy the font files to
335 the target directory.
336
337 impress.js fields
338 The documentation on impress.js is contained as comments in the demo
339 html file. It is not always very clear, so here comes a short summary
340 for convenience.
341
342 The different data fields that impress.js will use in 0.5.3, which is
343 the current version, are the following:
344
345 · data-transition-duration: The time it will take to move from one
346 slide to another. Defaults to 1000 (1 second). This is only valid on
347 the presentation as a whole.
348
349 · data-perspective: Controls the "perspective" in the 3d effects. It
350 defaults to 500. Setting it to 0 disables 3D effects.
351
352 · data-x: The horizontal position of a slide in pixels. Can be nega‐
353 tive.
354
355 · data-y: The vertical position of a slide in pixels. Can be negative.
356
357 · data-scale: Sets the scale of a slide, which is what creates the
358 zoom. Defaults to 1. A value of 4 means the slide is four times
359 larger. In short: Lower means zooming in, higher means zooming out.
360
361 · data-rotate-z: The rotation of a slide in the x-axis, in degrees.
362 This will cause the slide to be rotated clockwise or counter-clock‐
363 wise.
364
365 · data-rotate: The same as data-rotate-z.
366
367 · data-rotate-x: The rotation of a slide in the x-axis, in degrees.
368 This means you are moving the slide in a third dimension compared
369 with other slides. This is generally cool effect, if used right.
370
371 · data-rotate-y: The rotation of a slide in the x-axis, in degrees.
372
373 · data-z: This controls the position of the slide on the z-axis. Set‐
374 ting this value to -3000 means it's positioned -3000 pixels away.
375 This is only useful when you use data-rotate-x or data-rotate-y, oth‐
376 erwise it will only give the impression that the slide is made
377 smaller, which isn't really useful.
378
379 Hovercraft! specialities
380 Hovercraft! has some specific ways it uses reStructuredText. First of
381 all, the reStructuredText "transition" is used to mark the separation
382 between different slides or steps. A transition is simply a line with
383 four or more dashes:
384
385 ----
386
387 You don't have to use dashes, you can use any of the characters used to
388 underline headings, = - ` : . ' " ~ ^ _ * + #. And just as width head‐
389 ings, using different characters indicates different "levels". In this
390 way you can make a hierarchical presentation, with steps and substeps.
391 However, impress.js does not support that, so this is only useful if
392 you make your own templates that uses another Javascript library, for
393 example Reveal.js. If you have more than one transition level with the
394 templates included with Hovercraft, the resulting presentation may
395 behave strangely.
396
397 All reStructuredText fields are converted into attributes on the cur‐
398 rent tag. Most of these will typically be ignored by the rendering to
399 HTML, but there is two places where the tags will make a difference,
400 and that is by putting them first in the document, or first on a slide.
401
402 Any fields you put first in a document will be rendered into attributes
403 on the main impress.js <div>. The only ones that Hovercraft! will use
404 are data-transition-duration, skip-help and auto-console.
405
406 Any fields you put first in a slide will be rendered into attributes on
407 the slide <div>. This is used primarily to set the position/zoom/rota‐
408 tion of the slide, either with the data-x, data-y and other impress.js
409 settings, or the hovercraft-path setting, more on that later.
410
411 Hovercraft! will start making the first slide when it first encounters
412 either a transition or a header. Everything that comes before that will
413 belong to the presentation as a whole.
414
415 A presentation can therefore look something like this:
416
417 :data-transition-duration: 2000
418 :skip-help: true
419
420 .. title: Presentation Title
421
422 ----
423
424 This is the first slide
425 =======================
426
427 Here comes some text.
428
429 ----
430
431 :data-x: 300
432 :data-y: 2000
433
434 This is the second slide
435 ========================
436
437 #. Here we have
438
439 #. A numbered list
440
441 #. It will get correct
442
443 #. Numbers automatically
444
445 Relative positioning
446 Hovercraft! gives you the ability to position slides relative to each
447 other. You do this by starting the coordinates with "r". This will
448 position the slide 500 pixels to the right and a thousand pixels above
449 the previous slide:
450
451 :data-x: r500
452 :data-y: r-1000
453
454 Relative paths allow you to insert and remove slides and have other
455 slides adjust automatically. It's generally the most useful way of
456 positioning.
457
458 Automatic positioning
459 If you don't specify an attribute, the slide settings will be the same
460 as the previous slide. This means that if you used relative position‐
461 ing, the next slide will move the same distance.
462
463 This gives a linear movement, and your slides will end up in a straight
464 line.
465
466 By default the movement is 1600 pixels to the right, which means that
467 if you don't position any slides at all, you get a standard presenta‐
468 tion where the slides will simply slide from right to left.
469
470 SVG Paths
471 Hovercraft! supports positioning slides along an SVG path. This is
472 handy, as you can create a drawing in a software that supports SVG, and
473 then copy-paste that drawings path into your presentation.
474
475 You specify the SVG path with the :hovercraft-path: field. For example:
476
477 :hovercraft-path: m275,175 v-150 a150,150 0 0,0 -150,150 z
478
479 Every following slide that does not have any explicit positioning will
480 be placed on this path.
481
482 There are some things you need to be careful about when using SVG
483 paths.
484
485 Relative and absolute coordinates
486 SVG coordinates can either be absolute, with a reference to the page
487 origin; or relative, which is in reference to the last point. Hover‐
488 craft! can handle both, but what it can not handle very well is a mix‐
489 ture of them.
490
491 Specifically, if you take an SVG path that starts with a relative move‐
492 ment and extract that from the SVG document, you will lose the context.
493 All coordinates later must then also be relative. If you have an abso‐
494 lute coordinate you then suddenly regain the context, and everything
495 after the first absolute coordinate will be misplaced compared to the
496 points that come before.
497
498 Most notable, the open source software "Inkscape" will mix absolute and
499 relative coordinates, if you allow it to use relative coordinates. You
500 therefore need to go into it's settings and uncheck the checkbox that
501 allows you to use relative coordinates. This forces Inkscape to save
502 all coordinates as absolute, which will work fine.
503
504 Start position
505 By default the start position of the path, and hence the start position
506 of the first slide, will be whatever the start position would have been
507 if the slide had no positioning at all. If you want to change this
508 position then just include :data-x: or :data-y: fields. Both relative
509 and absolute positioning will work here.
510
511 In all cases, the first m or M command of the SVG path is effectively
512 ignored, but you have to include it anyway.
513
514 SVG transforms
515 SVG allows you to draw up path and then transform it. Hovercraft! has
516 no support for these transforms, so before you extract the path you
517 should make sure the SVG software doesn't use transforms. In Inkscape
518 you can do this by the "Simplify" command.
519
520 Other SVG shapes
521 Hovercraft! doesn't support other SVG shapes, just the path. This is
522 because organising slides in squares, etc, is quite simple anyway, and
523 the shapes can be made into paths. Usually in the software you will
524 have to select the shape and tell your software to make it into a path.
525 In Inkscape, transforming an object into a path will generally mean
526 that the whole path is made of CubicBezier curves, which are unneces‐
527 sarily complex. Using the "Simplify" command in Inkscape is usually
528 enough to make the shapes into paths.
529
530 Shape-scaling
531 Hovercraft! will scale the path so that all the slides that need to fit
532 into the path will fit into the path. If you therefore have several
533 paths in your presentation, they will not keep their relative sizes,
534 but will be resized so the slides fit. If you need to have the shapes
535 keep their relative sizes, you need to combine them into one path.
536
537 Examples
538 To see how to use Hovercraft! in practice, there are three example pre‐
539 sentations included with Hovercraft!
540
541 hovercraft.rst
542 The demo presentation you can see at
543 http://regebro.github.com/hovercraft
544
545 tutorial.rst
546 A step by step guide to the features of Hovercraft!
547
548 positions.rst
549 An explanation of how to use the positioning features.
550
552 There are several tricks to making presentations. I certainly do not
553 claim to be an expert, but here are some beginners hints.
554
555 Take it easy
556 Don't go too heavy on the zoom. Having a difference between two slides
557 in scale of more than 5 is rarely going to look good. It would make for
558 a nice cool zooming effect if it did, but this is not what browsers are
559 designed for, so it won't.
560
561 And the 3D effects can be really cool if used well. But not all the
562 time, it gets tiring for the audience.
563
564 Try, if you can, to use the zoom and 3D effects when they make sense in
565 the presentation. You can for example mention the main topics on one
566 slide, and then zoom in on each topic when you discuss it in more
567 detail. That way the effects help clarify the presentation, rather than
568 distract from it.
569
570 Custom fonts
571 Browsers tend to render things subtly differently.
572
573 They also have different default fonts, and different operating systems
574 have different implementations of the same fonts. So to make sure you
575 have as much control over the design as possible, you should always
576 include fonts with the presentation. A good source for free fonts are
577 Google Webfonts. Those fonts are free and open source, so you can use
578 them with no cost and no risk of being sued. They can also be down‐
579 loaded or included online.
580
581 Online vs Downloaded
582 If you are making a presentation that is going to run on your computer
583 at a conference or customer meeting, always download the fonts and have
584 them as a part of the presentation. Put them in a folder called fonts
585 under the folder where your presentation is.
586
587 You also need to define the font-family in your CSS. Font Squirrel's
588 webfont generator will provide you with a platform-independent toolkit
589 for generating both the varius font formats and the CSS.
590
591 If the presentation is online only, you can put an @include-statement
592 in your CSS to include Googles webfonts directly:
593
594 @import url(http://fonts.googleapis.com/css?family=Libre+Baskerville|Racing+Sans+One|Satisfy);
595
596 But don't use this for things you need to show on your computer, as it
597 requires you to have internet access.
598
599 Test with different browsers
600 If you are putting the presentation online, test it with a couple of
601 major browsers, to make sure nothing breaks and that everything still
602 looks good. Not only are there subtle differences in how things may
603 get positioned, different browsers are also good at different things.
604
605 I've tested some browsers, all on Ubuntu, and it is likely that they
606 behave differently on other operating systems, so you have to try for
607 yourself.
608
609 Firefox
610 Firefox 18 is quite slow to use with impress.js, especially for 3D
611 stuff, so it can have very jerky movements from slide to slide. It does
612 keep text looking good no matter how much you zoom. On the other hand,
613 it refuses to scale text infinitely, so if you scale too much charac‐
614 ters will not grow larger, they will instead start moving around.
615
616 Firefox 19 is better, but for 3D stuff it's still a bit slow.
617
618 Chrome
619 Chrome 24 is fast, but will not redraw text in different sizes, but
620 will instead create an image of them and rescale them, resulting in the
621 previous slide having a fuzzy pixelated effect.
622
623 Epiphany
624 Epiphany 3.4.1 is comparable to Firefox 19, possibly a bit smoother,
625 and the text looks good. But it has bugs in how it handles 3D data, and
626 the location bar is visible in fullscreen mode, making it less suitable
627 for any sort of presentation.
628
630 Luckily, for most cases you don't need to create your own template, as
631 the default template is very simple and most things you need to do is
632 doable with css. However, I don't want Hovercraft! to set up a wall
633 where it isn't flexible enough for your needs, so I added support to
634 make your own templates.
635
636 You need to create your own template if you are unsatisfied with the
637 HTML that Hovercraft! generates, for example if you need to use another
638 version of HTML or if the reStructuredText you are using isn't being
639 rendered in a way that is useful for you. Although if you aren't happy
640 with the HTML generated from the reStructuredText that could very well
641 be a bug, so open an issue on Github for discussion.
642
643 Hovercraft! generates presentations by converting the reStructuredText
644 into XML and then using XSLT to translate the XML into HTML.
645
646 Templates are directories with a configuration file, a template XSL
647 file, and any number of CSS, JS and other resource files.
648
649 The template configuration file
650 The configuration file is normally called template.cfg, but if you have
651 several configuration files in one template directory, you can specify
652 which one to use by specifying the full path to the configuration file.
653 However, if you just specify the template directory, template.cfg will
654 be used.
655
656 Template files are in configparser format, which is an extended
657 ini-style format. They are very simple, and have only one section,
658 [hovercraft]. Any other sections will be ignored. Many of the parame‐
659 ters are lists that often do not fit on one line. In that case you can
660 split the line up over several lines, but indenting the lines. The
661 amount of indentation doesn't make any difference, except aestheti‐
662 cally.
663
664 The parameters in the [hovercraft] section are:
665
666 · template The name of the xsl template.
667
668 · css A list of CSS filenames separated by whitespace. These files
669 will get included in the final file with "all" as the media speci‐
670 fication.
671
672 · css-<media> A list of CSS filenames separated by whitespace. These
673 files will get included in the final file with the media given in
674 the parameter. So the files listed for the parameter "css-print"
675 will get "print" as their media specification and a key like
676 "css-screen,print" will return media "screen,print".
677
678 · js-header A list of filenames separated by whitespace. These files
679 will get included in the target file as header script links.
680
681 · js-body A list of filenames separated by whitespace. These files
682 will get included in the target file as script links at the end of
683 the file. The files impress.js, impressConsole.js and hover‐
684 craft.js typically need to be included here.
685
686 · resource A list of filenames separated by whitespace that will be
687 copied to the target directory, but nothing else is done with
688 them. Images and fonts used by CSS will be copied anyway, but
689 other resources may be added here.
690
691 An example:
692
693 [hovercraft]
694 template = template.xsl
695
696 css = css/screen.css
697 css/impressConsole.css
698
699 css-print = css/print.css
700
701 js-header = js/dateinput.js
702
703 js-body = js/impress.js
704 js/impressConsole.js
705 js/hovercraft.js
706
707 resource = images/back.png
708 images/forward.png
709 images/up.png
710 images/down.png
711
712 The template file
713 The file specified with the template parameters is the actual XSLT tem‐
714 plate that will perform the translation from XML to HTML.
715
716 Most of the time you can just copy the default template file in hover‐
717 craft/templates/default/template.xsl and modify it. XSLT is very com‐
718 plex, but modifying the templates HTML is quite straightforward as long
719 as you don't have to touch any of the <xsl:...> tags.
720
721 Also, the HTML that is generated is XHTML compatible and quite
722 straightforward, so for the most case all you would need to generate
723 another version of HTML, for example strict XHTML, would be to change
724 the doctype.
725
726 But if you need to add or change the main generated HTML you can add
727 and change HTML statements in this main file as you like. See for exam‐
728 ple how the little help-popup is added to the bottom of the HTML.
729
730 If you want to change the way the reStructuredText is rendered things
731 get slightly more complex. The XSLT rules that convert the reStruc‐
732 turedText XML into HTML are contained in a separate file, reST.xsl. For
733 the most part you can just include it in the template file with the
734 following code:
735
736 <xsl:import href="resource:templates/reST.xsl" />
737
738 The resource: part here is not a part of XSLT, but a part of Hover‐
739 craft! It tells the XSLT translation that the file specified should
740 not be looked up on the file system, but as a Python package resource.
741 Currently the templates/reST.xsl file is the only XSLT resource import
742 available.
743
744 If you need to change the way reStructuredText is rendered you need to
745 make a copy of that file and modify it. You then need to make a copy of
746 the main template and change the reference in it to your modified XSLT
747 file.
748
749 None of the XSLT files need to be copied to the target, and should not
750 be listed as a resource in the template configuration file.
751
753 Lennart Regebro
754
756 2013, Lennart Regebro
757
758
759
760
7611.0 Feb 01, 2019 HOVERCRAFT(1)