Salsa uses a WYSIWYG (What You See Is What You Get) editor for pages that contain HTML called 'fck' editor, and it appears in a number of locations in the Salsa interface.
While we've included several examples here to get you started using the new editor, for a more complete writeup on fck, head over to their own site: http://www.fckeditor.net/. To go directly to their documentation wiki, click here: User's Guide.
Any time you're composing for the online environment -- either the HTML portion of an e-mail blast or a user-facing action form -- you're ultimately composing in HTML. You don't need to know HTML to use Salsa, and the WYSIWYG is one tool to help you interact with your headquarters free of the raw code ... but ultimately, the WYSIWYG is an intermediary layer whose purpose is to take your inputs and render HTML. Inevitably, it may do that less than perfectly in some cases.
In general, for maximizing your options both inside and outside of Salsa, anyone whose work entails a significant portion of online communications will be well-served to acquire at least a basic familiarity with HTML.
To enter text into the fck editor, simply click anywhere inside the text box and begin typing. The editor will take your input, and create HTML based on it which can then be inserted into the email or webpage you're creating.The fck editor has two different entry modes. Above, you'll see the editor with its menu closed. Simply click once on the down arrow in the top left corner to open the menu. Once you've entered some text, you can style it using the various buttons in the fck menu. While some should be familiar from word processors (the bold, italic, and underline features, for instance), it may be helpful to review fck's full array of button documentation here: http://wiki.fckeditor.net/UsersGuide. Please note that not all of fck's options may be present when you use it in the Salsa interface.
It's likely that the most used feature of the fck editor will be adding links to your emails and webpages, and doing so is simple. The first step is to enter the text that you want to be the clickable portion of the link:
Once you have the text you want to be clickable, simply select that text using your mouse, and click the link button (the icon that looks like a chain. A dialog box will open, and you can input the URL that you want your link to go to:
Then, simply click the "Ok" button in that dialog, to close the dialog and create your link. Your link should now appear inside the editor, though it won't be clickable until you view it inside the email or page you're creating. If you click the other tabs in the dialog, you'll be able to add further options to your link, such as having it open in a new window.
To add an image that should appear inside the content section of the page or email you're creating (as distinct from the templated portion of the page), you can use the Insert/Edit Image button:
Once you've clicked the image insertion button, a dialog will appear that allows you to choose an image. If you've already uploaded an image, click the "Browse Server" button.
Clicking the "Browse Server" button will open a second dialog, in which you can choose an image from your uploaded images. You can click the image name you want to select in this dialog, which will close the server browsing dialog, and select the appropriate image. Once the server browsing dialog is closed, your selected image will appear in the Image Properties dialog. Clicking the "Ok" button in the Image Properties dialog will insert your image, which should appear where the cursor was located when the image insertion button was clicked:
To insert a line break, hold Shift and press Enter. Note: Just pressing Enter puts in a paragraph, so be sure to hold Shift.
Sometimes it's necessary to manually work with HTML, to get just the effect you want, or to paste in HTML you've written or generated elsewhere. The fck editor has a simple interface for doing so-- simply click the "Source" button in the top left corner of the menu. Once the source button has been clicked, the HTML you've created will be shown, and all the other buttons in the fck menu bar will be greyed out. To return to graphical editing mode, simply click the "Source" button again.
Many people prefer to compose HTML offline and bring the finished product to Salsa. This is just fine in an application (such as Dreamweaver) designed to compose HTML.
However, composing in Word - or any Microsoft application - is fraught with difficulties. Intuitively, you'd like to simply copy and paste a Word composition into the WYSIWYG. Unfortunately, Microsoft generates extraordinarily ugly code, which it further lards with proprietary codes that Word understands but most of the web doesn't.
If you can possibly avoid it, we strongly recommend not designing for the web in Microsoft Word. If you absolutely must do so, do not paste directly from Word into Salsa, but use one of two intermediate steps to minimize the problematic code:
1. Paste first into a plain-text editor, such as Notepad. This should strip all non-standard Microsoft codes; unfortunately, it will also strip formatting such as header lines or hyperlinks.
2. Click the "paste from Word" button on the WYSIWYG rather than pasting directly into the WYSIWYG. Although not as good as laundering through a plain text editor, this should also preserve your formatting while removing many offending Microsoft tags.