Swan Legacy Support

Add Media
The “Add Media” button at top left of the editor allows you to add and edit images, video, audio and other media.  We will be focusing on editing text in this article.  You can learn about uploading and inserting media in the article titled How to Add Images and other Media in WordPress.  In the image below you will also see a button to “Add Form”.  This is a feature added via a premium plugin called Gravity Forms which I use extensively and is very powerful and easy to use.

TWO EDITORS: Visual Editor & Text Editor

There are two content editor modes, the “Visual” editor and the “Text” editor.  You can select which editor you want to use using the buttons at top right of the content editor.  The image below shows the Visual editor.  

 

The Visual Editor.

The Visual editor will display your text and images in relationship to each other, similar to how they will appear on your website.  I say similar because, according to the unique design of your website, the font-size, color, spacing, etc. will likely look different on your website than it will in the editor.  What you will see in the editor is the text, images, video, and other media in relationship to each (above, below, next to, indented, …) as you have specified. The coding of your website will then modify this according to your unique design, but will generally adhere to the standard formatting rules applied within the text editor, (for example if you bold some text, it will show in bold in the text editor, but your website may be coded to indicate a bold state by also enlarging the size of the font or giving it a more prominent color).  You will get to know the unique styling of your website as you work with it.  See below for more details on using the Visual Editor.

The Text Editor.

The Text editor will display your text along with the code, mostly HTML code.  If you only enter text, then the Text editor will only show text.  If you add an image, then instead of seeing the actual image, you will see some code that will specify where the image is located, how it is to be displayed, and so on.  Code is very specific.  If you do not understand it or do not have specific instructions on how to edit it, then you are better off not using the Text editor.

TIP – If you want to Copy and Paste into WordPress

Often times it is convenient to type your content in another program like Microsoft Word, off-line, and then copy and paste your finished version into your WordPress program.  Unknown to beginners (and why would you know), when you copy and paste text or other content from Microsoft Word (most commonly used) and some other text editing programs, you will end up pasting code along with your content.  Although you cannot see it when you copy text from Word, it is there, and it will end up in your post or page.  You will want to be careful with this as that extra code may not act the way you want and may cause problems now or later with formatting your content. If you want to do this, below are a few options: Pasting Text Options » You have a few options.

• Type in a plain text editor. One option is to use a plain text editor to type your content on your computer, one that does not add code to your text.  On a PC you can use Notebook (usually the default plain text editor found in your applications folder).  On a Mac, you can use Text Edit, (again, usually the default plain text editor found in your applications folder).
• Convert your text before you copy and paste into WordPress, by first copy and pasting from Word (or whatever program you are using) into a simple text editor such as Notebook or TextEdit, and then copy pasting into WordPress.
• Using the “Paste in Plain Text” button.  You would copy from Word (or other program), then put your cursor in your WordPress Editor where you want the text, and then click on the “Paste as Plain Text” button.  This will open a plain text editor which will strip the code from your text.

You certainly can simply copy and paste from a Word document into your WordPress editor, if your desired result is to retain the formatting from your Word document.  However you may not end up with what you want, and your results may not harmonize with the rest of your website as your website’s design will have a specific look and feel built into it’s automatic styling. Adding Image and Other Media » The best way to add images and other media to your post or page is to use the buttons on your editor for doing so.  You can read about them here:  Add Images, Video, Audio and other Media.

Using The Visual Editor

To enter text in the visual editor, simply place your cursor inside the white box and start typing, just as you would in any word processing program. When you use the return button on your keyboard, a new paragraph starts, just is it would in any other word processing program.  To format text, you would either:

• Highlight the word or phrase you want to format, (i.e. if you wanted to make the text bold or italics), and click the appropriate function button (i.e. B for bold, I for italics); or
• Place your cursor before or in the paragraph you want to format, (i.e. format the paragraph into an unordered list or make it centered aligned) and again, click on the appropriate function button.

Some functions will simply format the text immediately, and others will require additional information, such as if you want to create a “hyper-link”.  For example, to make a phrase link to another webpage, you would highlight the text you want linked, click on the link icon, and enter the URL address of your desired link into the pop-up window. And some buttons will toggle back and forth.  For example, if you format a paragraph into an unordered list (bulleted list), then when you use the return key on your keyboard, you will automatically be prompted to enter the next item in the list.  When you are done entering your list items, you would click on the same “unordered list” button to return back to the default paragraph formatting.  This is important as some people miss this and don’t understand how to exit one of these functions.  If you are entering or editing styled text that is an ordered or unordered list, or blockquote, or indented, or other similarly formatted text, and you are done with that formatting, or want to change it back, use the same formatting button to return to editing without that formatting – it toggles back and forth.

