TinyMCE HTML Editor
You can use the TinyMCE HTML editor to create content for templates and website pages. Although the editor appears throughout eTapestry, some editor options may not be available in all locations. The editor also respects many standard keyboard short cuts.
We recommend you use the editor to:
-
Compose the text and HTML formatting within the eTapestry Communication Template Wizard. Do not compose in a word processor program and copy and paste the content into the template, because Microsoft Word and other programs may apply formatting that cause errors with the template.
-
Format spacing for text, images, tables, and other items. Do not use the space bar to adjust alignment, because this can cause some email to display incorrectly.
-
Upload, insert, and format images. Do not copy and paste an image from your computer into the template, because the image must be uploaded for your recipient to receive it. Do not link to an image that is uploaded on a website that your organization does not host and maintain, because if the website changes your link and image may break.
For information about options on the HTML editor toolbar, review the following sections.

To bold text, select the text and click Bold.
To italicize text, select the text and click Italic.
Warning: Arial Black, Comic Sans, Impact, Lucida Console, Lucida Sans Unicode, or Tahoma fonts, will not be italicized in PDFs generated from eTapestry. However, they will be italicized in the HTML editor, emails, and Microsoft Word. This is because these six fonts do not have an italicize version available, but most operating systems and email providers can create a fake italicized version.
To underline text, select the text and click Underline.
To align text to the left, select the text and click Align left.
To center text, select the text and click Align center.
To align text to the right, select the text and click Align right.
To justify the text, select the text and click Justify.
To insert an unordered list, place your cursor in the desired location and click Bullet list.
To insert an ordered list, place your cursor in the desired location and click Numbered list.
To indent less, select the text and click Decrease indent.
To indent more, select the text and click Increase indent.
To select a font, select the text, click Font Family, and select a font.
Tip: If your template includes non-Latin characters, you must use the International Serif font.
To re-size text, select the text, click Formats, and select a size.
To change the color of text, select the text, click Text color, and select a color.
To change the background color, select the text, click Background color, and select a color.

To remove an item, select it and click Cut.
To duplicate an item, select it and click Copy.
To insert a item that you have cut or copied, place your cursor in the desired location and click Paste.
To undo a recent action, click Undo.
To redo an action that was undone, click Redo.

In general, we do not recommend pasting content from another programs into eTapestry's HTML editor. When you copy and paste content, invalid HTML code commonly copies over from the other program. This may cause problems with the way that the content appears in the HTML editor for your documents and emails.
The HTML editor is equipped to handle the pasting in of foreign content, particularly content that was created in Word. The HTML editor attempts to sanitize the content by removing incorrect formatting commands from the other program. However, this is not a guarantee your HTML code is clean. Depending on the content's format applied by the other program, the HTML editor may or may not be able to remove all non-HTML code. Due to this, eTapestry does not support the use of content created in another program and pasted in the HTML editor. If you experience issues with a template that contains content created in another program, we recommend you create and design the content again using the HTML editor.

To insert or change an image, place your cursor in the desired location and click Insert/edit image. The General tab of the Insert/edit image window appears.
Tip: To improve image load time, we recommend that an image's file size be less than 20 KB for newsletters and online forms for desktop and mobile devices. You can insert larger images, but some newsletter recipients may flag the email as spam.
-
In the Source field, browse to and select an image from your local computer.
-
In the Image description field, enter a brief description of the image. This description appears whenever an image fails to load or when a reader hovers a cursor over the image. It's also used by screen readers for visually impaired recipients.
-
To limit the display size, enter Dimensions.
Note: For a relative width, enter a percent and select the percent sign (%). For a PDF, we recommend you use a relative width so that the image adjusts to best fit the page. For a fixed width, enter the number of pixels and select px. For a Word document or email, we recommend you use a fixed width, so Microsoft Word and Outlook 2007 render the image correctly. Alternatively, you can select the image and drag the side of the image to re-size it. To maintain the width to height ratio, drag the corner of the image. When you re-size an image this way, the image is set to a fixed pixel width.
To maintain the width to height ration and prevent distortion of fixed width images, select Constrain proportions.
Tip: We recommend banner and header images be less than 600 pixel wide, sidebar image be less than 100 pixels wide, and main column images less than 350 pixels wide.
-
To enter a CSS style string, enter a style on the Advanced tab.
-
To adjust the margins around the image, click the Advanced tab and then enter the pixels of vertical and horizontal space.
-
Click Ok.
To move a image up or down in the template, select the image and drag it to the desired location.

