Access the iDevice settings. Obviously your screen will differ to mine!

Access the General section of the settings.

Access the Keyboard section of the General Settings.

Scroll down to the very bottom of the Keyboard Settings and you will see at least one shortcut created by default by the system – omw which expands to On My Way!

Click Add New Shortcut…

Enter the phrase to be added and optionally a shortcut to access the phrase with.

Here I have added my e-mail address to the Phrase field (1) and a shortcut of "ema" to the Shortcut field (2).

Click Save to return to the Keyboard Settings.

The new shortcut is displayed in the Keyboard Settings (1)

Your new shortcut can be used in any iOS App.

Here typing the shortcut "ema" in the Notes App displays a post-it note offering the full text of the shortcut phrase (1).

If the shortcut you’ve specified is an actual word or you just don’t want to expand it tap the small cross on the post-it note to dismiss the shortcut suggestion (2).

Tapping return or using any punctuation will automatically expand your new shortcut.

Access the iDevice settings. Obviously your screen will differ to mine!

Access the General section of the settings.

Access the Keyboard section of the General Settings.

Scroll down to the very bottom of the Keyboard Settings and you will see at least one shortcut created by default by the system – omw which expands to On My Way!

Click Add New Shortcut…

Enter the phrase to be added and optionally a shortcut to access the phrase with

Here I have added my e-mail address to the Phrase field (1) and a shortcut of "ema" to the Shortcut field (2).

Click Save to return to the Keyboard Settings.

The new shortcut is displayed in the Keyboard Settings (1)

Your new shortcut can be used in any iOS App.

Here typing the shortcut "ema" in the Notes App displays a post-it note offering the full text of the shortcut phrase (1).

If the shortcut you’ve specified is an actual word or you just don’t want to expand it tap the small cross on the post-it note to dismiss the shortcut suggestion (2).

Tapping return or using any punctuation will automatically expand your new shortcut.

iWeb support various page types so select the type your require. To keep this demo simple I’ve selected the Blank page template.

Double click the HTML Snippet Widget to the required location on the page or double click it.

A HTML Snippet Widget HUD is displayed ready for the code to be pasted into.

Until there is some code in the HTML it is displayed as an icon in your page.

From within iWeb create a new page (1)

You will need some HTML to actually create the table and this needs to be pasted in to the HTML Snippet HUD.

Feel free to use this code sample as a starting point for your own tables:

<style type="text/css">
table {
    width: 500px;
    font-family:  Helvetica;
    font-size:  14px;
    color: #ffffff;
    background-color: #ccc;
    border-spacing:  5px 5px;
    border: 3px solid #ccc;
}

th {
    width: 150px;
    height: 35px;
    color: #0f4eb1;
    background-color:  #ffffff;
    border: 1px solid #ffffff;
}
td {
    color: #0f4eb1;
    font-style: italic;
    text-align: center;
    background-color:  #ffffff;
    border: 1px solid #ffffff;
}
</style>

<table>
<tr>
    <th>Gifts</th>
    <th>Description</th>
    <th>Price</th>
    <th>Buy</th>
</tr>
<tr>
    <th>Hotel</th>
    <td>xxx</td>
    <td>xxx</td>
    <td>Add to Basket</td>
</tr>
<tr>
    <th>Flights</th>
    <td>xxx</td>
    <td>xxx</td>
    <td>Add to Basket</td>
</tr>
<tr>
    <th>Food</th>
    <td>xxx</td>
    <td>xxx</td>
    <td>Add to Basket</td>
</tr>
</table>

Once there is code pasted in the HTML Snippet Widget and you click Apply your table will replace the HTML Widget icon and will be displayed on your page.