TutorialsWeb DesignWidgets

Add tables to your iWeb site

Tables used to be everywhere in web design before some bright spark invented CSS. They were used to build a site and get everything looking as it should, in the right places. Nowadays they are less frequently used in the building of a site because of the problems browsers have with displaying layouts consistently, however if you want to display tabulated style data a well built table can work wonders.

Adding a table to your iWeb site can be a difficult or simple affair. Before you do though you need to spend a bit of time planning how you want your table to look. How many columns, how many rows, what background color to use, which font to pick and how big it should be; the list is almost endless. You can now spend hours pondering over HTML using a HTML editor; or you could point your browser over to iWeb Toolkit’s Table Generator.

table_generator_iweb

Once there you simply enter the information into the on-lin form and press the ‘Generate’ button.

This will generate a pop-up window with an example of your table and, underneath it all of the necessary HTML code.

table_code_generated

You will note that all of the table cells have been filled by the words ‘Cell Contents’. If you scroll down on the HTML you will see these words repeated again. Obviously this text you can replace with your own text, but not just yet.

If you are happy with the design of your table select all of the code and copy it. Open iWeb and create the page that you want the table to appear on. Select HTML Snippet and when the transparent black window pops up paste in the HTML code. Now is the time to edit the ‘Cell Contents’ text as required.

insert_html_code_iweb

Once done, click ‘Apply’ and your table is inserted.

All you have to do now is publish as normal.

Do you use tables in your iWeb site? Why not leave a link in a comment.

You may also like

11 Comments

  1. Great Post As always but i have no use for a table on my site 🙂

  2. […] Read the original: Insert Tables into iWeb | All About iWeb […]

  3. Thanks for your amazing detail and hard work on this program. I “was” a DreamWeaver fan until iWeb – and now won’t go back. Tables – which are the perfect match sometimes – defeats me in iWeb – even with the HTML snippet. Going to explore more …

  4. i love iweb it is easy and intuitive, and i love this blog it is very helpful.

  5. Thanks for this. Is there any way to edit the cell contents in the table itself? Doing so in the HTML code is unwieldy — it’s hard to know which cell I”m editing until I press “Apply.”

  6. Unfortunately, changing the cell, text or background colour seems to accomplish nothing.

  7. Great Blog! Really appreciate it!
    I love iweb, really helping my business!

  8. I used Dreamweaver prior to iWeb so now I create my table in Dreamweaver, copy the code and paste it into the HTML snippet. This way I can edit the table to my heart’s content before inserting it into my iWeb page. Basically the same as you suggest but easier on the editing.

  9. I know that I’m two years late to the party here, but the link to iWeb Toolkit’s Table Generator takes me to a blank page. Your explanation seemed great, and a simple table is all that I need for my site. Looking forward to hearing whether there’s a different route to building a table. Thanks!

  10. Thanks for this advice. It is just what I needed. Like Debbie, I use other software to create the table, then copy the HTML code into the iWeb HTML Snippet. In my case, I have found that the Google Sites software does the trick, and it has the big advantage of being free.

  11. I’ve been doing the old HTML, copy paste route so far, but now I’ve found this I’ll have to give it a shot.

Leave a Reply to Ultan Cancel reply

Your email address will not be published. Required fields are marked *

More in Tutorials