Difference between revisions of "PDF Writer Custom Tags"

From SmartWiki
Jump to: navigation, search
m (List of Custom Tags (pd4ml))
 
(67 intermediate revisions by 3 users not shown)
Line 2: Line 2:
  
 
==List of Custom Tags (pd4ml)==
 
==List of Custom Tags (pd4ml)==
* '''style="pd4ml-display:none"''' or '''style="pd4ml-display:block"''': Controls whether a HTML element will be included or not included in the PDF. (See example below)
+
'''style="pd4ml-display:none"''' or '''style="pd4ml-display:block"''' Controls whether a HTML element will be included or not included in the PDF. Must be wrapped in angle brackets.
* '''style="PAGE-BREAK-inside: avoid"''': Prevents an HTML element from being broken by a page break. Note: If the element is more than a page in length this setting cannot be applied. (See example below)
 
  
* '''<pd4ml:page.break>''': inserts a page break at this location
+
'''style="PAGE-BREAK-inside: avoid"''': Prevents an HTML element from being broken by a page break. Note: If the element is more than a page in length this setting cannot be applied and will be ignored. Must be wrapped in angle brackets.
::Options:
 
::* ifSpaceBelowLessThan= pixels: allows to suppress the page break if the available space on the current page is more than the specified value.
 
::* htmlWidth=pixels: forces PD4ML to change current htmlWidth (screenWidth) value and to affect HTML-to-PDF scaling factor. “reset” returns htmlWidth to the initial state.
 
::* htmlWidth="reset"
 
::* pageFormat="rotate"
 
::* pageFormat="WxH"
 
::* pageFormat="reset"
 
::* next="even - odd"
 
::* pageCounter=pagenum
 
  
 +
'''pd4ml:page.break''' inserts a page break at this location. We recommend using the '''SmartFields PDF formatting''' setting for inserting page breaks between custom fields. Must be wrapped in angle brackets.
  
* '''<pd4ml:page.header> </pd4ml:page.header>''': Content between tags will be used as the page header. (See example below). Affects all subsequent pages (unless Scope option is defined)
+
: Options:
::Options:
+
:* ifSpaceBelowLessThan= pixels: allows to suppress the page break if the available space on the current page is more than the specified value.
::* scope="scope": explicitly defines pages where the header should appear. Example: scope="odd,5,15-25,45+,skiplast"
+
:* htmlWidth=pixels: forces PD4ML to change current htmlWidth (screenWidth) value and to affect HTML-to-PDF scaling factor. “reset” returns htmlWidth to the initial state.
::* height="height"
+
:* htmlWidth="reset"
::* width="width"
+
:* pageFormat="rotate"
::* style="associated style info"
+
:* pageFormat="WxH"
::* $[page], $[total] and $[title]: inserts current page number, total number of pages, and document title (respectively)
+
:* pageFormat="reset"
 +
:* next="even - odd"
 +
:* pageCounter=pagenum
  
 +
'''pd4ml:page.header''' and '''/pd4ml:page.header''' : Content between tags will be used as the page header. Must be wrapped in angle brackets.
  
* '''&lt;pd4ml:page.footer>''' first page footer. page $[page] of $[total]</pd4ml:page.footer>: Content between tags will be used as the page footer (see Example below). Affects all subsequent pages (unless Scope option is defined)
+
: Options:
::Options: same as pd4ml:page.header tag.
+
:* scope="scope": explicitly defines pages where the header should appear. Example: scope="odd,5,15-25,45+,skiplast"
 +
:* height="height"
 +
:* width="width"
 +
:* style="associated style info"
 +
:* $[page], $[total] and $[title]: inserts current page number, total number of pages, and document title (respectively)
  
 +
'''pd4ml:page.footer''' and '''/pd4ml:page.footer''' Use to define the footer. Typically enter '''page $[page] of $[total]''' Must be wrapped in angle brackets.
  
* '''&lt;pd4ml:toc>''': table of contents.
+
: Options: same as pd4ml:page.header tag.
::Options:
+
'''pd4ml:toc''' table of contents. Must be wrapped these in angle brackets.
::* pncorr="number": a correction value to add to page numbers
 
  
 +
: Options:
 +
:* pncorr="number": a correction value to add to page numbers
  
* '''&lt;pd4ml:page.break/>''': insert this for a PDF page break.
+
'''pd4ml:page.break/''' insert this for a PDF page break. Must be wrapped in angle brackets.
  
 +
==Page Format==
 +
To generate PDFs in a specific format within the body of the [[Web Page View]], add the appropriate tag below. We recommend adding the sample template to your Web Page View custom field. This will use SmartFields and will automatically create a formatted PDF for you.
 +
 +
* <span style="font-size: medium;">&lt;!--Use Landscape--></span> - will set the HTML width based on the paper type.
 +
* <span style="font-size: medium;">&lt;!--Use Letter--></span> - will set the page width to 971.
 +
* <span style="font-size: medium;">&lt;!--Use Legal--></span> - will set the page width to 1235.
  
