Learn HTML Learn HTML
Home
Using iWebkit

- View This Image Larger

  *I Recommend viewing this larger so you can see the code in depth! After zooming in on the image and viewing everything you need to simply press the back arrow on your phone to go back to exactly where you were in the app.

  I would be surprised if this code made sense to you. That's because I am going to explain it!

  The first four lines are the code for the iWebKit topbar. The first line open ups the topbar class. The second line opens a left navagation button class. The Third line adds the home icon, and a home link. The Fourth line then closes the class.

  The sixth line starts a another new content class for a textbox. The Seventh line starts a title for the text box and on the eigth line it has its text, then closes the graytitle. On line number nine we open a new pageitem class, in this case it is a textbox. Line number Ten opens the class further. Under that on line 11 is where you insert your text and images. In this example I have just an image centered. Lines 12,13, and 14 close the textbox and pageitem.

  Before this code will be themed with iWebKit we need to add some more code.

  View This Image Larger

  Don't want to write all of this code by hand? I don't blame you! You can download all of the code used in this app from here:

  Download Here

  After inserting this code at the top of your document you should get a screen like this:

  Now use your imagination and start creating!

  Things to be careful of:

  - HTML is case sensitive, get your filenames right!
  - Make sure you have the right path to a file!
  - The iWebkit files must be in the same folder as the HTML documents!