HTML Module: The most widely used module on the websites. This module is very flexible and is used for inserting text, images, tables, hyperlinks, document downloads, and HTML code. Hover the cursor over the Modules menu option in the left-hand corner. Add the HTML module to the page. To change title of module, click on settings Click Edit Content Two Views Available: Basic Text Box, allows text and Html code Rich Text Editor, is the default view and the most used view on the web pages. Html code can also be added. Summis: Options
Rich Text Editor Spellchecker Find & Replace Undo, Redo New Paragraph Hyperlink Mgr. Full Screen Insert Date Insert Time *Insert Media Icon can look different. Nunc cursus magna quis Formatting Bar Paste Options Insert Media Insert Symbol Insert Table Pasting Text There are six different paste options and the following table explains these different options: Paste Paste from Word Paste from Word strip font Paste Plain Text Paste as HTML Paste HTML Pastes copied content from the clipboard into the editor. Pastes copied content from Word into the editor, cleaning all unnecessary Microsoft Office related tags. Pastes copied content from Word into the editor, cleaning all unnecessary Microsoft Office related tags plus font formatting. Pastes copied content from the clipboard (can be from any program) into the editor, removing all HTML formatting. It pastes plain text, preserving line breaks. Pastes copied content from the clipboard into the editor, and pastes as code, which is convenient for developer-oriented applications. Use this option to paste actual HTML code into Text Editor. 2
Adding Images To use an image, it has to be uploaded to the site. Click the Insert Media icon Click Insert Media Select folder Click Upload Click Select Browse Computer to find resized image Able to add more than one image at a time to the file After all images are selected click Upload Click Properties under image if a border or sizing is needed. Otherwise click Insert 3
Connect the chain between Width & Height for correct proportions Click Image Alignment to wrap the text. Optional add border color, width, Alt text, and Long Description. Click Insert To return to the image editor right click on the image while in the edit mode of the HTML module. Making an Image or Text an Active Link (Hyperlink) Highlight the image or text in the Rich Text Editor Click the Hyperlink icon To link to another page within the site, in the Page box select the page you want to link to from the drop-down list. To link to an external URL, in the URL box, enter the full address of the website to link to. Click OK Inserting an email link Select the text, or image, to be set as the email link Click the Hyperlink Manager icon Select the E-Mail tab In the address box type in the valid e-mail address Optional subject box Click OK 4
Adding Documents To use a document, it has to be uploaded to the site. HTML module allows links to documents by text, images, or by creating a link from the filename of the document. In the Rich Text Editor, position the cursor where you want to insert the document, or select the text or image for the link source. (Note: if you do not select anything, the filename will be displayed as the link source.) Click the Insert Media either icon Click Document Manager from the first icon only. The second icon will automatically open the Document Manager. If the document has already been loaded, double click the folder that contains the document. Click on the document To upload the document to the website, double click the folder where it is to be saved. Click Upload in the toolbar. Click Select to browse for the file. You can select multiple files by clicking another Select button. Click Overwrite if this is replacing a file. Click Upload To display the document in a new window, in the Target Box select New Window Apply a brief description to be viewed when users hover over the link. Tooltip box, type a description Click Insert 5
Adding Tables Tables in the HTML module function much the same way as tables in word processing software. Tables are useful for creating columns of text, and aligning text with images. In the Rich Text Editor, position the cursor where you want to insert the table. Click the Insert Table icon Click Table Wizard The Table Wizard box appears and you can set table properties, and adjust the number of columns and rows from the Table Design tab. To add or remove columns and rows, click on the plus or minus signs next to Columns or Rows Click OK to insert the table. Table cells will at first appear condensed. The width of cells adjusts automatically as you add data. You can customize the table further using the other tabs in the Table Wizard. You can adjust the table and cell properties, and change accessibility settings. To customize table properties after adding the table click anywhere inside the table and right click. 6
7 The HTML Table Properties allow you to adjust the height and width, add borders and shading, set cell spacing and padding, set text alignment within cells, and set other properties.