How to generate docx file using HTML code, embedded with CSS code inside style tags?

Question

I'm trying to generate a docx file and download it for the user, using HTML code which contains internal css styling and attributes for HTML tags. This HTML code is generated using the docx2html package, which allows (as it sounds) us to convert uploaded docx file to HTML, so I want to do the reverse process:

<p><meta charset=utf-8><meta key="generator" value="docx2html">docx  file titel 
<style type="text/css">#A * { margin: 0px; border: 0px; padding: 0px; box-sizing: border-box; }
#A table { width: 100%; border-collapse: collapse; word-break: break-word; }
#A section { margin: auto; background-color: white; color: black; position: relative; z-index: 0; }
#A p:empty::before { content: ""; display: inline-block; }
#A ul { list-style: none; }
#A ul > li > p { position: relative; }
#A ul .marker { position: absolute; }
#A a { text-decoration: none; }
#A .unsupported { outline: red solid 2px; }
#A .warning { outline: yellow solid 1px; }
#A p, #A h1, #A h2, #A h3, #A h4, #A h5, #A h6 { margin-bottom: 10px; line-height: 107.917%; }
#A span, #A a { font-family: Calibri; font-size: 11px; }
#A .Normal { margin-bottom: 13px; line-height: 115%; }
#A .Normal span { }
#A .Policepardfaut { }
#A .TableauNormal { }
#A .TableauNormal > tbody > tr > td { padding: 0px 7px; }
#A .Default { line-height: 100%; }
#A .Default span { font-family: Calibri; color: rgb(0, 0, 0); font-size: 12px; }
</style>
</p>

<div id="A" style="background-color: transparent; min-height: 1000px; width: 100%; padding-top: 20px; overflow: auto;">
<style type="text/css">
</style>
<section style="width: 793px; min-height: 1122px; padding: 94px; column-gap: 47px;">
<p class="Normal" style="line-height: 100%; text-align: right;"><span class="Policepardfaut" style="font-family: Calibri; font-weight: 700; color: rgb(0, 0, 0); font-size: 14px;">Alger, </span><span class="Policepardfaut" style="font-family: Calibri; font-weight: 700; color: rgb(0, 0, 0); font-size: 14px;">Le </span><span class="Policepardfaut" style="font-family: Calibri; color: rgb(0, 0, 0); font-size: 14px;">25</span><span class="Policepardfaut" style="font-family: Calibri; color: rgb(0, 0, 0); font-size: 14px;">/07/2018</span></p>
</section>
</div>

lolcatzftw · Accepted Answer · 2019-05-03 22:18:45Z

PHPWord

PHPWord is a nice library that you can use to read from and write to different formats. It also supports reading html and writing to docx. HTML styles can also be used.

https://github.com/PHPOffice/PHPWord

// Creating the new document...
$phpWord = new \PhpOffice\PhpWord\PhpWord();

$section = $phpWord->addSection();
$html = '<h1>Adding element via HTML</h1>';
$html .= '<p>Some well-formed HTML snippet needs to be used</p>';
$html .= '<h2 style="align: center">centered title</h2>';

\PhpOffice\PhpWord\Shared\Html::addHtml($section, $html, false, false);

// Saving the document as OOXML file...
$objWriter = \PhpOffice\PhpWord\IOFactory::createWriter($phpWord, 'Word2007');
$objWriter->save('example.docx');

php alternative.

you could also try what's suggested here -- this approach doesn't need any library -->

https://stackoverflow.com/a/43380995/5687225

javascript alternative.

if you want to do it via javascript you could use the following package pt-html-docx-js.

https://www.npmjs.com/package/pt-html-docx-js

you would use it like so

var converted = htmlDocx.asBlob(content, {orientation: 'landscape', margins: {top: 720}});
saveAs(converted, 'test.docx');

Collectives™ on Stack Overflow

How to generate docx file using HTML code, embedded with CSS code inside style tags?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related