We would like to style PDFs with variable styles. For that we load the complete style description (“style=…”) / style itself (“background-color: #e7304b; margin: 0; padding: 15px 50px 8px 50px;”) into a variable and try to “inject” them into the source code of the PDF. However - the code will always be stripped or changed within the <div> tag.
Is there any valid way to get the styling from a variable into the PDF Source code? We even tried with the complete opening DIV tag, but failed.
You won’t be able to add the CSS code directly to the source code. You need to execute a script with the CSS and then add that variable in the PDF document. It will look like this:
Create the CSS variable and add <style></style> inside a backtick (template literal). Also add the variable @css at the end of the PDF document.
Although this works, the source code will get messy and very difficult to handle in the Tape PDF editor. I suggest you use an external HTML/CSS editor and then copy/paste the CSS to the variable and the HTML to the source code.
Another thing you could do instead is use inline CSS in the source code. The good thing about inline CSS is that you will be able to see the design without having to simulate variables.
We also tried later with preparing the whole body in an execute script field, which can then contain other variables and links to fields. We then only post the body variable into the PDF action. Its limited by the size of the variable.
But your approach seems to be a bit smarter - we didn’t try to add the css at the end so far.
Thanks!
If I remember correctly, this is a limitation of TinyMCE. We had the same workaround as @Luis in Tape and the previous platform.
We took it a step further and build out every using calc fields, them we put all of them into another calc before putting it into the editor itself. This eliminated all the empty tags that would populate in the HTML.
The approach with CSS in a variable works, but does not immediately solve all the problems: the PDF converter behind tape obviously cannot handle hyphenation, does anyone also have an approach for this?
