Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

reveal.js print to pdf only prints the first slide?

I am trying to use the pdf export option of reveal.js as documented in the repo readme.

I have the following problems:

  • I don't see an option for layout (landscape vs portrait) in my chrome print window
  • Printing only ever prints the first slide

No idea what I've done wrong or how to troubleshoot it. I'm using the latest version of reveal.js css etc from Github (sha: 131c00689a4c7a18e5c991fc8102347e4594b5d4) on this example file.

I'm using Google-chrome Version 34.0.1847.132 on Ubuntu 14.04

like image 329
cboettig Avatar asked May 09 '14 18:05

cboettig


2 Answers

  1. Remove

    <link rel="stylesheet" media="print" href="reveal.js/css/print/pdf.css" />
    
  2. Add

    <!-- If the query includes 'print-pdf', include the PDF print sheet -->
    <script>
      if( window.location.search.match( /print-pdf/gi ) ) {
        var link = document.createElement( 'link' );
        link.rel = 'stylesheet';
        link.type = 'text/css';
        link.href = 'reveal.js/css/print/pdf.css';
        document.getElementsByTagName( 'head' )[0].appendChild( link );
      }
    </script>
    
  3. Add ?print-pdf to the end of URL, e.g. change .../index.html# to .../index.html?print-pdf#

like image 101
William Zhang Avatar answered Sep 21 '22 20:09

William Zhang


I made a presentation using Slides and exported it in HTML, but for me the William Zhanf solution doesn't work at all. I had all the slides overlayed. This is how I solved:

  1. Download the pdf.css from here and place it in the same folder with the html file.
  2. Paste before the </body> tag the William Zhanf snippet (with changed path to the css file):
<script>
  if( window.location.search.match( /print-pdf/gi ) ) {
    var link = document.createElement( 'link' );
    link.rel = 'stylesheet';
    link.type = 'text/css';
    link.href = 'pdf.css'; // Notice: I changed the path
    document.getElementsByTagName( 'head' )[0].appendChild( link );
  }
</script>
  1. Then follow the same instruction: add ?print-pdf to the end of URL and print as PDF from Chrome.
like image 8
Fred K Avatar answered Sep 20 '22 20:09

Fred K