Quickstart Guide

Although this guide tries to be as basic as possible, a certain knowledge about HTML and/or XML will prove to be very helpful. Please note that all references to files will assume you have extracted the contents of the  folder in the package somewhere, and that this directory you extracted the contents to represents the root directory for your MegaZine project. E.g. you extracted the contents of the  folder to , then that is your root directory, and should contain the   (webpage displaying the book),   (stylesheet for the webpage) and two folders named   (containing additional JavaScript libraries) and   (the actual engine files).

= Setting It Up =

Page Size
If you wish not to use the default page size there are two adjustments to make.

XML
First comes the XML adjustment. Open the file  in the   subfolder. You will see a tag named. To its attributes, add the following: and, and enter the values of the desired page size. An example: say you want your pages to be 300 pixels wide and 200 pixels high, then it would look like this:

And that's it for the XML.

HTML (Deprecated in Version 2.0.?)
Update: This section is deprecated now, as the size is dynamically defined in the CSS, so you most likely don't have to change the sizes in the HTML any more. If you do, make sure to give a fixed size in the CSS class, otherwise the settings in the script section won't have any effect.

Next a little change to the HTML is necessary, to give Flash enough space on the webpage. Open the file  in the root directory. Look for the   Block in the head of the file.

Here you need to change the width (default 750, marked ) and the  height (default 700, marked  ). As a general rule of thumb for minimum sizes, use  and , although the height calculation only works for pages higher than wide. The actual formula for the minimum height, so that pages cannot be cut off at the top or bottom while turning is  i.e. the page diagonale times two minus the page height. But using a value a bit bigger never hurts, as it allows more of the reflection to be seen. Also, if you have a lot of pages, making the movie higher gives more room to the page navigation. Alternatively you can just try some values until it fits.

Although this was a bit on the mathematical end, now you're done with setting up the page size.

Used space
Per default you will find there is some spacing below and above the book when using liquid scaling which is not used. This is to avoid the pages and bars from the navigationbar plugin to overlap if possible. To disable this spacing, have a look at the  file, where you'll find this:

This is the outermost container for the pages, which is also used for scrolling when the page size exceeds the available size (e.g. when zoomed in). The important part is the  attribute. Replace the original values with, which means it'll span all the available space (also see Layouting). So after that it should look like this:


 * Note: for better readability, consider using the file from the SVN repository.

Background Color
If you wish to change the webpage's background, here is how: if you have closed it, open the file  again.

In the same place you changed earlier to adjust the size (see previous section) now change the value #333333 (marked ) to a color of your choice (in HTML/CSS format, meaning the hexadecimal representation with a leading  . See Webcolors). Look for the the  block in the head, and in it for the text   (marked  ). Modify the value right to  to the same value.

Alternatively you can use a background image. In that case remove the two slashes at the line marked   and in the CSS section write    next to  instead of a color value. And that's that.

= Creating the Pages =

Creating the Page Elements
After all the basic obstacles have been cleared, you are now ready to create your pages. For this purpose, open the file  in the   subdirectory.

To start with, copy the  block until there is one   element for every page you want. Please note that a  element represents a page side, not a real page / physical page. A real page is made up from two  elements. This also means there has to be an even number of pages. In fact, there has to be an even number of pages in each. If there is not, a blank one will be automatically inserted as the very last page.

Setting Page Properties
There are some very basic settings you should know about: the,   and   attributes for pages.   Lets you set an individual page background color. This is only relevant if any part of the actual page shows, though. This does not have to be a hexadecimal value, but it is recommended for readability sake. Unlike the webpage background color a hexadecimal value has to be prefixed with  instead of the   character.  This controls the visibility of the "folding effect" for the page. Folding effects are the shadow and highlight in the middle of the book, creating the visual effect of the pages to bulge (making them appear more three dimensional). Although you can normally leave this setting untouched, you might wish to disable the effect for double pages displaying one big image.  Tells the page, if set to true, that it is a stiff page, such as the cover of a hardcover. Although it can be used anywhere in the book, it is recommended to use this only for the first and last page. It is sufficient to supply this argument only for one  element of one "physical" page. 

A page with some attributes set would look like this: and would produce a stiff, red page. Also, no folding effects will be used, because stiff pages never use them.

Another example: would produce a blue page, without folding effects.

Enabling plugins
In version 2.0 you have to list the plugins you plan to use in the book element. Otherwise the respective features will not be available. The available plugins can be found in the shipped modules under ../megazine/plugins/. The names of the .swf files are the same that should go into the plugin list. Here is an example with most of the available plugins enabled:

Inserting Page Content
Let's go with the easiest case, and assume you have an image of every page, you just want the images to be displayed as pages in the MegaZine. Create an  element in every page, referencing to the image to display. The syntax for this is: Do this for every page, until your XML looks something like this:

In this case the images are in the folder, with the names as seen above. This is very synonymous to using the  element in HTML.

That is all of the basics, enough to create a simple book. For more features see the elements category, which holds a basic listing of all elements and their attributes.

Lastly, you might want to validate your, to avoid typos and other syntactical errors. A nice validator can be found here.

=Further Configuration=


 * Check if the specific change you want is in the FAQ
 * To change additional options in the book, explore the settings available to the Book element.
 * The change the GUI, modify ASUL files.
 * For more information on Zoom, explore Adaptive Zoom and Liquid Scaling.