Blog badge

On the create badge page the customization options have been limited to keep the process of creating a badge as simple as possible, but there are in fact a number of hidden options that can be triggered by doing simple modifications to the badge script code before pasting it into your blog.

This is how the typical script code looks like that is generated on the create badge page (when you press the "Get code" button):

<script type="text/javascript" charset="utf-8">
_ja_badge_header = "My albums";
_ja_badge_look = 1;
</script>
<script src="https://jalbum.net/badge/load.js?u=dor&v=1" type="text/javascript" charset="utf-8"></script>

As you can see the code consists of two script tag elements. Within the first element a list of variable names and values are defined. In the original code only two variables are defined _ja_badge_header and _ja_badge_look, but there are many more to add. For a complete list of the available variables see the Variables section below.

The second element calls the actual badge script. In the original code two given parameters are added to the call, u and v. There are more parameters to add as well, for a complete list see the Parameters section below.


Variables

General variables
Name Description
_ja_badge_width Set the width of the badge. Can be any positive numeric value. The default value is 220.
_ja_badge_header Set the header of the badge. Can be any text string. The default value is "My albums".
_ja_badge_look Set the general look of the badge. Can be a value between 1 and 6. The default value is 1 (white look).
_ja_badge_ext_look Replace the current look with an external CSS file. This needs to be an absolute path to a CSS file (e.g. _ja_badge_ext_look = "http://www.example.com/my_look.css"; ). |-

You can find an example CSS filehere. This is the most dynamical way to customize the look of the badge.
_ja_badge_corners Decide what which corner style to use. Can be 1 for round corners, or 0 for square corners. Default value is 1.
_ja_badge_simple_footer_lnks Replace the "What's this?" footer link with a simple "jalbum.net" link. Can be 1 ("jalbum.net" link) or 0 ("What's this?" link"). Default value is 0.
_ja_badge_show_desc Display album descriptions under album names. Can be 1 (on) or 0 (off). Default value is 0.
_ja_badge_new_window Open album links in new window/tab. Can be 1 (on) or 0 (off). Default value is 1.

Here's an example that shows how to use the general variables:

<script type="text/javascript">
_ja_badge_heading = "Dor's albums";
_ja_badge_width = 200;
_ja_badge_look = 2;
_ja_badge_corners = 0;
_ja_badge_simple_footer_lnks = 1;
_ja_badge_show_desc = 1;
_ja_badge_new_window = 0;
</script>
<script src="https://jalbum.net/badge/load.js?u=dor&v=1" type="text/javascript" charset="utf-8"></script>

In addition to the general variables listed above there's also a set of variables that can be used to tweak individual colors of the badge (without the use of an external CSS). The color variables can all be set to a color name (red), a RGB value (rgb(255,0,0)), or a hex number (#FF0000).

Color variables
Name Description
_ja_badge_bg_color Album list background color.
_ja_badge_txt_color General text color (used in header and footer text).
_ja_badge_h_bg_color Header and footer background color.
_ja_badge_m_over_color Mouseover background color of album list.
_ja_badge_lnk_color Link color (used in footer links).
_ja_badge_a_name_color Album name color.
_ja_badge_a_desc_color Album description.
_ja_badge_b_color Border color.

Here's an example that shows how to use the color variables:

<script type="text/javascript">
_ja_badge_heading = "Dor's albums";
_ja_badge_width = 200;
_ja_badge_bg_color = "green";
_ja_badge_txt_color = "yellow";
_ja_badge_h_bg_color = "red";
_ja_badge_m_over_color = "blue";
_ja_badge_lnk_color = "#ffffff";
_ja_badge_b_color = "rgb(255,255,255)";
_ja_badge_a_name_color = "cyan";
</script>
<script src="https://jalbum.net/badge/load.js?u=dor&v=1" type="text/javascript" charset="utf-8"></script>


Parameters

Parameters
Name Description
u Should be set to your jalbum.net username if you wish to list your albums or albums that you have favored.
f Show your favorite albums instead of your own. Can be 0 ("no") or 1 ("yes"). Default value is 0. Must be used together with u parameter.
c Maximum number of albums to display. Can be any positive numeric value. Default value is 5.
m Instead of displaying your own albums this parameter can be used to display "Featured" or "Most popular" albums on jalbum.net. This parameter can be set to 1 ("Featured") or 2 ("Most popular") and can not be used together with uparameter.
t Used to set thumbnail size. Can be a number between 1 (45x45 px) and 5 (180x180 px). Default value is 2 (60x60 px).
v Used as an internal version tracking parameter. Current value should be 1.

Here's an example that shows how to use the different parameters:

<script type="text/javascript">
_ja_badge_heading = "Really cool photos";
_ja_badge_look = 3;
_ja_badge_width = 200;
</script>
<script src="https://jalbum.net/badge/load.js?m=1&c=10&t=3&v=1" type="text/javascript" charset="utf-8"></script>


Need more help?

If you have any questions about the badge in general or about the customization options you can post them in the forum.