Top 10 album headaches

Albums today are complex piece of code. Starting with images and videos coming from various sources, processed through jAlbum and skins authored by many developers, the albums uploaded to very different servers, utilize tons of 3rd party services over the internet, and viewed on a multitude of device types, be it a mobile a tablet or a desktop PC. And all this in a constatnly moving environment, where browsers change, OS’s change and remote services change day-by-day. No wonder the final result is flawed sometimes, or it gets flawed over time. But we are here to help. We – jAlbum developers – all do customer support, so we’re all aware of the classic pitfalls. If jAlbum had less settings, less things could go wrong, but jAlbum is a power tool. Here are some advices so you avoid cutting yourself while using it.

1. Processing subdirectories

Generally you should always allow jAlbum to Process subdirectories. Previously, there was a quirky method of creating so-called “master albums” (album of albums) where turning this option off stopped jAlbum from processing these (already made) albums again. Fortunately, since jAlbum 14 we have introduced the “Web locations”, which makes this task much simpler, so today there’s no real use of this option – it’s there for backwards compatibility.

The other one, Process only updated directories was also useful in the old times, when the subdirectories could work independently of each other or the common resurces from the top level’s “res” folder. Today the folders of the albums are much more interconnected, they always rely on the common resources (like the Javascript or CSS files), so once you update the album with this setting ON, those subfolders where nothing has changed might get broken. The tricky thing is they usually don’t get broken instantly. They usually show signs of malfunction only after a skin update, and by that time users usually don’t remember they’ve changed this setting. (Although a skin change renders these orphaned folders instantly unusable.)

Those skins rely on a database (JSON) are even more prone to break if you don’t let jAlbum to go through the whole folder tree.

jAlbum is intelligent enough, so once you have processed a folder it will not reprocess the images again, only the HTML files, which is really just a matter of seconds.

I hope I could convince you to keep these setting like the ones marked on this picture. See Settings → Advanced → General page.

2. Upload errors, manual FTP upload

When you work locally, everything works the same way, reproducible. The internet, however, is full of potential errors. When you upload a large album it might happen the connection between your PC and the server gets broken (IO ERROR), the server drops the connection (READ END DEAD) or jAlbum gives up on retrying (TIMEOUT). Don’t panic, this happens every now and then. jAlbum (just like anything on the internet) is prepared for such errors. All you have to do is Upload the album again. It will continue where it has left off, so don’t worry, it won’t upload everything all the time. If the upload fails, jAlbum will display a little triangle () in the lower right corner – you can click for the full log.

If uploads doesn’t play well with your server, you can switch to another FTP client and test (e.g. ftp4j). jalbum has two ftp clients for the standard “FTP” protocol, and three for “sFTP”. If you get frequent connection timeouts you might want to check also if your firewall (or internet security software) isn’t blocking jAlbum’s traffic. Check if jAlbum is allowed to communicate through port 21 (sFTP: 22).

With jAlbum you can use an external FTP (or sFTP) application too to upload albums. While jAlbum always knows which files it has changed, when you upload the files manually you often don’t. When the FTP app relies on file modification dates it’s not as reliable either. For example if you only add one new folder, you might think it’s enough to upload that folder only. That’s not true. The files always change in the root folder, the /res folder, and all the HTML and JSON files throughout the whole album after a Make. It’s hard to follow, much easier to leave this to jAlbum. And jAlbum’s built-in FTP client is really fast, believe me. It can manage 6 simultaneous uploads! So unless you’re fully aware of what you do, I suggest you to rely on jAlbum’s built-in Upload tool. You can choose from 5 different clients inside jAlbum, so hopefully you can find the one works the smoothest with your server.

3. Broken album in local preview

You only see one or two rows of thumbnails in albums made with Tiger or Photoblogger using the local preview? That’s because these skins are based on a database format (JSON), which is not recognized by browsers as internet files (like a HTML file), and in an attempt to hide local files from phishing attacks, they block access to these files. The easiest way to preview these albums is using jAlbum’s built-in browser. Firefox also works out of the box. If you prefer Chrome you can still allow “local file acces” using a command line option. Save this file to you desktop (Windows / Mac), and double-click it. Close all Chrome windows before! Do not visit untrusted pages in this mode! The hardest way is using a web server and generate albums right into the “www/albums” folder. Being a web designer I use this method, but simply for tesing albums it might not worth the effort, I admit.