==Examples==
+
==Table Size==
* The following will define HTML can be added to a [[Web Page View]] document to be used as the page header and footer. A different header is defined for the first page using the '''scope''' option.
+
Recommended table sizes are as follows:
:Only the header for the first page will be displayed in the [[Web Page View]] HTML view. The header for subsequent pages and the page footer are hidden using '''&lt;div style="display:none;pd4ml-display:block">'''
 
  
<pre>
+
* Letter 700 pixels wide
<pd4ml:page.header scope="1">
+
* Letter (landscape) 950 pixels wide
  <div  style="margin-top: 30px;margin-left:30px;margin-right:30px;margin-bottom:30px">
 
    <img src="/files/12345/f51222/HeaderImage.jpg" width="250px">
 
  </div>
 
</pd4ml:page.header>
 
  
<div style="display:none;pd4ml-display:block">
+
==Fonts and Special Characters==
<pd4ml:page.header scope="2+">
+
The web page view sample template includes a declaration for TTF (True Type Font). This TTF declaration is required for some Unicode characters to display.
  <div  style="margin-top: 30px;margin-left:30px;margin-right:30px;margin-bottom:30px">
 
    <table width="100%">
 
      <tr>
 
      <td><img src="/files/12345/f51222/HeaderImage.jpg" width="250px"></td>
 
      <td style="text-align:right">page $[page] of $[total]</td>
 
      </tr>
 
    </table>
 
  </div>
 
</pd4ml:page.header>
 
  
<pd4ml:page.footer>
+
===Changing Fonts===
  <div  style="margin-top:30px;margin-left:30px;margin-right:30px;margin-bottom:30px">
+
The default font for all text is Roboto and we recommend you use this font. It is possible to customize a PDF to use one of three other fonts: Times New Roman, Arial, and Verdana.
    <table width="100%">
 
      <tr>
 
      <td><img src="/files/12345/f51221/FooterImage.jpg" width="75px"></td>
 
      <td style="text-align:right"><span style='font-size:9.0pt;line-height:115%;color:gray'>SmartSimple Software >></span>
 
        <span style='font-family:"Arial Black","sans-serif";color:#008386'> <link>www.smartsimple.com</link></span>
 
      </td>
 
      </tr>
 
    </table></div>
 
</pd4ml:page.footer>
 
</div>
 
  
</pre>
+
'''Note''': These fonts are not officially supported but can be used in some scenarios like a customized Web Page View. Not all characters are supported in all fonts, example, Arial does not support U+0294, U+0313, U+2C61. Also Arial does not pass the I-L-1 test as the capital I and lower case L look very similar and as such should be used cautiously.
  
 +
If you want to use one of these alternate fonts, you will need to add a CSS class within the head of the web page view template. Then, reference the CSS class within your custom content wherever you wish to override the system font. For example, this web page view makes use of all available and supported fonts:
  
* The following will show the table in the HTML view, but it will not be included in the PDF:
+
[[File:WPV-Font-Sample.png|thumb|none|500px]]
<pre>
 
<table border="1" style="display:block;pd4ml-display:none">
 
  <tr><th>Header 1</th><th>Header 2</th></tr>
 
  <tr><td>row 1, cell 1</td><td>row 1, cell 2</td></tr>
 
  <tr><td>row 2, cell 1</td><td>row 2, cell 2</td></tr>
 
</table>
 
</pre>
 
  
 +
To classes in the screenshot are:
  
