Export Html Content To Word Document(.doc) using jQuery Plugin – jQuery-Word-Export

If you want add export html content to word document button on website so that your website user can easily able to save your web based content as .doc file. Then in post I am going to share simple jQuery plugin called jQuery-Word-Export which help you to enable for exporting HTML and images to a Microsoft Word document.



This plugin takes advantage of the fact that MS Word can interpret HTML as a document. Specifically, this plugin leverages the MHTML archive format in order to embed images directly into the file, so they can be viewed offline.Unfortunately, LibreOffice and, probably, other similar word processors read the output file as plain text rather than interpreting it is a document, so the output of this plugin will only work with MS Word proper.

Libraries

The plugin dependent on jQuery core library and FileSaver.js so include these library first after that add FileSaver.js

<script src="//code.jquery.com/jquery-latest.min.js"></script> 
<script src="FileSaver.js"></script> 
<script src="jquery.wordexport.js"></script>

HTML

Here is the sample HTML content which need to to export as .doc file. and also Create a button to save and export the content as .doc.

<div id="content" style="width:70%">
<h1>Heading...</h1>
<h3>Hello, I hope you are doing well, My name is Rohit Kumar and I am Programmer, Analyst, Blogger and Technology freak based in New Delhi, India.</h3>
<p>I like to Help companies to get important things done and develop business applications for them, Apart from that In my free time I also love to contribute my tech knowledge to the world, So I have created this blog and sharing my knowledge with others.</p>
</div>
 
<!-- Export to DOC button -->
<button class="ExportToWord"> Export To Word(.doc) </button>



JS

Finally initialize the plugin.and pass the div id which inner content need to export as word document file.

    $(function() {   
        $(".ExportToWord").click(function(event) {
            $("#content").wordExport();
        });
    });

See live demo and download source code.

DEMO | DOWNLOAD

Visit official github repository for more information and follow for future updates. Don’t forget to read license for using this plugin in your projects.