4. Garbage instead of accented letters, missing icons

The internet has settled on using UTF-8 as a standard for international codepage support. Previously we’ve seen some cases where it didn’t work, e.g. in old Internet Explorers, using the local album, but today UTF-8 is ubiquitous, it will work locally in any browser, on any server being it Linux or MS. So I suggest keeping this option always on. The other option stemmed from the same old use patterns is Naming → URL-encode links which also better to be kept on, although it supposed to not break pages if left off. (Tiger skin turns these options on whatever you choose, because its database is always encoded with UTF-8, anyway.) Read more about character encoding problems in jAlbum’s Wiki.

If the wrong letters appear only in the headline font (Google fonts) – e.g. question marks –, it might happen the font doesn’t contain the required codepage. Tiger and Photoblogger try to load the fonts with the language set in Preferences → Language, but not all Google fonts have all the codepages. You can check if a particular font has the required codepage here.

If no icons appear in the album – Tiger or Photoblogger – it’s probably because the server is not properly configured, and it sends the icon font file as plain text instead of binary. You will need to add .woff files to the MIME types application/x-woff on your IIS (Azure) server or ask your hosting provider if you don’t have access to settings. Turning on Settings → Tiger → Site → Site admin → Use Microsoft IIS or Azure server configuration might help too. On Apache servers these files supposed to work out of the box.

5. Album, folder and file names with accented or special letters

In theory the UTF-8 encoding should take care of this, but it’s always been a struggle for a skin developer to make special/accented letters work in file- or foldernames. And even if the skin can handle them, there’s no guarantee that every connected service will, e.g. social sites or PayPal. So if you want to remain on the safe side, use plain album and folder names, and keep the original image file names. Naturally, you can use any character in the final album, it’s just about the file and folder names that must work on the server and on the visitor’s PC too. (Using non-ASCII characters in file and folder names makes the ZIP feature broken too, that is the file names will carry invalid letters after unzipping.) You should avoid these frequently used letters (besides the accented ones) for example: ' " & @ # ! $ / * + ( ) [ ]

When creating a new album use e.g. “Mary and Johns wedding” (spaces are fine), then go to Settings → General and change Album title to “Mary & John’s wedding” – this time only the visible title will change.

The same goes for folders too. Add a new folder with the icon using simple (web-safe) letters, then switch to Title view and provide the final title (and Comment for lengthier text). This time you’re free to use any letter. (In the comment HTML tags are also allowed.) Same is true for regular files.

6. Facebook Share problems

There is an ongoing battle between Facebook and the rest of the world behind the scenes. You only see that your Facebook share button doesn’t work as expected, e.g. shares only the index page, but not the individual images. On one hand it’s comprehensible Facebook wants to get rid of newsfeed manipulations, and let only static pages to be shared for this reason, on the other hand they make fully legitimate uses impossible (like sharing individual images of an album) fighting back the malicious use. Some years ago they let sharing – even internal stages of webb apps – through a simple link. They’ve changed the syntax every now and then, and finally they’ve made sharing possible only through their API (application interface). Now, after the latest update this summer they’ve removed the customization possibilities. So you can’t customize which photo, what title and description to share, only the meta tags from the static page will be taken into account.

If you want to use Facebook’s other features (the Box, Like or Commenting) you’ll need to own a Facebook page. A private account simply doesn’t work, as you can’t assign “Apps” to it. You will need to create a new App here (click “Add new App”), and provide your website’s URL. Don’t forget to make it “Live”! In order it work properly, you will also need to fill in the Settings → Tiger → Site admin → Upload path box, because Facebook can work only with absolute URL’s, and if this is not provided upfront, the skin can’t generate the proper links to album thumbnails for example.

If you want to check if everything is set all right, copy/paste the uploaded album’s URL here and click “Debug”. This tool is also useful if Facebook has cached some wrong data, and you would like to get rid of that. (Click “Scrape again”!)