The Toolbars

The Visual editor provides two rows of functions, or “toolbars”.  The top toolbar provides the most common editing functions along with a toggle to display or hide the second or lower toolbar (called the “kitchen sink”).  Below is a quick reference guide to both toolbars.  You don’t have to memorize them.  Passing your cursor over any icon when viewing them in your admin panel will display its name. You can learn more about the functions of each of these tools in this article on Formatting Text Content in WordPress.  Although the article was created for an older version of WordPress, the formatting controls are the same and the information is clearly presented.

Editing Tips

1. Single Spacing – When you use the carriage return (Return or Enter key), generally the formatting of your website will create spacing to exist between your paragraphs.  But what if you want to have several rows of text under each other without the spacing, such as with an address.  In order to drop down a line without starting a new paragraph, you would use the following keys together: Shift + Enter (or Return).  So you would hold down the Shift key on your keyboard and hit the Enter button ( or Return button).
2. Advanced Editor – WordPress comes with a good base of content editing tools built in, but if you want to expand that, you can install and customize your admin panel with the TinyMCE Advanced plugin. (On the left side of your admin panel at the main navigation bar, there is an option for “Plugins” where you can add them.  Once this plugin is installed, you would then look under the “Settings” tab for a link to a page to customize it for you.)
3. Use the Indent Tool.  It is a great tool for formatting by separating out sections of content with ease.
4. Nested Bullet Lists – If you want to create a nested bullet list, such as an outline with 1, 2, 3.1, 3.2, 3.3, 4, 5, etc.  You would first
   1. create your bullet list (see buttons above for ordered list and unordered list – place cursor where you want it, and click the corresponding button);
   2. then to create your next level, use the “Indent” button (see buttons above) to create your next level (from 1, 2, 3 to 1, 2, 3.1);
   3. when you are ready to move back out to your top level (ie, from 1, 2, 3.1, 3.2 to 4), hit your Return (or Enter) key twice;
   4. and when you are done with your list, you can again hit your return key twice.

Save Draft, Preview or Publish

SAVE YOUR CHANGES.

Although your WordPress program will automatically save your work on a regular basis, and you will be offered the option to use that version if you like (top of the edit screen for any individual post or page), it is best to use the Save Draft or Publish button once your are done with your edits. You will also always have the option to revert back to a previously saved version by choosing one of the saved versions listed at the very bottom of your Edit Post or Edit Page admin screen.

 

Publish Options

Once you are done editing your post or page, if you have not already “published” it, then you will have the option to save it or publish it. (If you have already published your post or page, then the “Save Drat” option is no longer available.) The following options are displayed at the top right of your screen, if you have not yet hit the “Publish” button. (See below for changes once you have clicked on the “Publish” button.)

• Save Draft – Once you create a post or page, it will not automatically display on your website, until you use the Publish button for that specific post or page.  If you want to simply save your work, either for continued editing or to publish on a later date, then you can use the Save Draft button.  This will save your work.  You will be able to access this post or page at any time just as you would a published post or page.  In the admin screen that displays your current posts or pages, the word Draft will be displayed next to the title of any article that is not yet published.
• Preview – Preview is not a saving option, just an option displayed under the Publish box along with the others.  Preview opens a separate browser window and displays your post or page in the context of your website, so you can see exactly what it will look like once published.  This is useful since, as stated above, what you see in your visual editor is not exactly what you will see on your website, based on the unique design of your website.
• Publish – When you hit the Publish button, your article is “published” to your website.  That is, it will now show up on your website.  Until you use the Publish button, it will still be in a draft mode.
• Move to Trash – You can delete your post or page from this screen using the Move to Trash button.  Moving it to the virtual trash is a new feature to WordPress 2.9 that allows you to recover something if you change your mind after wanting to get rid of it.
• Status, Visibility, Publish immediately – These are further options that allow you to change the status of your article (Draft, Pending Review, Published); specify who can view your article (Publish, Password Protected or Private); and specify a specific date and time to publish your article rather than have it publish immediately once hitting the Publish button.
• Original Article can be found here -- http://designsbytierney.com/2010/01/how-to-add-edit-format-text-in-a-wordpress-post-or-page/