HTML Export with Overlib

There are various ways that Overlib can be customized. In GMAO's "HTML Export" options tab, there are many options that have to do with Overlib. I'll explain them here.

HTML Export Style

A choice of "Overlib" or "Custom Javascript". I wrote the custom javascript one, and it is terrible. Pick "Overlib". You'll be glad you did. It really isn't even a choice at this point.

Overlib location

The location that the overlib javascript program is at. I usually have it set to "http://mangatranslation.com/overlib.js", however, if you are using overlib, you should point this to your own install. Also, if you are creating javascript pop-up pages for distribution as files, you can just drop the overlib.js in the same folder as all the files, and use "overlib.js".

Overlib Options

Sticky Popups will have the overlib popups stick around until the user clicks a little "go away" link on them. This is the only option I have added with a GUI interface to use. There are other ways to customize Overlib that are a bit less user-friendly, but this one is here anyway.

Advanced Overlib Settings

This section lets you add custom initialization code to the Overlib setup. This is where you would, for example, load up an overlib extension, or set other global options. Note that this is for advanced users only: this is JavaScript code that is inserted at the top of the page. You'll have to know what you are doing, and how to use Overlib to make this work properly, and if you have any JavaScript parsing errors, you'll cause problems on the page. For example, to use the Adaptive Width plugin, I would set this to the value

<script type="text/javascript" src="overlib_adaptive_width.js"></script>

which would load up the overlib adaptive width plugin. Of course, the plugin has to exist at that location, and so on.

Overlib Call Options

This is another advanced setting that lets you add parameters to each overlib call. So, to continue the example of using the adaptive width plugin, I would add

ADAPTIVE_WIDTH,

which would say to add the "ADAPTIVE_WIDTH" parameter to each call. Notice that you must have the comma and space after the text, since it is being added to the start of a parameter list. It would also be possible to exclude this entirely, and set up in the Advanced Overlib Settings the ol_adaptive_width variable, but I'm trying to demonstrate how to use these options here.

Overlib Template

This template controls how your pop-up actually looks. The default,

(<small>%AUTHOR%</small>) %TEXT%<br>

means that the text for each bubble will have the Author in a small font, and then the rest of the translation text. The variable %AUTHOR% will be replaced by the text of the author. %TEXT% will be replaced by the actual translation text, and %LANGUAGE% will be replaced by the actual langauge of the translation. %LANGUAGE% is left out of the default template. The default value should work fine for you, but feel free to experiment.

Translation separator

The %TEXT% variable is actually made up of each translation. The values are substituted as above, and in between each translation, we place this value. The default value of <br> should work fine, but feel free to put in whatever you want here.

Overlib fgcolor

The foreground color for the overlib pop-up.

Overlib bgcolor

The background color for the overlib pop-up.

Overlib text color

The text color for the overlib pop-up.

Overlib caption text color

The text color for the overlib caption.