iLife Tutorial: Link to external sites from the navigation menu in iWeb

iWeb is designed to help you create great looking sites in next to no time. There are, however, many compromises along the way and it can be hard, or even impossible to attempt to replicate some of the designs you may have seen elsewhere on the web… Sometimes, however, those limitations can be hard to live with.

Take for instance the navigation menu, which is automatically located at the top of each of your pages. You can of course choose to remove it completely or only select specific pages to appear there, but no matter what you do, the only pages you can link to in the navigation menu are pages that belong to the site you’re working on. There is no way for you to link to an external page… unless you use a little trick. This is what we’re going to be showing you in this tutorial.

1: A new page
Select a site to work with from the sidebar (clicking on one of its pages works just as well) and create a new page by going to File>New Page.

2: A blank theme
You’ll be asked to choose a theme. Since we don’t want to waste time rendering images that will never be seen, make sure you choose White>Blank.

3: No navigation
You needn’t display the navigation menu, so reveal Inspector (View>Show Inspector), select the Page tab, ensuring ‘Display Navigation Menu’ isn’t ticked.

4: The Widgets tab
If the Media tab isn’t visible, go to View>Show Media. Next, click on the Widgets tab (top right) to have access to a few handy coding shortcuts.

5: Adding a Snippet
You’ll be needing the last one: HTML Snippet. Drop it anywhere on your page. A floating window will appear, ready for you to type in some code.

6: Manual coding
Type the following exactly: <script type=”text/ javascript”> parent.location.replace(‘http://[the address you want to link to]’); </script>.

7: The Link Inspector
You don’t need to publish your page in order to see the results of this code; with the Inspector window still open, select the Link tab.

8: Activate Hyperlinks
Bottom of that window is a tick box deselected by default: ‘Make hyperlinks active’. Click on it to activate it. Any link you click on will now work.

9: Trying it out
Select another of your site’s pages then click on the link you created in the navigation menu. Your browser will launch and send you to this address.

Click image to enlarge.