I am a huge fan of iWeb. Despite being versed in HTML, I find that iWeb is an easy, aesthetically pleasing way to create and maintain an active site without being a techno-whiz. However, despite improved features and functionality with each new release, iWeb still has its imperfections and I ran into one of them last week.
I was creating a new page for my website—a FAQ on Pregnancy Massage—and I wanted to use anchors. Anchors allow links to be made from one area of a page to another. For example, with many online FAQs, the standard format is to have a list of questions at the top of the page and each question is a link to the full answer located further down the page. This is a relatively simple function that is built into most remedial website deign applications. I was sure iWeb must support it as well!
After searching through the help menu and getting no results, I turned to the Apple Discussions board. It was there that I learned that not only does iWeb not support anchors, but people have been complaining about this lost feature since the first edition of iWeb.
I ran across several workarounds but most seemed very cumbersome. Most suggestions involved exporting the site to a local folder and then editing the raw HTML or using a third party program that edited the HTML for the user. While that’s a valid workaround, it defeated my use of the program which is to make quick edits and be able to publish them directly from iWeb on the fly.
I finally found a solution that was not only simple, but it could be done right from within iWeb. This is how I did it:
- First write up your FAQ page so the layout is the way you want it. Then, publish it as-is (without links).
- Go to your new page and record the URL. For this example let’s say your URL is ‘http://web.mac.com/smalldog/FAQ.html’
- Go back into iWeb, select your first FAQ question, enable it as a hyperlink and use the URL ‘http://web.mac.com/smalldog/FAQ.html#widget1’.
- Enable your next FAQ question as a hyperlink using the URL ‘http://web.mac.com/smalldog/FAQ.html#widget2’. Continue in this manner to create hyperlinks for each FAQ.
- Now, create an HTML widget for each FAQ answer (Insert -> Widget -> HTML Snippet) and drag it so that it’s next to the answer. The trick here is that you need to be sure to create the widgets in order. For example, make sure the first widget you create on the page goes with your first FAQ question. iWeb is smart in the sense that it knows the order that the widgets were created, so if you start creating widgets and don’t keep track of which number the are, you can end up with links that take you to the wrong answers. You need to put something benign in the HTML Widget, I used <a name=“anchor”></a> This will make the widget invisible on the page without making it clickable. Once your widgets are in place go ahead and publish!
You should be left with a nice, neat page where each FAQ question links to the appropriate FAQ answer. We know that what is really going on is that each FAQ question links to a hidden corresponding widget, but the people surfing your site never need to know that!
I really love this solution because it’s easy enough for any average user and the page can continue to be edited in the future without the need to use a messy third-party work around. I hope you find fun ways to use this on your website!