Basic HTML for Modules
<a class="Hyperlink" title="Google Web site" target="_blank" href="http://google.com">Google Web site</a>
Here are the parts:
- <a - opening tag
- class="Hyperlink" - This tells the system to use the default hyperlink style on the site styles for the link.
- title="Google Web site" - This is the alt tag for the hyperlink
- target="_blank" - This tells the hyperlink to open in a new window. Leave it out if you want it to open in the same window.
- href="http://www.google.com" - this is the address for the link.
- > - VERY IMPORTANT. Make sure you have this after the address, before the displayed text.
- Google Web site - This is the text that is displayed instead of the address.
- </a> - This part closes the hyperlink.
<a class="Hyperlink" title="Email Homeland Security" href=mailto:email@example.com>Homeland Security</a>
Here are the parts you would use, similar to the hyperlink:
- <a - opening tag
- class="Hyperlink" - This tells the system to use the default style from your site styles
- title="Email Homeland Security" - alt tag for the hyperlink
- href=mailto:abc.civicplus.com - email address you are wanting this to go to
- > - VERY IMPORTANT - Make sure you have this after the address, before the displayed text
- Homeland Security - Text you want to display
- </a> - This part closes the hyperlink
If you want to do a bulleted list in any module follow the following steps and use this code around your list:
Text text text about whatever the module item is talking about
- <ul> <-- this tag opens an unordered (bulleted) list.
- <li>First list item</li> <-- These two tags identify an item that needs a bullet
- <li>Second list item</li>
- </ul> <-- This tag closes the bulleted list
Staff Directory Biographies
When adding a photo AND a bio in the Staff Directory, use this procedure so the text will wrap around the picture.
- Copy and paste <IMG > in the bio box before any text.
- Place the name of the person (or what you want as the alt text) in replacement of alt text
- Put a picture in the normal way (insert image button, etc.), select the image and hit 'insert selected image'.
- Copy the '/image' (image path) from the box below the buttons 'Insert Image' and 'Remove Image'.
- Paste the image path as a replacement for the link.
- Remove the image from the box by hitting the 'Remove Image' button.
- Add the biography after this skeleton code and the text will wrap around the image.