jAlbum Turtle skin

Sell your products with the help of Turtle skin

You might’ve missed it, but Turtle skin can be used to sell your photos or products too. To use this option you need to hold a Pro license or a Power storage account with jAlbum. Although the payment is routed through Paypal or Google Checkout, your customers don’t need to be signed up with these payment processors, they can simply use their credit card as well. Here’s how you can create an album with a shopping cart, and how the visitors see the process.

Creating the album

First collect the photos (of the products) you want to sell, and create a new album in the jAlbum application.

  • Add the photos by the Add button or by dragging them onto jAlbum
  • Choose Turtle skin
  • Add an image to be used as “Theme image” on the index page. Right-click → Use as folder thumbnail, and Right-click → Exclude
  • Switch to Edit mode (Pencil icon) and add captions to your items with the details of the product (you can use HTML code too in the captions)
Goodies Wallpapers

Screen resolutions desktop background image

If you are a web designer, like me, you possibly often find your self wondering how your newly-designed webpage would look on different screen sizes. This lead me to make this practical screen background, by which testing the different screen resolutions is a snap: just adjust the browser size to the background grid.

Well, using a low resolution monitor might not optimal, but I assume once you’re a web designer you don’t struggle with a 1024×768 monitor. To tell the truth, my best investment was a second monitor recently. Now I don’t have to juggle with the hidden windows, just put the editor left, the test to the right, and no more switching after every step.

The image is 1920x1200px in size, which makes fit best for 1920×1080 or 1600×1200 monitors. If you have a bigger one, I can make it fit to that resolution.


Just click the download button above to open the PNG file in a new window, then right-click -> Save image as... Finally once it’s donwloaded right-click the file and choose Set as desktop background.

Legal: You can use this in your private and commercial projects but not allowed to redistribute it.

Goodies Textures

Textures I – Nature

Here are 16 of my pictures. You can use them for free both for personal and commercial purposes. I hope you will like them.



Legal: You can use this in your private and commercial projects but not allowed to redistribute it.

addSwipe plugin jQuery

AddSwipe plugin

With this plugin you can add swipe action to a layer, and render actions for the left and right swipe move gesture. Works with mouse and touchscreen uniformly. You can also set it up to snap to grid, e.g. window width or a fraction of the width.


$(layer).addSwipe( leftFn, rightFn, { options } );

addHint plugin jQuery

AddHint plugin

With this plugin you can display tooltips on hovering an element. You are not limited to simple texts. You can use HTML formatting even in the title attribute. Or you can generate the content by javascript and pass to the plugin. The content can be aligned to the target’s any edge, and will make sure the popup not goes off-screen.

The popup will not go away as long as you hover the mouse over it, or an input element inside has focus. Will also take care of the touch devices, where no mouse leave event exists, and will fade the popup automatically after 3 seconds (configurable).


$(layer).addHint(content, { options });

alignTo plugin jQuery

AlignTo plugin

This plugin does nothing else but – as you might have guessed – aligns an absolutely positioned layer relative to another. You can choose which corner of the layer to align to the target’s which corner. As easy as can.


$(layer).alignTo(target, { options });

jAlbum Tutorials

Adding and updating translations in jAlbum

Making localized version of a skin is pretty easy in jAlbum. First make sure you are using the language: Tools -> Preferences -> Language and if using the latest skin version (

jAlbum has its own translation tool since version 8.11. Just fire up Tools -> Translator -> Translate selected skin if no translation exists yet, or Update translation otherwise.

Add music to site tool jAlbum

Add music to site

This little tool for jAlbum will help you adding music to any of your albums made with jAlbum. Download the attached zip file and extract to C:\Users\[username]\AppData\Roaming\jAlbum\Tools directory on PC, Applications /jAlbum/[Right-click: Show package contents]/Java/Tools folder on Mac.

The tool is using Jeroen Wijering‘s excellent MP3 flash player. See the original site here. Please read the legal and licencing issues before using it.

Before you add music you might want to compress it to make fit for web use. A reasonable compomise between bandwidth and quality is around 92kbs/Joint Stereo. You can use iTunes or some other free encoder (from here).

jAlbum Turtle skin

Turtle – frequently asked by you

While giving support for Turtle skin some of the questions pop up from time to time. I gathered here some of the most frequently asked ones.

Where can I change this or that?

I’m aware finding the Settings window isn’t obvious sometimes. You can go to settings either by clicking the “gears icon” below the project on the left hand side or clicking the “skin icon” next to the selected skin or choose the “Album » Settings” menu. The skin’s proprietary settings are gathered on the skin tab (called “Turtle” for example).

Base skin jAlbum

Base skin released

One of the most appreciated aspects of jAlbum is the ability to customize albums to fit your requirements. It is therefore important that we have a thriving skin developer community. These days it’s more common to see updates to a smaller set of album skins than to actually see new skins emerge. We believe this is much due to the higher expectations users have when it comes to standards compliance, features and visual appearance. It can also be a daunting task to modify existing skins as they have grown in code size and features – you easily break things. Some skins may also have a licensing model that doesn’t allow modification.

The Minimal skin was initially made to be minimal enough to encourage people to base their skins on it, but it is old, both with regards to html+css style and visual look. We have therefore designed a skin that should be the perfect blend: Basic enough to encourage you to base your modifications and new skins on it, but with a current code style, feature set and look. Welcome “Base” skin!

Base skin has a simple, well-documented HTML 4.0 / CSS 2.1 (3) structure, still sporting tons of advanced features. The features were transplanted from my other skins (e.g. Turtle) – metadata formatting by templates, breadcrumb path, custom background image, site colors, fonts and watermarking to name a few. These will spare you a lot of time, thus you can focus on the important things: the HTML stucture and styling.