Page Comparison

This blog post captures some of the process and code tips and tricks used to create a PDF template for FPN and other modules.

...

On the first page of the creation, wizard pick HTML and pick the "Load Sample HTML" option (the MS Word option will be phased out, and has been kept for a while to support last years users).

The top large text area is the "Letter Contents", this is where the main template goes into, you can identify keywords and change them in here. It may be easier to copy the text out into a better HTML text editor then paste it back in when you are done. NOTE this letter contents section is not a FULL HTML page on its own, it is 3/4 of a page.

The 2nd large text area is the "Additional CSS", this is where formatting rules are applied, such as font, font size, spacing, colours etc.

You can upload your PDF letterhead temp[late and set the margins for the first page. Note you can set the Addressee details location to fit in a windowed envelope, this location is set irrespective of the rest of the page, to ensure it is exactly where it needs to be regardless of where other information may flow to see the information on the <address>  tag further below.

When you are done, save the record. On the next page, you can preview the merge letter. What it does is merge the current Merge Letter with the first record in the current event. So it will help to make sure that record has photos, notes and details that will test the template properly, you may need to work in a test event for this.

Listing the Merge Tokens

From the mail merge settings page, Administration→Settings→Merge Templates select any of the templates records.

...

<!-- The address block can be positioned for windowed envelopes by uncommenting the positioning CSS -->
<address>
    {if $item.overrideOwnerDetails}
        {$item.overrideOwnerDetails|nl2br}
    {else}
        {$assetContact.fullName}
        <br />
        {$assetContact.address1}<br/>
        {$assetContact.address2}<br/>
        {$assetContact.address3} {$assetContact.address4}
    {/if}
</address>

<article>
    <!-- Put one box to the left and one to the right to format the top bit-->
    <p class="left-box">
        <strong>I direct:</strong>
        <!-- Leave a big space here for the address window, which was defined above and is absolutely positioned here -->
        <br />
        <br />
        <br />
        <br />
        <br />
    </p>
    <p class="right-box right-text">
        <strong>Notice #{$item.id}</strong><br />
        Issued {$MERGE_DATE}<br />
        <br />
        <em>The owner or occupier of:</em>
        <br />
        {$item.Asset.friendly}
        <br />
        Property No. {$item.Asset.codefriendlyCode}
    </p>
</article>

Note that in this example, the <address> element has been placed outside of the <article> body. This is optional, but aids in understanding that it floats above the body rather than being positioned where it was written.

...

Currently there are three override fields on the FPN form which are listed below along with the tokens you need to use for these fields for them to appear in the letter:

• Override Owner Details 
• Override Property Number
• Override Location

{$item.overrideOwnerDetails}
{$item.overridePropertyNumber}
{$item.overrideLocation}

...

img.media { 
    width: 20cm; 
}

How to use your own text descriptions

img.media {
    width: 70%;
}