CODEWITHSUNDEEP
phphtmlms-word
Nikko
Nikko

Reputation: 385

HTML to Word With Images

I have an HTML document with image. How can I convert those HTML to word document (no matter doc or docx) but image is able to running offline?

I've been trying HTML to DOCX from codeplex, my CSS messed up (couldn't align center). And I have no idea how to change image with OpenTBS.

Any other recommended freeware PHP or JS classes to convert them?

Upvotes: 0

Views: 3321

Answers (3)

Gustavo Mauricio De Barros
Gustavo Mauricio De Barros

Reputation: 359

Here is a JS function to convert HTML to Word:

function Export2Doc(element, filename = '', landscape= false, margem="0.5in") {
    var preHtml
    if (landscape) {
        preHtml = `<html lang=\"pt-br\" accept-charset="UTF-8" xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'> <head><meta charset="UTF-8"><meta http-equiv="Content-type" content="text/html; charset=UTF-8"><title></title> <!--[if gte mso 9]><xml> <w:WordDocument> <w:View>Print</w:View> <w:Zoom>90</w:Zoom> </w:WordDocument> </xml><![endif]--> <style> p.MsoFooter, li.MsoFooter, div.MsoFooter { margin:0in; margin-bottom:.0001pt; mso-pagination:widow-orphan; tab-stops:center 3.0in right 6.0in; font-size:12.0pt; }</style> <style> <!-- /* Style Definitions */ @page Section1 { size:landscape; margin:${margem} ${margem} ${margem} ${margem}; mso-page-orientation:landscape; mso-header-margin:.5in; mso-footer-margin:.5in; mso-title-page:yes; mso-header: h1; mso-footer: f1; mso-first-header: f1; mso-first-footer: ff1; mso-paper-source:0; } div.Section1 { page:Section1; } #exportContent { margin:0in 0in 0in 900in; width:1px; height:1px; overflow:hidden; } -->table { border-collapse: collapse; } tr td { border: 2px solid black; } tr th { border: 2px solid black; } td { border: 2px solid black; } .header-color { background-color: lightgray } p {font-family: Arial} strong {font-family: Arial} h1 {font-family: Arial} .info { padding-left: 5px; font-weight: bold; font-size: 12.5pt; } .danone-alert { font-weight: bold; font-size: 12.5pt; color: blue; } .word { font-family:Arial } * {font-family: Arial} .stronger { padding-left: 5px; background-color: lightgrey; font-weight: bold; font-size: 15px; }</style></head><body style='tab-interval:.5in'>`;    }
    else {
        preHtml = `<html lang=\"pt-br\" accept-charset="UTF-8" xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'> <head><meta charset="UTF-8"><meta http-equiv="Content-type" content="text/html; charset=UTF-8"><title></title> <!--[if gte mso 9]><xml> <w:WordDocument> <w:View>Print</w:View> <w:Zoom>90</w:Zoom> </w:WordDocument> </xml><![endif]--> <style> p.MsoFooter, li.MsoFooter, div.MsoFooter { margin:0in; margin-bottom:.0001pt; mso-pagination:widow-orphan; tab-stops:center 3.0in right 6.0in; font-size:12.0pt; }</style> <style> <!-- /* Style Definitions */ @page Section1 { size:8.5in 11.0in; margin:${margem} ${margem} ${margem} ${margem}; mso-header-margin:.5in; mso-footer-margin:.5in; mso-title-page:yes; mso-header: h1; mso-footer: f1; mso-first-header: f1; mso-first-footer: ff1; mso-paper-source:0; } div.Section1 { page:Section1; } #exportContent { margin:0in 0in 0in 900in; width:1px; height:1px; overflow:hidden; } -->table { border-collapse: collapse; } tr td { border: 2px solid black; } tr th { border: 2px solid black; } td { border: 2px solid black; } .header-color { background-color: lightgray } p {font-family: Arial} strong {font-family: Arial} h1 {font-family: Arial} .info { padding-left: 5px; font-weight: bold; font-size: 12.5pt; } .danone-alert { font-weight: bold; font-size: 12.5pt; color: blue; } .word { font-family:Arial } * {font-family: Arial} .stronger { padding-left: 5px; background-color: lightgrey; font-weight: bold; font-size: 15px; }</style></head><body style='tab-interval:.5in'>`;
    }
  

    var postHtml = "</body></html>";
    var html = preHtml + document.getElementById(element).innerHTML +postHtml

    var blob = new Blob(['\ufeff', html], {
        type: 'application/msword'
    });

    // Specify link url
    var url = 'data:application/vnd.ms-word;charset=utf-8,' + encodeURIComponent(html);

    // Specify file name
    filename = filename ? filename + '.doc' : 'document.doc';

    // Create download link element
    var downloadLink = document.createElement("a");

    document.body.appendChild(downloadLink);

    if (navigator.msSaveOrOpenBlob) {
        navigator.msSaveOrOpenBlob(blob, filename);
    } else {
        // Create a link to the file
        downloadLink.href = url;

        // Setting the file name
        downloadLink.download = filename;

        //triggering the function
        downloadLink.click();
    }

    document.body.removeChild(downloadLink);
}

You can customize the preHtml variable to your needs.

Upvotes: 0

Blomersi
Blomersi

Reputation: 29

To generate a Word document simply add this code at the top of the page you want to convert.

<?php 
   header("Content-Type: application/vnd.ms-word");
   header("Expires: 0");
   header("Cache-Control: must-revalidate, post-check=0, pre-check=0");
   header("content-disposition: attachment;filename=MyReport.doc"); 
?>

If it is not enough you can try something with the phpWord

Upvotes: 0

prabin badyakar
prabin badyakar

Reputation: 1746

Simply run your html in your browser and copy the content from your browser and paste it to your word file.

Upvotes: 0

Related Questions