jQuery Plugin To Save Webpage As MS Word Document - Googoose

Googoose is a jQuery plugin which uses HTML5 saveAs() to convert complete or selected content of your web page into a Microsoft Word Document and save generated doc file on the client-side.

How to use it:

1. Load the necessary JavaScript libraries in the webpage.

<script src="/path/to/jquery.min.js"></script>
<script src="/path/to/FileSaver.js"></script>

2. Make sure the jQuery Googoose plugin is loaded after jQuery:

<script src="jquery.googoose.js"></script>

3. Add the CSS class 'googoose' to html content.

<div class="googoose">
  ..
</div>

4. Call the googoose function to save your page as a MS word on page load.

$(document).googoose();

5. Full customization options.

$(document).googoose({

  // default selector of html to wrap the Word doc in
  area: 'div.googoose',

  // used to manufacture headers and footers
  headerfooterid: 'googoose-hdrftrtbl',

  // CSS origins of the Word document
  margins: '1.0in',

  // zoom percentage when the Word document opens
  zoom: '75',

  // the file name to save as
  filename: 'Doc1_' + now + '.doc',

  // size of the Word document
  size: '8.5in 11.0in',

  // display mode to open the Word document in
  display: 'Print',

  //  the language on the page
  lang: 'en-US',

  // determines whether the page should be downloaded as a Word document or displayed as HTML
  download: true,

  // if used by the developer this jQuery selector will translate into a Word table of contents
  toc: 'div.googoose.toc',

  // f used by the developer at this jQuery selector will translate into a Microsoft Word page break
  pagebreak: 'div.googoose.break',

  // the content in this jQuery selector will be put in the Microsoft Word document header
  headerarea: 'div.googoose.header',

  // the content in this jQuery selector will be put in the document footer
  footerarea: 'div.googoose.footer',

  // used solely by the googoose internals
  headerid: 'googoose-header',

  // used solely by the googoose internals
  footerid: 'googoose-footer',

  // CSS margin for the header
  headermargin: '.5in',

  // CSS margin for the footer
  footermargin: '.5in',

  //  generally used in headers and Footers this whole display the current page number
  currentpage: 'span.googoose.currentpage',

  // generally displayed in headers and Footers this jQuery selector when put into the HTML content will display the number of total pages.
  totalpage: 'span.googoose.totalpage',

  // html boundary
  htmlboundary: '--',

  // called after the HTML has been rendered
  finishaction: GG.finish,

  // the root node
  initobj: document
});

Changelog:

2021-03-26

• Bugfix

2021-03-01

• update

2016-07-07

• modifying the base script to chain and work

2016-07-05

• restructured directories and added start of a test

2016-06-30

• made change to decode HTML entities before rendering the word document

2016-06-29

• fixed text rendering of pre elements preserving white spaces, fixed other miscellaneous bugs, did Advanced testing

---

This awesome jQuery plugin is developed by aadel112. For more Advanced Usages, please check the demo page or visit the official website.