Paged.js

Paged.js workshop @ XPUB

(13 October 2022)

Paged.js example

paged.js-polyfill.js you can download here: https://unpkg.com/browse/pagedjs@0.4.1/dist/
paged.js-interface.css you can download here: https://gitlab.coko.foundation/pagedjs/interface-polyfill

Remember: you need to open a Paged.js document through a web server. You can use a local server, either through your code editor or by running a local server in Python: $ python3 -m http.server.

<!DOCTYPE html>
<html>
<head>
	<title>Paged.js template example</title>
	<meta charset="utf-8">
	<!-- load paged.js 
		(the polyfill is used to turn your whole page into pages) 
	-->
    <script src="paged.js-polyfill.js"></script>
    <!-- load the paged.js interface stylesheet -->
    <link href="paged.js-interface.css" rel="stylesheet" type="text/css">
    <!-- load your own stylesheet -->
    <link rel="stylesheet" type="text/css" href="stylesheet.css">
</head>
<body>
	<section id="cover"></section>
	<section id="introduction"></section>
	<section class="article"></section>
	<section id="backcover"></section>
</body>
</html>

You can also use one of the Paged.js starterkits: https://gitlab.coko.foundation/pagedjs/starter-kits

And this cheatsheet is helpful too: https://pagedjs.org/documentation/cheatsheet/

In general Paged.js has a lot of documentation on their website with lots of examples!