* The following will prevent a table from spanning 2 pages (unless the table is more than 1 page in length):
+
====CSS Styles====
<pre>
+
<pre>.font_times {
<table border="1" style="PAGE-BREAK-inside: avoid">
+
font-family: Times New Roman, Serif;
  <tr><th>Activity</th><th>Owner</th></tr>
+
color: lightcoral;
[#(?object=activity)
+
}
  <tr><td>@subject@</td><td>@owner@</td></tr>
 
#]
 
</table>
 
</pre>
 
  
==Page Format==
+
.font_arial {
To generate PDFs in a specific format within the body of the [[Web Page View]], add the appropriate tag below:
+
font-family: Arial, Sans-Serif;
* <font size="3">&lt;!--Use Letter--></font>
+
color: goldenrod;
* <font size="3">&lt;!--Use Legal--></font>
+
}
* <font size="3">&lt;!--Use Landscape--></font>
 
  
==Table Size==
+
.font_verdana {
Recommended table sizes are as follows:
+
font-family: Verdana, Sans-Serif;
* Letter 700 pixels wide
+
color: teal;
* Letter (landscape) 950 pixels wide
+
}
  
==Special Characters==
+
.font_default {
Most western Latin Unicode characters will be displayed normally. If your PDF will contain non-Latin characters such as Japanese, Korean or Greek, then the PDF writer must be told to use TTF (True Type Font) and the font should be specified.  
+
color: purple;
* <font size="3">&lt;!--Use TTF--></font>
+
}
 +
</pre>
  
See [[Convert Special Characters to PDF|here]] for more information
+
====HTML Portion====
 +
The above styled identifiers can now be placed within wrapped div tags for text you want to style. For example, this sample code displays how to call your CSS classes in your HTML template.
  
==Sample HTML==
+
* '''[https://wiki.smartsimple.com/images/8/80/WPV-Font-Classes.zip Download:]''' [[File:WPV-Font-Classes.zip]]
  
[[File:pd4ml-sample.jpg]]
+
==Specify PDF File Name==
 +
Use the '''Exported File Name''' input to change the name on the generated PDF file. This will change the HTML comment tag called '''filename='Application Preview'''' in the '''HTML Template'''.
 +
Variables such as @name@ can be used (ex. filename='WPF - @name@').
  
 
==See Also==
 
==See Also==
Line 123: Line 99:
 
* [[Web Page View]]
 
* [[Web Page View]]
 
* [[Convert Special Characters to PDF]]
 
* [[Convert Special Characters to PDF]]
 +
* [[PD4ML Troubleshooting Checklist]]
  
 
[[Category:PDF]]
 
[[Category:PDF]]

Latest revision as of 11:15, 29 March 2023

The following custom tags can be included in Web Page Views to manipulate the output when converting to PDF:

List of Custom Tags (pd4ml)

style="pd4ml-display:none" or style="pd4ml-display:block" Controls whether a HTML element will be included or not included in the PDF. Must be wrapped in angle brackets.

style="PAGE-BREAK-inside: avoid": Prevents an HTML element from being broken by a page break. Note: If the element is more than a page in length this setting cannot be applied and will be ignored. Must be wrapped in angle brackets.

pd4ml:page.break inserts a page break at this location. We recommend using the SmartFields PDF formatting setting for inserting page breaks between custom fields. Must be wrapped in angle brackets.

Options:
  • ifSpaceBelowLessThan= pixels: allows to suppress the page break if the available space on the current page is more than the specified value.
  • htmlWidth=pixels: forces PD4ML to change current htmlWidth (screenWidth) value and to affect HTML-to-PDF scaling factor. “reset” returns htmlWidth to the initial state.
  • htmlWidth="reset"
  • pageFormat="rotate"
  • pageFormat="WxH"
  • pageFormat="reset"
  • next="even - odd"
  • pageCounter=pagenum

pd4ml:page.header and /pd4ml:page.header : Content between tags will be used as the page header. Must be wrapped in angle brackets.

Options:
  • scope="scope": explicitly defines pages where the header should appear. Example: scope="odd,5,15-25,45+,skiplast"
  • height="height"
  • width="width"
  • style="associated style info"
  • $[page], $[total] and $[title]: inserts current page number, total number of pages, and document title (respectively)

pd4ml:page.footer and /pd4ml:page.footer Use to define the footer. Typically enter page $[page] of $[total] Must be wrapped in angle brackets.

Options: same as pd4ml:page.header tag.

pd4ml:toc table of contents. Must be wrapped these in angle brackets.

Options:
  • pncorr="number": a correction value to add to page numbers

pd4ml:page.break/ insert this for a PDF page break. Must be wrapped in angle brackets.

Page Format

To generate PDFs in a specific format within the body of the Web Page View, add the appropriate tag below. We recommend adding the sample template to your Web Page View custom field. This will use SmartFields and will automatically create a formatted PDF for you.

  • <!--Use Landscape--> - will set the HTML width based on the paper type.
  • <!--Use Letter--> - will set the page width to 971.
  • <!--Use Legal--> - will set the page width to 1235.

Table Size

Recommended table sizes are as follows:

  • Letter 700 pixels wide
  • Letter (landscape) 950 pixels wide

Fonts and Special Characters

The web page view sample template includes a declaration for TTF (True Type Font). This TTF declaration is required for some Unicode characters to display.

Changing Fonts

The default font for all text is Roboto and we recommend you use this font. It is possible to customize a PDF to use one of three other fonts: Times New Roman, Arial, and Verdana.

Note: These fonts are not officially supported but can be used in some scenarios like a customized Web Page View. Not all characters are supported in all fonts, example, Arial does not support U+0294, U+0313, U+2C61. Also Arial does not pass the I-L-1 test as the capital I and lower case L look very similar and as such should be used cautiously.

If you want to use one of these alternate fonts, you will need to add a CSS class within the head of the web page view template. Then, reference the CSS class within your custom content wherever you wish to override the system font. For example, this web page view makes use of all available and supported fonts:

WPV-Font-Sample.png

To classes in the screenshot are:

CSS Styles

.font_times {
font-family: Times New Roman, Serif;
color: lightcoral;
}

.font_arial {
font-family: Arial, Sans-Serif;
color: goldenrod;
}

.font_verdana {
font-family: Verdana, Sans-Serif;
color: teal;
}

.font_default {
color: purple;
}

HTML Portion

The above styled identifiers can now be placed within wrapped div tags for text you want to style. For example, this sample code displays how to call your CSS classes in your HTML template.

Specify PDF File Name

Use the Exported File Name input to change the name on the generated PDF file. This will change the HTML comment tag called filename='Application Preview' in the HTML Template. Variables such as @name@ can be used (ex. filename='WPF - @name@').

See Also