You use the WYSIWYG Editor when you are:

• Creating a header or footer for your registration site,
• Adding text and graphics to a page, or
• Creating a description for an activity.

The end result of your message, or custom page, or activity description might look something like this.

The Editor is a WYSIWYG ("what you see is what you get") editor. You use the tools in the Editor Toolbar to format the text you have entered into the text area.

To see what each of the tools are in the Editor Tool bar, run your mouse over the icons in the tool bar to see short descriptions of the tools. In general, you have the following capabilities:

• Change font face, font size, font style, font color
• Format bulleted and numbered lists
• Change alignment on the page
• Add and format a table
• Add and format a graphic
• Add links to the page
• Paste in text from a Word document or a .txt file (see Hints and Tips)

Adding a Graphic

To add a graphic, start by clicking the Add Graphic icon in the toolbar.

This opens the Image Properties pop-up window, which has three (3) tabs: Image Info; Link; Upload.

On the Image In the Image Info tab, you have a field for the graphic's URL on the server, alternative text to describe the graphic, fields to specify the size and placement of the graphic, and a small preview pane. When you first open the Image Properties window, the fields on this tab will all be blank.  Click on the Upload tab to begin.

• Click the Choose File button and find/select the graphic file on your hard drive then click "Send it to Server" to upload the graphic to the MeetMax server.
• When you see the message that the file has been successfully uploaded, click on the Image Info tab again. Now, the fields on this tab will be filled in. Note, depending on the size of the graphic, it may take a moment or two for the image to paint into the preview pane.
• From here, you can modify the dimensions and placement of the graphic. When you are satisfied, click "OK" to insert the graphic.

If you want to modify the graphic -- change its position/alignment, add spaces around the graphic, change its size, add a border -- you can do that using Image Properties. Position your mouse over the graphic, right mouse click. Scroll down the menu and select 'Image Properties'. This will open the Image Properties pop-up menu and you can make the modifications you need. Note: if you are starting with a particularly large graphic, you may want to use an image editor, like Paint, to resize the graphic before uploading it to the MeetMax server.

 

Adding a Link to another site

To add a link, start by clicking the Link icon in the toolbar.

This opens the Link pop-up window, which has two tabs: Link Info; Target.

For the Link Type - you will typically use URL or Email Address (if you want a link to email someone that opens an email addressed to them).  To choose how the link opens, click the Target tab.

You are often going to use New Window.  If you are linking off to a hotel site, for example, you do not want your attendee to lose their place in the registration process - so be sure to use New Window, this opens a new browser tab for the link.  

Click OK when done with your link.

 

Adding a Table

To add a table, start by clicking the Table icon in the toolbar.

This opens the Table Properties window, which has many parameters.  These act similarly to MS Word or any html editor.

Click OK when done with your table settings.  Once created - you can make changes by putting your cursor in the area of the table you want to change and right mouse clicking to get options to adjust the table, the row or the cell properties.

Designing a Header/Footer

When you create a new event in MeetMax, the default header includes your company name and the event name, location and city. The default header is set up in a table: you can see the outlines of the table in gray around the cells. Using a table helps keep the content in alignment. (The default Footer is blank; you should start by adding a table.)

• Width: You will want to set the width of the table at 100%, this allows the header to expand or shrink depending on the dimensions of the users screen.
• Height: The height of the table should vary with the content you add to it. Keep in mind that you want the header to be prominent on the screen but not take up so much real estate on the screen that the user needs to scroll to get to the forms. Typically 250-350 pixels is a reasonable height.
• Logo Graphics: The best logo graphics are oriented horizontally. There are maximum or minimum dimensions on the size of the logo graphic(s). Keep in mind that screen sizes vary; a good rule of thumb would be to keep the graphic smaller than 1000x300 pixels. You want the file size to be less than 100kb, so that the graphic loads onto the page in a reasonable time.
• Background Color: To add a background color to the Header, you can select a color, or if the color palette does not include the color you want, you can manually enter the hex code for the color. To use the fill tool, use your mouse to highlight the first cell in the table. Right mouse click, choose "Cell" and then "Cell Properties". Click "Select" adjacent to Background Color. The available color palette will be displayed and you can select your color. Or, if you know the hex code for the color, type it into the Background Color field. Select "OK" to save your changes. Continue with the remaining cells.

To switch from the Header to the Footer, use the drop-down at the top of the page "Choose Area" and select Footer.

Working with HTML Source

If you are familiar with HTML and want to add more sophisticated formatting to the content of a page, you can work with the HTML source. To view/edit the source, click on the Source button in the Editor Tool bar. This will switch the view in the Editor window to the source view and you can view/modify the generated HTML code for the message or header you are creating.

Hints and Tips

1. DO NOT copy text and graphics from a Word or word processing document. HTML editors are not compatible with word processors. If you do copy from an existing Word or word processing document, you may find that your formatting is not maintained, is altered, and is difficult to modify successfully using the Editor. You will save yourself time and frustration if you either create the content in the editor window, or copy/paste it from a text file (.txt) that has no formatting.
2. If you want to incorporate both pictures and text, (for example, in a listing of speakers you may want both a headshot and a bio for each speaker) use a table to ensure that the layout is consistent throughout the page.
3. The range of fonts supported by all browsers is not as large as you can find in a word processor. The MeetMax editor includes six (6) fonts (Arial, Comic Sans MS, Courier, Times Roman, Tahoma, and Verdana) which are supported by all browsers. If you want to use a different font, you can modify the HTML source to use a different font.
4. The font size drop-down includes both relative sizes (smaller and larger) and absolute sizes (xx-small, x-small, small, medium, large, x-large, xx-large). For the best, most consistent and predictable results in all browsers, use the absolute size options.
5. If you are using a dollar-sign (\$) in your content, you must include a backslash "\" in front of the dollar-sign. If you forget the backslash, the content will not display.