7. “Ooops” instead of map

Google Maps requires a unique “API key” for every site since 06/2016. This is something I can understand, because anonymous use could easily lead to server overloads, and even to malicious attacks. Click the “Create new/Manage” link in Tiger’s user interface to create a new key, or get one you’ve already created before. They keep older maps – as they call – “grandfathered”, that is, you don’t have to provide the API key in those albums. The maps in new albums, however, will be grayed out if no API key is used. The same goes for local previews, as you can’t create an API key for local files, obviously.

8. Custom code or caption template mistakes

Modern skins allow you to add HTML code at several places and allow you to edit the caption templates too. This comes with some risks though. If you enter the wrong HTML code, the whole album might get broken. For example you need to close most HTML tags, (e.g. <div>... </div>) otherwise the code comes next will be nested into your code, resulting in broken layout. (The exceptions are <img> <hr> <br> <audio> <video> <iframe> <input> – the so-called “void-elements”.) Also note, modern skins are based on HTML5 standard, in which some tags are not allowed, like <center>, <font>, <frame>, etc. Read more here. Instead of them use inline styles, e.g.
<p style="text-align:center; font-size:1.2em;"></p>

Or even better, use CSS classes:
<p class="mycomment"></p>
... and add style definitions through the Settings → Tiger → Site → Custom code → CSS box:
.mycomment { text-align:center; font-size:1.2em; } (Don’t forget the dot “.” before the name!)

9. Broken Tiger or Photoblogger album after upload

Not all servers created equal. Some of them for example are not prepared for handling the required JSON files out of the box. Microsoft’s IIS or Azure servers for example. (You can check the server’s type here – look for “Server: ”.) If you have access to the server settings, you can make the required changes by yourself. Also, once you’re there you might want to check if every file type is properly defined. (IIS servers are famous for being poorly configured.) You need to Add or check the existence of the following MIME types:

ExtensionMIME type

Read here how.

If you don’t have access to the server settings, you might want to ask your hosting provider to add support for the types above.

You can also use Settings → Tiger → Site → Site admin → Use Microsoft IIS or Azure server configuration to ask the skin to create a web.config file in the album’s folder, which enables these types for the current album only. Make + Upload

If your server is Apache/Linux, and the album shows the “The album’s main database file is missing or broken!” error, then the server’s configuration is wrong or the server hasn’t been updated in the last century. Ask your hosting company to get things in order.

10. Turtle to Tiger transition woes

Moving Turtle albums to Tiger skin is most of the time a painless process, but there are some things you need to be aware:

1. No separate slides mode exist in Tiger. Tiger albums are based on a database, which makes it easy to reach any photo from any page of the album. And this database would be gross (time consuming) to load on every slide page. Just like quitting Excel and opening every time you change cells. I see though not everybody will like this, because they’ve built albums with individual photos, linked or shared through social sites, let indexed by Google one-by-one. In this case it’s better to keep with Turtle in my opinion.

2. Although Tiger tries to import as many settings from Turtle albums as can, they might not fit with Tiger’s layout as good as with Turtle’s. I suggest looking through the following settings and set to Tiger defaults:

Images / Image bounds / Thumbnails200x150240x180 Tiger needs slightly larger thumbnails
Advanced / General / Write UTF-8-ON mandatory
Advanced / Naming / URL-encode links-ON mandatory
Tiger / Header / Top bar / Use search-ON suggested
Tiger / Header / Hero / Folder titletopLeft bottomSelect "Left top" for Turtle look
Tiger / Header / Hero / ${folderModDate}-Camera date range Select "None" if no dates needed
Tiger / Sections / Folders / Folder columns43Folders Look better with less columns
Tiger / Sections / Images / Thumbnail columns45suggested
Tiger / Sections / Images / Place captionsAs tooltipBelowTooltips aren’t mobile-friendly
Tiger / Sections / Images / Caption template-suggested
Tiger / Lightbox / Photo data-Press “Reset to defaults”will provide more and better photo data

That’s it for now. Write in the comments if you feel something has left out.