To insert or change a hyperlink, place your cursor in the desired location and click Insert/edit link.
-
In the URL field, enter the full web address (including http://)
For a email address, type "mailto:" and then enter the full email address. Based on the recipient's default browser, a compose message window appears with the linked address in the To field.
To link to an existing anchor, type "#" and then enter the name of the anchor.
-
In the Text to display field, enter a brief description of the link. This description appears for the recipient to click the link.
-
In the Target field, you can determine whether the link should open in a new window. If you select None, the link respects the recipient’s browser settings.
-
Click Ok.
To create an anchor, place your cursor in the desired location and click Anchor. Enter the name and click Ok. The anchor icon appears in your template to indicate the anchor location; however, readers will not see the icon. An anchor is a marker for a particular section in your template. Use an anchor to create a short cut so readers can jump to the particular section. For example, you can create a table of contents for a newsletter and use anchors so readers can jump to a specific article of interest.
Tip: In advanced editor mode for a communication, you can also choose the anchor from the anchors menu, which lists all anchors in the template.

To insert a YouTube video, place your cursor in the desired location and click YouTube. Enter the video URL and click Insert.
Note: You can only insert a YouTube video when you design a Personal Fundraising web page.

To insert special characters (such as mathematical symbols or foreign accents) place your cursor in the desired location, click Special Character, and select a character.

To insert solid, horizontal line, place your cursor in the desired location and click Horizontal line.

To insert a table in a template, place your cursor in the desired location and click Insert Table, or right click and then select Insert a New Table. The Insert Table screen appears. Enter the number of columns and rows. Then click Insert.
To view or hide grid lines for the cells, click Toggle Guidelines.
To edit a table, click inside the table and then click Edit Table, or right click on the table and select Table Properties. Enter your changes and click Update. However, you can't add columns or rows in this way.
You can edit the alignment of text within a table when you insert or edit a table. From the General tab, select whether the text should be left justified, right justified, or centered.
For example, the following image shows a template that uses tables nested inside each other. The table with a white background, headers, and two columns of content is centered inside the table with a dark red background.
You can edit the width of the entire table when you insert or edit one. From the General tab, in the Width field, enter a percent and the percent sign (%) for a relative width. We recommend you use a relative width so that the table adjusts to best fit the reader's screen. For a fixed width, enter the number of pixels only.
You can edit the height of the entire table. However, we recommend that you leave the Height field on the General tab blank, so that the content determines the height of the table.
You can edit the background color of the entire table, a specific row, or a specific cell when you insert or edit a table. From the Advanced tab, click the icon to open the color picker. Select a color and click Update to apply it.
Warning: From the Advanced tab, you can also select a background image for your table. However, we recommend you do not use background images because Microsoft Outlook 2007 does not render the images. If you use a background image, also select a background color so all recipients can read the text.
To remove a table, right click on the table and select Delete Table. The table and its contents are deleted.
To add a row to a table, right click a row above or below where you want to add another. A menu appears. Hover your cursor over the Row option and then click Insert Row Before or Insert Row After.
To remove a row from a table, right click the row. A menu appears. Hover your cursor over the Row option and then click Delete Row. The row and its contents are deleted.
To add a column to a table, right click a column adjacent to where you want to add another. A menu appears. Hover your cursor over the Column option and then click Insert Column Before or Insert Column After.
To remove a column from a table, right click the column. A menu appears. Hover your cursor over the Column option and then click Delete Column. The column and its contents are deleted.
To combine adjacent cells in a table, select the cells that you want to merge and click Merge Table Cells. You can also select the cell in the top left corner, click Merge Table Cells, enter the number of rows and columns to merge, and click Merge.
To split cells that were merged, place your cursor inside the cell and click Split Merged Table Cells. The cells are separated into their original format.
To hide or show grid lines that delineate cells, click Toggle Guidelines.
You can edit the width, padding, background color, border color of a cell. You can also edit the alignment of its contents. Place your cursor insider the cell and click Table Cell Properties. You can also select cells, right click, hover your cursor over the Cell option, and select Table Cell Properties. Enter your changes and click Update to apply them.
-
To edit the alignment of the content of a cell, from the General tab, in the Alignment field, select whether the content should be left justified, right justified, or centered. You can also highlight the content of the cell and click Align Left, Align Right, or Align Center.
-
To edit the width of a cell, from the General tab, in the Width field, enter a percent and the percent sign (%) for a relative width based on the table size. For a fixed pixel width, enter a number only. When you adjust the width of one cell, all cells in the column are also updated.
Tip: We recommend you leave width blank so the content determine the cell width.
-
To create space between the contents of a cell and the sides of the cell, increase the padding. From the General tab, enter the number of pixels for padding to the top, bottom, left and right of the content of the cell. When you adjust the padding, rows and columns also adjust.
Warning: Programs that use Microsoft Word to render text, such as Microsoft Outlook 2007, may not render cell padding correctly.
-
To edit the background color of a cell, from the Advanced tab, click the color icon to open the color picker.
Warning: From the Advanced tab, you can also select a background image for your cell. However, we recommend you do not use background images because Microsoft Outlook 2007 does not render the images. If you use a background image, also select a background color so all recipients can read the text.
Note: When you select colors for a table, the cell color takes precedence over the row and table colors and the row color takes precedence over the table color. If no cell or row color is selected, the table color is used.

Data merge tags enable you to merge data from specific fields in accounts or journal entries into documents or emails. When you generate letters or emails, the tag is replaced with the specific data from each entry in your query. Consider using data merge tags for a thank you letter template to include the constituent's name, address, salutation, and the date and amount of the donation.
Tip: You can also use widgets to merge data into your documents or emails.
When you preview a template, the preview document shows your user account information for the data tags, because you have yet to select a constituent account. If you use fields that do not exist for your user account, the fields are blank in the preview. However, if you insert the "Received" tag, the received amount will preview as $5.00. If you insert tags for other system-defined currency fields, the amounts will preview as $0.00. If you insert the tag for the journal field Date, the transaction date previews as the current date.
When you generate a document or email, if there is no data for the entry in a field that you inserted, the field is blank in the communication.
-
You may need to include fields in the address block that might not have data in them for every constituent. For example, some people insert a Company field in the address block in case the constituent prefers to receive mail at their Business persona, however many constituents may not have a company listed. We recommend you do not include extra spaces in your address block. In this way, when there is no company list, instead of a blank space, the line is "collapsed." To ensure that you have no extra spaces, highlight the address block.
-
In the following example, you'd need to remove the extra spaces at the end of the lines containing "Name", "Company", and "Address" to ensure that those lines can collapse if there is no data in the fields.
To insert a data merge tag into a communication template, place your cursor in the location where you want to insert the field and then click Insert eTapestry Data Merge Value. The Merge Values screen appears. From the Fields tab, select a Category and then select a Field; you can also use the search field at the bottom of the screen. From the Options tab, you format the field, select aggregate options, and select default values. Then click Insert.
To edit an inserted data merge tag, double click the tag, or right click the tag and then click Modify eTapestry Merge Value. Enter your changes and click Update to apply them.
Aggregates enable you to perform calculations on journal entry fields. There are three categories of aggregates: Math, Date Ranges, and Ordinal Number.
Tip: You can use these same aggregate options for custom reports.
Math functions aggregate data using basic bath functions on currency and number fields.
-
Sum - This shows the total of all values in the field for each account, based on the journal entries in your query.
Note: When you generate documents or emails, if you select One Per Account or One Per Household for Grouping, eTapestry automatically sums the corresponding values even if you do not use the sum aggregate.
-
Avg - This shows the average of all values in the field for each account, based on the journal entries in your query.
-
Min - This shows the lowest value in that field for each account, based on the journal entries available in your query.
-
Max - This shows the greatest value in that field for each account, based on the journal entries available in your query.
Date range functions calculate sums for currency and number fields based on a specific time period for each account, based on the journal entries available in your query.
Note: The Fiscal Year date range is based your organization preference setting for Last month of the fiscal year.
Ordinal number functions aggregate data based on the date order of journal entries.
-
First - This shows data starting with the oldest journal entry for each account, based on the journal entries in your query.
-
Second - This shows data starting with the second oldest journal entry for each account, based on the journal entries in your query.
-
Third - This shows data starting with the third oldest journal entry for each account, based on the journal entries in your query.
-
Fourth - This shows data starting with the fourth oldest journal entry for each account, based on the journal entries in your query.
-
Fifth - This shows data starting with the fifth oldest journal entry for each account, based on the journal entries in your query.
-
Last - This shows data starting with the most recent journal entry for each account, based on the journal entries in your query.
You can format data merge tags so the text looks how you want, based on whether the field is a text, date, currency, or number field.
For text fields:
-
Text - This shows the text in its plain, original format.
-
Lower Case - This shows the text with all capital letter made lower case.
-
Upper Case - This shows the text in all capital letters.
For date fields:
-
Date - This shows the original format of the date (mm/dd/yyyy or dd/mm/yyyy)
-
Date (Long Format) - This show the date as Month dd, yyyy. For example January 1, 2015.
-
Month/Day - This shows the date as mm/dd.
-
Month/Year - This shows the date as mm/yyyy
For currency fields:
-
Currency, Full - This shows the monetary amount with currency symbol, punctuation, and two decimal places. For example, $1,500.50.
-
Currency, No Decimal - This shows the monetary amount rounded to the nearest whole number, with currency symbol and punctuation. For example, the amount $1500.50 would be displayed as $1,501.
-
Number, Full - This shows the monetary amount with punctuation and two decimal places but no currency symbol. For example, 1,500.50.
-
Number, No Decimal - This shows the monetary amount rounded to the nearest whole number, with punctuation but no currency symbol. For example, the amount $1500.50 would be displayed as 1,501.
For number fields:
-
Number - This shows the amount as it was entered, with punctuation inserted for numbers greater than 999. For example, 1,000 or 1,000.00.
-
Number, Full - This shows the amount with two decimal places and punctuation inserted for numbers greater than 999. For example,1,000.00.
-
Number, No Decimal - This shows the amount rounded to the nearest whole number, with punctuation inserted for numbers greater than 999. For example, 1,000.
You can also set a default value for data merge tags, so that when a field is blank the document or email shows the default value. For example, if you use the Short Salutation field, you may want to enter "Friend" as the default value, in case some constituent accounts don't have a short salutation.
Note: For Advanced Mass Emails, the default values are used for Forward to a Friend and View as Web Page options.

Letter widgets enable you to merge data from your eTapestry database entries into documents or emails in a structured format.
-
Entry List - This widget shows journal entries in a list format, much like a report. Consider using this in annual receipts to show details about each donation you received from the constituent this year.
You can customize this widget by selecting which columns to include, naming the column headings, formatting and aligning the data, and sorting by a column. You can also select whether to include a Total at the bottom of the list.
-
Pledge Schedule - This widget shows the dates and amounts of scheduled and received payments for a particular pledge. Consider using this in pledge reminders to give the constituent an overall picture of the pledge.
-
Order Details - When you use eStore (Cart) that is available with the eTapestry Essentials package, you must include this widget in the communication template for the order confirmation email.
-
eCommerce Details - This widget is used for custom eCommerce confirmation emails. It shows the primary details from an eCommerce submission, including the name, address, email, phone, and transaction information.
Tip: You are not required to include this widget. You can use merge tags for an entry list widget instead.
-
Account Photo - When you use Attachments that is available with the eTapestry Essentials or Pro packages, you can select this widget to include the image stored on the account's Home page. Consider using this widget in a mailing label template to create a constituent directory. When you include it, a placeholder image appears in the template. Although you cannot customize this widget, you can customize the height, width, and alignment of the image.
Note: The account photo widget is compatible with document types, such as PDFs and Microsoft Word files. However it is not compatible with emails.
-
Donor Loyalty Link - If you use the Donor Loyalty module, you can use this widget to insert a link to the Donor Loyalty Survey page. You define the text for the link (for example, "Click here." or "Let us know what you think!") and it inserts the correct link associated with each recipient account in the email.
You insert widgets when you edit the communication template. To insert a widget, place your cursor in location where you want the widget and click Insert eTapestry Letter Widget. The widget screen appears. On the Select tab, select the type of template to add. For entry list and donor loyalty link widgets, use the Options tab to customise the widget. Then click Insert.
To edit an inserted widget, double click the widget. You can also right click the widget and the click Modify eTapestry Letter Widget. After you enter your changes, click Update to apply them.
Tip: To change the text for a Donor Loyalty Link, delete the link from your template and then reinsert the widget.

To edit an inserted widget, double click the widget. You can also right click the widget and the click Modify eTapestry Letter Widget.
Tip: By default, the Entry List includes Date, Fund, Received, and Non-Deductible columns.
-
To a column, click Add Another Column.
-
To include a sum for any currency or number data, from the Options tab, click Show Totals.
-
To change the field for a column, select the name of the column you want to replace. A box appears around the column with an arrow. Select the category for the new field and then select the field name.
-
To rename a column, select the name of the column. A box appears around the column with an arrow, edit the column display name.
-
To reorder columns, use the up and down arrows next to the column name. The columns are displayed starting from the left, and ending on the right.
-
To reformat data, select the name of the column. A box appears around the column with an arrow, select your preferred format.
-
You can use aggregate s to perform calculations on fields that include date, number of currency information. Typically, you aggregate data merge values, instead of columns in the entry list, but the process is similar. For more information, refer to TinyMCE HTML Editor.
-
By default, eTapestry automatically aligns column data. However, you can manually adjust the alignment to be left justified, right justified, or centered.
-
To sort items in an the entry list, based on a single column, select the name of the column. A box appears around the column with an arrow. Select whether the sort should be ascending or descending.
-
To delete a column, select the name of the column and then click X.
After you enter your changes, click Update to apply them.

In Advanced Editor Mode for communication templates, you can also remove formatting, edit HTML source code directly, and preview the results.
-
To remove all formatting, select items and click Remove Formatting.
-
If you prefer to work in HTML code, click Edit HTML Source. You can edit the code directly and paste code created in other programs into the editor. When you paste code, the editor automatically makes some revisions. To prevent automatic revisions, use No Editor Mode instead.
-
To review the content, click Preview. Use the preview to test links and anchors. If you inserted widgets or data merge tags, the preview will not show constituent data yet.

You can use the HTML editor to change the color of text in your template.
-
In guided editor mode, use the Quick Formatting options to adjust the text and background colors. You can also manually adjust the text color. You cannot manually adjust background color.
-
In advanced editor mode, you can manually adjust the text color and background color. You can also directly edit the HTML Source to use the color you want.
To manually edit text color, highlight the text and then click the text color icon. To use the currently selected color, click A. To select a different color click the arrow next to A. Predefined color appear. To select a predefined color, click it.
To select an undefined color, click Custom. Choose a custom color, enter the hexadecimal code for the color you want, or enter RGB values for the color. Click OK. To apply the custom color, select it from the list of custom colors.