Welcome NeighborMedia People

Select Filtered HTML from Input Format (under Body Box):

In Body Box (often called "Sandbox") type your blog text. To add formatting to your blog, use the examples below.

Formatting

To have it look like this... Type this...
Your text here (Italics)
Your text here (bold)
Your text here (blue text)
Your text here (brown text)
Your text here (gray text)
Your text here (green text)
Your text here (orange text)
Your text here (purple text)
Your text here (red text)

This is header 1

This is header 2

This is header 3

This is header 4

This is header 5
This is header 6
 <em>Your text here</em>
<strong>Your text here</strong>
<span style="color: blue;">Your text here</span>
<span style="color: brown;">Your text here</span>
<span style="color: cyan;">Your text here</span>
<span style="color: gray;">Your text here</span>
<span style="color: green;">Your text here</span>
<span style="color: orange;">Your text here</span>
<span style="color: purple;">Your text here</span>
<span style="color: red;">Your text here</span>
<span style="color: yellow;">Your text here</span>
<h1>This is header 1</h1>
<h2>This is header 2</h2>
<h3>This is header 3</h3>
<h4>This is header 4</h4>
<h5>This is header 5</h5>
See many more color names at http://www.w3schools.com/html/html_colornames.asp

Bulleted List

To create a bulleted list, a <ul> begins the list and a </ul> closes the list. Each item in the list needs to have a <li> before the item and a </li> after the item. See the example below:
To have it look like this... Type this...
  • First item
  • Second item
 <ul> <li>First item</li> <li>Second item</li> </ul>

Numbered List (very similar)

To create a numbered list, a <ol> begins the list and a </ol> closes the list. Each item in the list needs to have a <li> before the item and a </li> after the item. See the example below:
To have it look like this... Type this...
  1. First item
  2. Second item
 <ol> <li>First item</li> <li>Second item</li> </ol>

Linking to another URL

To have it look like this... Type this...
The Gnomes’ blog <a href="http://www.freerangegnomes.blogspot.com">The Gnomes’ blog</a>
The part after href= that is in double quotations will be the URL for your link. The part after the > and before the close </a> will be the text that is highlighted for the user to click on.

Combining Things

To have your header look like this... Type this...

A red header

 <h2><span style="color: red;">A red header</span></h2>
To have your header look like this... Type this...

Italicized red header

 <h2><span style="color: red;">Italicized <em>red</em> header</span></h2>
To have your text look like this... Type this...
Bold green text <span style="color: green;"><strong>Bold green text</strong></span>

Adding Additional Photos

This will work best if you upload the photos you want in the body of your blog first, and upload the one you want to open with last.
  1. Upload your first photo via Drupal Edit interface (don’t start with the first photo you want to open your blog with).
  2. After you have published your blog, go back to your blog and view in Edit mode.
  3. In the brower's pulldown menu, under "view" go to "source" (called "page source" in Firefox and "View Source" in Safari).
  4. Find the link for the photo you most recently uploaded to your blog. The easiest way to do this is to search for the first few words of your blog. The link will immediatley precede the first words of your blog and it will look something like this:
    <a href="/City+Hall+Annex"><img src="http://www.cctvcambridge.org/files/images/annex front.small.thumbnail.jpg" alt="Annex" title="Annex" class="image image-thumbnail " width="200" height="150" /></a>
  5. Copy the link into the sandbox where you want your photo to appear.
  6. If you want your photo to be on the RIGHT (just for variety), make this change to the link:
    <a href="/City+Hall+Annex"><img src="http://www.cctvcambridge.org/files/images/annex front.small.thumbnail.jpg" alt="Annex" style="float: right; margin-left: 5px;" title="Annex" class="image image-thumbnail " width="200" height="150" /></a>