Tiger skin in practice

Perhaps the title is misleading, but no, we’re still not in the poaching business. Our skins’ purpose is much more noble, I bet you already know. :)

I made a few sample albums now just to test how the skin works from the user’s perspective. This little excercise was also beneficial to face everyday problems – you might stumble upon as a user – and fix numerous bugs in the process. Finally I put up four different albums with different looks to show off how flexibly Tiger albums can be customized.

I’m not sure if this is widely known, but jAlbum saves the settings along with the uploaded albums (unless you opt out), which makes it possible for other people to copy the look of the album. Naturally, only the public details – like colors or layout – not the sensitive data, like Facebook App ID, or your email address. Use the File → Import → Settings from Published album and copy/paste the album’s URL.

1. Travel album

Perhaps showcasing travel photos is the most frequent use of jAlbum. When I travel, I prefer showing off my photos in a low-key, elegant way, with emphasis on the photos themselves. Besides using folders based on years / locations, I use keywords to label places. This makes it easier later collecting images made at the same place or made along the same concept (e.g. panoramic photos). I used Tiger’s default style (Linen) and modified just a few things.

This album has more than 1 600 photos, which took some 15 minutes to make on the first run, but subsequent makes took only ~25 seconds. Pretty quick, isn’t it? We have streamlined both jAlbum and the skin to process large albums as fast as possible. Initially, jAlbum has to go through all files to gather camera dates, but this information is now cached, speeding up future album builds considerably. Previously this process could take 10 times longer.

2. Multimedia album

Adding video files in a Tiger album hasn’t been a problem since the beginning, but lately the so-called “External content” feature has been added too. Through this you can add just ANY content you want (instead of the original picture): custom HTML code, an external website, or embed a YouTube/Vimeo video. You name it. This content then shows up in the lightbox ebedded through a window. You can even use jAlbum variables in the code. If you’re curious, you can read how this album was made. The album also demonstrates an unusal way of using face tags.

3. Shopping cart

This PayPal-based shopping cart component of Tiger has appeared first in our Photoblogger skin. This collects the chosen items locally and allows the customers to edit (change options, quantities, etc.) before they send it to PayPal. Previously, Turtle skin had two different types of shopping carts: one that sent items to PayPal right off upon clicking the button in the lightbox, the other made it possible to select more items but only on the index page, and all had to have the same price (and same other options). This was probably hard to follow for the visitors. Check out how the new shopping cart works! Did you know your visitors don’t have to sign up with PayPal? Besides using their PayPal balance, they can pay the usual way with their credit card too.

If you want to have a custom content above the page – like here – simply use the Settings → Tiger → Header → Custom content feature. This way you can easily add your site’s logo and/or your site navigation instead of the ugly, user experience killer “IFRAME” method. Similarly, look for the Settings → Tiger → Footer → Custom content box for adding your custom page footer content.

4. Album with map locations

Thanks to jAlbum 14’s new Location setting feature you can easily add GPS coordinates to your photos if they are missing. Previously I went through all these Venice photos and copied the coordinates from Google Maps to Turtle’s proprietary “Location” text field, which was a bit of a hassle, I have to admit. Now Tiger skin not just reads those Turtle-specific fields but also converts them to “standard” xmp.GPS values right away. (You have to run “Make album” at least once though, because the skin code runs only during album making.)

Tell us what you think, your comments are welcome.

jAlbum 14 is here

jAlbum 14
is here!

After a long wait, we’re proud to announce the availability of jAlbum 14 – our most important update in two years. If you have an active support & update plan, this is a free update too! Here are some exciting highlights. As always you find the full list in our release notes.

Download jAlbum 14! »


Tiger skin


jAlbum 14 comes bundled with the brand new Tiger skin, our successor to the most used skin, Turtle. Tiger has been written from ground-up relying on modern web technologies and incorportating the most important features from both Turtle and PhotoBlogger, for instance shopping cart, tag cloud and search. It has visual similarities with Turtle to encourage Turtle users to make the move, still looking more up-to-date. It’s not just the end result that’s brand new, Tiger’s settings UI has been rewritten from scratch too in order to be more intuitive to you. To move to Tiger, just install jAlbum 14, open a Turtle album project and select “Tiger” from the skin list. jAlbum will try to match your existing Turtle settings to the equivalent Tiger settings.


