© ezmacwebdesign

The most useful Widget in iWeb is the HTML Snippet. Its used to add raw code to an iWeb page. Unlike code injection, it doesn't actually add the code the page document.

It creates a separate doc which has a name something like "widget0_markup.html" - each one having its own id number.

So the widget is small page within the main page - something similar to an iframe.

Once you understand this it explains the somewhat odd behavior of widgets at times!


Getting an HTML Snippet onto the page is a matter of dragging one from the Media pane or using the "Insert" drop down menu - Widget/HTML Snippet.

Code Snippets

Paste the code into the Snippet window, click the "Apply" button and the object will appear in the Snippet Box which can be dragged into any position on the page and resized with the drag handles if required.

Snippet Box

Drag Handle

The snippet window is rather small so you should create your code in an editor application - Text Edit.app will do.

Remember that - if you are adding HTML -  its an HTML doc in its own right and should be laid out as such...


<!doctype html>

<head>

<meta http-equiv="content-Type" content="text/html; charset=utf-8">

<style type="text/css">Styles Go HERE</style>

</head>

<body>

<element-name>HTML goes here.</element-name>

<script type="text/javascript">Javascript goes here</script>

</body>

</html>


CSS Styles should go in the document <head> and HTML in the <body>. Any javascript should, preferably, go just before the closing </body> tag unless it is required for the function of the page as a whole.