Cashboard Online Invoicing Service Instructions

You can send invoices to your customers directly from Cashboard Dynamic. Use Cashboard to generate an email message with your invoice as a PDF document attached and send it to PostalMethods, where it will be sent as a postal letter within one business day.

Note that you can adjust any of your existing templates for use with PostalMethods. The following instructions should be used as guidelines:

  1. Adjust the default document template and CSS:

    As a preparatory step, we will need to customize the invoice template for use with PostalMethods. The recipient and return addresses need to be positioned correctly so they are clearly displayed through the envelope windows. Editing templates may be enabled for Cashboard Dynamic accounts only.

    1. Sign in to your Cashboard account
    2. From the Settings selection tab appearing on the right side of the top navigation bar, select Templates

      Cashboard - Navigation bar - Templates
    3. Edit the invoice templates as explained below. In case you already modified "css_document" or "html_invoice", use our suggested code as guidelines and modify your templates accordingly.

      1. In the Templates list, click on css_document

        Cashboard - Templates - css navigation
      2. Copy all of the following CSS_Document code and replace the existing code
      3. Click on Save Template: css_document
      4. Click on html_invoice from the Templates list

        Cashboard - Templates - html document
      5. Copy all of the following HTML_Invoice code and replace the existing code
      6. Click on Save Template: html_invoice
  2. Create a "Send Letter" client:
    This new person/client is used to email invoices to PostalMethods and should be used in case you send invoices to Companies (and not to a Person). Just add a single Person and associate it with all of your companies.

    1. Click on Clients & Employees appearing on the right side of the top navigation bar

      Cashboard - Navigation bar - Clients
    2. On the Companies column, click on SHOW ALL PEOPLE
    3. To add a new person, click on the green plus sign next to People

      Cashboard - Companies and People - Add person
    4. At the dialog window click on Add a client
    5. At the Adding Person (client) window just fill in a name to clarify that this is the client used to send letters to PostalMethods, such as "Send Letter", and set the Email field to: send@letter.postalmethods.com
    6. In the Companies selection box, check all the companies you want to be able to send letters to

      Cashboard - Companies and People - Send Letter Details
    7. Click on Create New Person to save
  3. Send invoices by postal mail:

    1. Select an existing invoice you would like to send as a letter, or create a new invoice
    2. Edit the invoice as you like. when finished click on the Send Invoice button

      Cashboard - Send Invoice
    3. Below Send e-mail to check the box next to your Send Letter client
    4. Check the box next to Include PDF in e-mail and click Send

      Cashboard - Send invoice as a letter

  4. An e-mail message containing the attached invoice is sent to PostalMethods. The address is extracted from the document; your invoice is printed, folded, inserted, stamped and delivered to the postal agency. You can see your letter being processed in the PostalMethods Control Panel Activity table.



    Please Note

    • The email account you are using in order to send the email message to PostalMethods must be defined as an Allowed Email Sender in the PostalMethods Security Settings tab.
    • You can send letters via PostalMethods by using other applications, by using your favorite office application, by using our "Quick Send" web form or by using our advanced Web Services (for developers).
    • You can simulate sending letters for free in order to see how your resulting letter and envelope will look like. There is no charge for these tests. You can view your letters in the PostalMethods control panel. To simulate a letter simply include this string: /Development anywhere in the Subject line of your email and your letter will be simulated instead of being delivered to the postal service.






    CSS_Document

    /* Changed text color to black */
    {% assign doc_details_bg = 'D4D3FF' %}
    {% assign doc_details_text = '000000' %}
    {% assign doc_header_text = '000000' %}
    {% assign doc_table_header_bg = 'DDDDDD' %}
    {% assign doc_table_header_text = '000000' %}
    {% assign doc_table_border = '999999' %}
    {% assign doc_total = '000000' %}
     
    body, p, ol, ul, td, input, textarea, select, option {
      font-family: 'Verdana', 'Arial', sans-serif;
      font-size:   12px;
      line-height: 17px;
    }
     
    #document_content_container {
      margin: 0em 1em;
    }
     
    #document_navbar {
      font-weight: bold;
      font-size: 1.2em;
      background-color: #eee;
      border-bottom: 1px dashed #999;
      border-top: 1px dashed #999;
      padding: 0px;
      margin-bottom: 10px; /* AAA */
      display: block; 
    }
     
    /* Add some margin below the recipient address to make sure content is not visible through the envelope window (this is a new ID) */
    #margin_below_address {
      margin-bottom: 60px;
    }
     
    #doc_title {
      margin-top: 0px;
      letter-spacing: -0.1em;
      font-size: 30px;
      color: #{{ doc_header_text }};
    }
     
    /* Set the absolute position of the return address div so it is visible through the top envelope window */
    #company_info {
      position: absolute;
      top: 0.12in;
      left: 0.1in;
    }
     
    .document_details {
      padding: 10px;
      /* Delete any background color
      background-color: #{{ doc_details_bg }}; */
      margin-bottom: 10px;
      margin-top: 10px;
      color: #{{ doc_details_text }};
    }
    /* Set the absolute position of the recipient address so it is visible through the bottom envelope window (this is a new ID) */
    #recipient_address {
      position: absolute;
      top: 1.57in;
      left: 0.10in;
    }
     
    .document_details label {
      font-weight: normal;
      letter-spacing: -0.1em;
    }
     
    .document_details h3 {
      background-color: transparent;
      color: #{{ doc_header_text }};
    }
     
    #document_type {
      text-align: right;
      letter-spacing: 0.3em;
      color: #ccc;
      margin-top: 20px;
      margin-bottom: 20px;
    }
     
    #total_amount {
      font-size: 2.5em;
      line-height: 1.5em;
      color: #{{ doc_total }};
      letter-spacing: -0.1em;
    }
     
    h2 {
      background-image: none;
      background-color: transparent;
      color: #666;
      padding: 10px 0px 5px 0px;
      border-top: 0px;
      border-bottom: 1px dashed #ddd;
      font-size: 1.3em;
    }
     
    .formContent label {
      text-align: right;
      display: block;
      padding-right: 10px;
    }
     
    .left_aligned {
      float: left;
      text-align: left;
    }
    .right_aligned {
      float: right;
      text-align: right;
    }
     
    /* TABLE LIST OVERRIDES */
     
    table.list {
      margin-top: 20px;
      border-collapse: collapse;
    }
     
    table.list tr th, table.list tr th.first, table.list tr th.last, table.list tr.footer td {
      background-image: none;
      background-color: #{{ doc_table_header_bg }};
      border-color: #{{ doc_table_border }};
      border-top: 1px solid #{{ doc_table_border }};
      border-bottom: 1px solid #{{ doc_table_border }};
      color: #{{ doc_table_header_text }};
      font-size: 1em;
      padding: 10px !important;
      font-weight: bold;
    }
     
    table.list tr.summary td {
      font-weight: normal;
      padding: 5px 10px;
    }
     
    table.list tr.summary.project td {
      border-top: 1px solid #{{ doc_table_border }};
    }
     
    table.list td {
      padding-top: 5px;
      padding-bottom: 5px;
    }
     
    table.list tr.odd td, .odd {
      background-color: #EFEFEF;
    }
     
    table.list table.inner {
      width: 100%;
    }
    table.list table.inner td {
      padding: 2px !important;
      border: 0px;
      background-color: transparent;
      color: #{{ doc_details_text }};
    }




    HTML_Invoice

    <style type="text/css">
      {% include 'css_document' %}
    </style>
    {{ # Moved the company header and data originally displayed near the postal address to the right side of the document so it is not visible through the envelope windows }}
        <table class="right_aligned">
          <tr>
            <td colspan="2"><h1 id="doc_title">{{ account.company.name }}</h1></td>
          </tr>
          <tr>
            <td class="bigger">{{ 'Invoice ID' | make_label }}</td>
            <td style="padding-right:10px;" class="bigger">
              {{ invoice.id }}
            </td>
          </tr>
          <tr>
            {{ # INVOICE DATE }}
            <td>{{ 'Invoice Date' | make_label }}</td>
            <td style="padding-right:10px;">
              {{ invoice.invoice_date | format_date }}
              <span class="info noprint">
                ({{ invoice.invoice_date | format_date_in_english }})
              </span>
            </td>
          </tr>
          <tr>
            {{ # INVOICE DUE DATE }}
            <td>{{ 'Due Date' | make_label }}</td>
            <td style="padding-right:10px;">
              {{ invoice.due_date | format_date }}
              <span class="info noprint">
                ({{ invoice.due_date | format_date_in_english }})
              </span>
            </td>
          </tr>
        </table>
     
    {{ # Position your company name and return address so it is visible through the top envelope window }}
    <div id="company_info" class="left_aligned">
      <p>
        {% include 'company' for account.company %}
      </p>
    </div>
     
    <div class="clear"></div>
     
    {{ # DETAILS }}
     
    <div class="document_details">
      {{ # LEFT DETAILS }}
      {{ # Position your customer's postal address so it is visible through the envelope bottom window, in this case by adding the "recipient_address" ID }}
      <div class="left_aligned" id="recipient_address">
        <table class="formContent">
          <tr>
            <td style="vertical-align:top;"></td>
            <td>
              {% include 'client' for invoice.client %}
            </td>
          </tr>
          {% if invoice.project_count > 0 %}
            <tr>
              <td style="vertical-align:top;">{{ invoice.project_count | pluralize: 'Project' | make_label }}</td>
              <td>
                {% for p in invoice.projects %}
                  {{ p.name }}
                  <br/>
                {% endfor %}
              </td>
            </tr>
          {% endif %}
        </table>
      </div>
     
      {{ # RIGHT DETAILS }}
      {% capture total_due_string %}Total Due On<br/> {{ invoice.due_date | format_date }}{% endcapture %}
      <div class="right_aligned">
        <span class="bigger">{{ total_due_string | make_label }}</span><br/>
        <div id="total_amount">{{ invoice.total_due | format_money }}</div>
      </div>
      {{ # Create a margin between the postal address and the rest of the invoice content so it is not visible through the envelope window }}
      <div class="clear" id="margin_below_address"></div>
    </div>
     
    <div class="clear"></div>
     
     
    {{ # NOTES }}
     
    {% if invoice.notes != blank %}
      <h2>Notes</h2>
      <div class="content_pad">
        {{ invoice.notes | format_text }}
      </div>
    {% endif %}
     
     
    {{ # INVOICE ITEMS TABLE }}
     
    <table class="list" cellpadding="0" cellspacing="0">
      <colgroup>
        <col />
        <col style="width:100px;" />
        <col style="width:100px;" />
        <col style="width:100px;" />
        <col style="width:130px;" />
      </colgroup>
      <tr>
        <th class="first">Item Description</th>
        <th class="numeric">Quantity</th>
        <th class="numeric">Price Per</th>
        <th class="numeric">Flat Fee</th>
        <th class="numeric last">Total Cost</th>
      </tr>
      {% if invoice.line_items == null %} 
        <tbody id="no_items_body">
          <tr>
            <td colspan="6" class="first last info">
              No items have been created for this invoice yet.
            </td>
          </tr>
        </tbody>
      {% else %}
        <tbody id="item_list_body">
          {{ # INVOICE ITEM LOOP }}
     
          {{ # First, display items that don't belong to any project }}
          {% for item in invoice.items_ad_hoc %}
            {% include 'invoice_row' for item %}
          {% endfor %}
     
          {{ # Now, display items grouped by project that belong to one }}
          {% for project in invoice.items_by_project %}
            <tr class="summary project">
              <td colspan="5" class="first last">
                {{ project[0] }}
              </td>
            </tr>
            {% for item in project[1] %}
              {% include 'invoice_row' for item %}
            {% endfor %}
          {% endfor %}
     
     
        </tbody>
      {% endif %}
     
      {{ # ITEM FOOTER }}
     
      <tbody id="item_list_footer">
        {{ # ITEM TOTAL }}
        {% if invoice.sales_tax != null %}
          <tr class="summary first">
            <td class="first numeric" colspan="4"><b>Item Total</b></td>
            <td class="numeric money_gain last">{{ invoice.item_cost | format_money }}</td>
          </tr>
          {{ # SALES TAX }}
          <tr class="summary">
            <td class="first numeric" colspan="4">
              <b>Tax</b> - {{ invoice.sales_tax }}%
            </td>
            <td class="numeric money_gain last">{{ invoice.tax_cost | format_money }}</td>
          </tr>
        {% endif %}
        {% if invoice.sales_tax_2 != null %}
          {{ # SALES TAX 2 }}
          <tr class="summary">
            <td class="first numeric" colspan="4">
              <b>Tax 2</b> - {{ invoice.sales_tax_2 }}%
            </td>
            <td class="numeric money_gain last">{{ invoice.tax_cost_2 | format_money }}</td>
          </tr>
        {% endif %}
     
        {{ # EARLY DISCOUNT }}
        {% if invoice.should_apply_early_discount == true %}
          <tr class="summary">
            <td class="first numeric" colspan="4">
              <b>Early Payment Discount</b> - {{ invoice.early_discount_percentage }}% every {{ invoice.early_period_in_days }} days paid early
            </td>
            <td class="numeric money_gain last">
              {{ invoice.early_discount | format_money }}
            </td>
          </tr>
        {% endif %}
     
        {{ # LATE FEE }}
        {% if invoice.should_apply_late_cost == true %}
          <tr class="summary">
            <td class="first numeric" colspan="4">
              <b>Late Fee</b> - {{ invoice.late_percentage }}% every {{ invoice.late_period_in_days }} days past due
            </td>
            <td class="numeric money_gain last">{{ invoice.late_cost | format_money }}</td>
          </tr>
        {% endif %}
     
     
        {% if invoice.payments %}
          {{ # INVOICE TOTAL }}
          <tr class="summary">
            <td class="first numeric" colspan="4">Invoice Total</td>
            <td class="numeric money_gain last">{{ invoice.final_cost | format_money }}</td>
          </tr>
          {% for payment in invoice.payments %}
            {{ # PAYMENTS }}
            <tr class="summary">
              <td class="first numeric" colspan="4">
                Payment: {{ payment.id }} - {{ payment.created_on | format_date }}
              </td>
              <td class="numeric money_loss last">
                {{ payment.amount | format_money }}
              </td>
            </tr>
          {% endfor %}
        {% endif %}
     
        {{ # FINAL TOTAL }}
        <tr class="footer">
          {% if invoice.has_been_paid %}
            <td class="first numeric last" colspan="5">
              <span class="money_gain">Paid in full</span>
            </td>
          {% else %}
            <td class="first numeric" colspan="4">Total Due</td>
            <td class="numeric last">
              <span class="money_gain">{{ invoice.total_due | format_money }}</span>
            </td>
          {% endif %}
        </tr>
      </tbody>
    </table>