Read more about the Tiger skin in our blog »


New dark user interface


Most of today’s professional photo editing software use a dark user interface as this puts focus on what’s most important – your pictures. jAlbum 14 now sports a great looking dark user interface look called “Darcula”. If you happen to prefer the old look, just open Preferences and switch back to <System default>.


Introducing Web locations


Since jAlbum was first introduced in 2002, albums have only referred to local objects (images, videos etc), but never referring to external resources. As a web page can link to any other web page in the world, why limit web albums to local objects? Web albums are, after all, web pages. This is the idea behind jAlbum’s new object type "Web locations".


Web locations are objects that can refer to any web page. This opens for some really interesting new applications for jAlbum. See for example this album collecting popular TED talks on YouTube. To add a “Web location” to your album, drop the web page onto jAlbum or select New page → Web location.

A great use of this new feature will probably be to make a master album out of existing albums. Bundled skins “Minimal”, "“Base”, “PhotoBlogger”, “Turtle” and the new “Tiger” skin now supports Web Locations.


Google Maps geotagging


jAlbum 14 now has integrated support for geotagging images using Google Maps. Just edit an image within jAlbum and expand the new “Location” panel. Now you can either geotag that image by placing a marker on the map or view an existing location. (The location data is stored within each image file in the open xmp format so it’s recognized by other xmp-aware software, like Adobe's software suite or Apple’s OS.) The bundled skins Turtle, Tiger and Photoblogger are capable of presenting the map location of your images.


Protect your images


jAlbum 14 makes it more convenient than ever to protect your images. The new “Embed copyright” section under Settings → Images ensures that all images added to your album project are tagged with your copyright info once the album has been made or updated. No need to manually enter this information for newly added images anymore (under Edit → Description). Existing album projects needs to be rebuilt using “Make all” to have the new copyright information added to existing images. Note: The copyright information doesn’t affect the images themselves, it’s embedded as xmp metadata to the generated closeup image files.

Skin evolution: Turtle to Tiger

Responsive web design

is the approach that suggests that design and development should respond to the user's behavior and environment based on screen size, platform and orientation. The practice consists of a mix of flexible grids and layouts, images and an intelligent use of CSS media queries.

Smashing Magazine

Although I am still evolutionist, I can't deny the new Tiger skin has born out of creation. The original goal was rewriting Turtle for responsive web design, but as time has passed, more and more code parts got rewritten, many functionality got changed and I´ve left out some features too, so finally I felt it´s wiser to call it a new skin, not just a new version. Although Turtle skin will be still maintained, the focus from now will be on Tiger.

The development has started more than 6 months ago and besides replacing the HTML structure to cater for responsive layout, the Java utility library has been rewritten from ground too in Javascript, just like any code in the skin. The only exception is the User Interface. At the beginning I was afraid using Javascript for the application itself, but turned out to be much smoother (and forgiving) than BeanShell – jAlbum´s original scripting language. It´s even speedier. Hopefully this will encourage other web designers with no Java knowledge getting involved in skin development.

The new skin is based on Turtle´s outlook, still more code came from the Photoblogger skin, which is newer and has more advanced features. Search, tag cloud, site-wide shopping cart, to mention a few. It also inherited Photoblogger´s database-driven architecture, which makes it possible to search for and show any photo on any page of the album.

I hope Turtle fans will like the possibility to reorder the sections on the index page to their taste. You can even add a custom section with any HTML content.

The vertically split layout of Turtle had to be removed, because it didn´t fit with the responsive design. This was very hard to handle on smaller screens, anyway. I hope you won´t miss that.

The User Interface has changed significantly too. I know it´s a drag for Turtle users, but Turtle´s UI got gradually more and more complex over the years to the point it was intimidating for new users. The new organization is intended to mimic the page layout, and you will find the settings and features under the corresponding tab, like Site, Header, Sections, Footer, Lightbox.

With the new “Full width” hero image the album fills in the window horizontally, and not just the hero image but the top menu bar and the footer too. (I called the “theme image” “hero” in this skin, because this is how it´s called in WordPress for example.) I must admit, I like this layout better than Turtle´s, but you can switch back to the traditional layout if you prefer that.

When we were talking about running the skin under a new name, I suggested David – jAlbum author – to introduce the skin family support in jAlbum for easier change between skins. This way when you switch from Turtle to Tiger you don´t lose your previous settings, and don´t fall back to skin defaults, like it happened in the past, instead the new skin tries to match as many settings as it can. Being Turtle the most popular skin of ours, I believe it´s utterly important to help users in switching. If you have custom pages, like About.htt or Contact.htt, you might need to repair them before “Make album” to fit for the new scripting language with this tool.

Sample album

Tiger´s styles were made to match Turtle´s on purpose, so you can seamlessly continue with the new skin in your album collection. Switching is good not only because of the new features and the for the benefit of mobile visitors, but because this new skin is based on today´s newest technologies, like Zurb Foundation framework, which makes these albums future proof, therefore Google will like your page too and put it higher in search rankings.

Due to the fact that Tiger is based on a “JSON” database, the local testing is limited to the built-in browser or FireFox. This is because in an attempt to protect your local files, the browsers block access to file types they don´t recognize. Unfortunately this prohibits previewing Tiger albums in Chrome and IE, and you will see only the first dozen of thumbnails and the album will dysfunction. You can still start Chrome in “less secure mode” – if you prefer that browser for previewing – by following the instructions in this sticky note. You can also install a web server, like Wamp on your PC, and access the local album through that, but it´s kind of overkill unless you are a web designer.

I hope you will like Tiger as much as you liked Turtle. Your feedback is welcome!


22 good reasons to update jAlbum


Are you an old time jAlbum user and haven't decided to go for the current jAlbum version? We’ve made improvements in many areas since jAlbum 11 so I really feel you should give the current jAlbum a try. If you renew your license you’re guaranteed to get any future updates within 12 months for free. This includes the upcoming v14.0 which is just around the corner now.



Great image organizer added

Powerful image effects

New video editor

Improved image editor

Collaborative albums

Flexible multi file renames



New responsive skins

Updated user interface


Vectorized icons



Less IO intensive

Faster thumbnail painting

Faster album rebuilds



Fast RAW image support

Imports directly from facebook

Integrates better with other apps through drag & drop


Ease of use

Context sensitive help

Multi level undo/redo

Improved error reporting



Requires less memory

64 bit app

Updated upload libraries

Numerous bug fixes


All improvements are listed in our

Release history »


Get the latests jAlbum today to get hold of these improvements.

Renew license »

Why jAlbum?

You probably had a good reason for choosing jAlbum in the past, but let me iterate why we’re relevant today:


Integrity matters

jAlbum is not a centralized service like most competitors. Your galleries are fully independent. The importance of this cannot be understated. When we hear stories of image services copyrighting your images, even selling them or having security breaches in central databases, we’re reminded that the old saying “Don’t put all eggs in one basket” still holds. With jAlbum your in control of the whole image workflow independent from us. Moreover, we use open standards for metadata and configurations to avoid any lock-in.


Functionality matters

If you need a specific functionality in your gallery, say for instance sales support, Google maps integration or smooth transitions paired with background music, there is a skin for that. If a certain functionality is missing, it can be added using jAlbum's flexible APIs.


Appearance matters

Not all sites have the same look. You should be able to customize the gallery’s appearance so it blends with your site. With jAlbum you can customize appearance from a multitude of settings and even down to html/css level if you need to.


Convenience matters

Many user choose us because they can conveniently manage and upload large amounts of images regularly. Once set up, it is very straight forward to make regular updates to large galleries. Many users appreciate the ability to work offline too.


Download latest version of jAlbum! »


Please remember that renewing your license will help us give you continuous support, allow us to develop the software even further, improve the skins and keep the site running. We depend on our users and you are an important part of our success so far, so we hope you want to be part of our future.

Yes, renew my license! →