Merge pull request #168 from Idadelveloper/add/pdf-export

Export an article to pdf

assets/js/script.js

@@ -127,4 +127,23 @@
     $(this).removeClass('active')
   })
 
+
+  // Download page to pdf format
+  window.onload = function() {
+      document.getElementById("generatePDF")
+          .addEventListener("click", () => {
+              const content = this.document.getElementById("content");
+              console.log(content);
+              console.log(window);
+              var opt = {
+                  margin: 1,
+                  filename: document.querySelector('#title').innerHTML,
+                  image: { type: 'jpeg', quality: 0.98 },
+                  html2canvas: { scale: 2 },
+                  jsPDF: { unit: 'in', format: 'letter', orientation: 'portrait' }
+              };
+              html2pdf().from(content).set(opt).save();
+          })
+    }
+
 })(jQuery);

layouts/partials/default.html

@@ -12,12 +12,19 @@
               {{ template "section-tree-nav" dict "sect" . "currentnode" $currentNode}}
               {{ end }}
             {{ end }}
+            {{ if .Content }}
+              {{ if eq .Params.downloadBtn "true" }}
+                <div>
+                    <button class="btn btn-primary btn-block" id="generatePDF" > Get Pdf  </button>
+                </div>
+              {{ end }}
+            {{ end }}
           </ul>
         </div>
       </div>
       <div class="col-lg-9">
-        <div class="p-lg-5 p-4 bg-white">
+        <div class="p-lg-5 p-4 bg-white" id="content">
-          <h2 class="mb-5">{{ .Title }}</h2>
+          <h2 class="mb-5" id="title">{{ .Title }}</h2>
           {{ if .Content }}
           <div class="content">{{.Content}}</div>
           {{ else }}

layouts/partials/head.html

@@ -19,6 +19,10 @@
   {{ "<!-- fonts -->" | safeHTML }}
   <link href="https://fonts.googleapis.com/css?family={{replace .Site.Params.font_family ' ' '+' | title}}:300,400,700&display=swap" rel="stylesheet">
 
+  {{ "<!-- PDF.js -->" | safeHTML }}
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.9.359/pdf.min.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.9.3/html2pdf.bundle.js"></script>
+  
   <style>
   :root{
     --primary-color:{{ .Site.Params.primary_color }};