Turtle 5 comes with dozens of new features, like the improved shopping experience with bulk ordering and coupon codes, or the new feedback tool, still many of them is behind the scenes, like the substantially reworked touch event handling, which brings a much smoother mobile experience.
Here is the magic switch that decides between these modes in jAlbum, called “Make slide pages“:
Turn it on for the “Separate slide pages” mode – the default is still the dynamic mode.
In the traditional – separate slide pages – mode, the HTML page loads all the page components and all the widgets (like Facebook, Google +1, etc.) every time an image is loaded. Every page has a separate URL address, so you can bookmark or share images separately and can use external widgets which rely on the page address, for example Facebook commenting. The downside is inherent in the web technology which doesn’t allow transitions between web pages, nothing can remain from a previous page (like background music), and need to build every page from ground, loading and rendering everything on a page again and again. This is why Turtle skin was originally made dynamic. A dynamic album is capable of making smooth transitions between the images, loading only the necessary components, an rendering a full folder only once.
Separate slides mode
You might ask why did then Turtle introduce the traditional mode at all. It’s because there are several scenarios when the separate slides mode is still beneficial, e.g. achieving better search results, being able to comment images through Facebook separately, using several hundreds of images in the same folder, to name a few. It’s a fundamental change in the structure, every part of the code had to be rewritten to work in both modes. I tried to find the best match between the two modes, still there are tons of differences. See the table below.
|Dynamic mode||Separate slides|
|Number of HTML pages||One per folder||Number of images + 1|
using hash, see below
|Search bots can find individual images||Less probably
and they’ll link to the gallery
|Continuous background music||Yes
in the same folder
above the image
|Only max. 15
5 previous – 10 next
|Maximum number of images in a folder||< 600
to avoid memory leak in poorly written browsers
the number of page elements (thumbnails) is still limited
|Like, Comment, +1, PinIt, Share complete folders||Yes||Yes|
|Like, Comment, +1, PinIt, Share individual images||No||Yes|
|Tweet, Tumblr, Email individual images||Yes||Yes|
|Google Maps show all placemarks||Yes||max 15|
|Can skip index page and auto-start slideshow||Yes||No|
|Can retain full screen mode||Yes||No
in most browsers it falls back to windowed mode with every page change
|Image-sensitive jAlbum widgets||Partial
Commenting widget works, the others ignore it
|Traffic browsing through an album||~ 120 kB
|~ 180 kB
|Server requests||the least possible||cca. 10x the amount as in dynamic mode|
|Page load time||Only index page
images are loaded as fast as can
|Every image is rendered on a separate html page|
|Google Analytics||Per folder||Per image|
Tracking the actual image in dynamic mode
To be able to follow the actual image the skin is using a technique (using internal links), which adds the image name after the URL the following way:
Both modes have its ups and downs – which is better boils down to what you are using the album. If you want to showcase a small number of images in a smooth (even full screen) presentation with optional background music then go for the Single page mode. If the possibility to individually Like or Comment images is paramount, would like to showcase a huge number of images in the same folder, or prefer to have individual search results for the photos the separate slide pages mode might fit you better.
Base 2.1.4 Nov 26, 2012
- Added Advanced panel
- Code hooks: HEAD, BODY and CSS
- Google Analytics added
- Top menu logo can be of any size (not limited to 40px high)
Turtle 3.5.2 August 30, 2012 Turtle.jaskin
- Windows Live Photo Gallery facetagging support
- “Start slideshow” button has nicer animation and better readablity
- Broken links with search results when “Make slides” is on
- Direct linking to images is broken with “Make slides”
- ZIPped album ended up in the wrong folder with “Offer download for the whole album”
- Text bevel effect was too strong in some styles
- Make slides automatically turned on when opening an old album
- Added help for download as ZIP
- Jeans styles’s folder and thumbnail background plates changed to light from dark
- Turtle now can create slide pages too with limited functionality. These are useful
for SEO purposes, because the high resolution images are placed on a separate HTML
page and can be indexed easier. Being this a new feature which changes many things,
can break some of the album functionality. Use with precaution and test.
- If you want to play safe, disable the
Make slidesoption on
Settings / Pages /– jAlbum might turn it on occasionally
Advanced / Make slides
- This update brings a new method for image linking, therefore when you update albums
made previously, make sure to regenerate all sub-folders.
Settings / Advanced / Process subdirectories = ON
Settings / Advanced / Process only updated subdirectories = OFF
Notes for Version 3.5.1
- Pinterest “Pin It” button now works with individual images too.
- “Evaluation error on line 182:”
- Tumblr button works on individual images
Notes for Version 3.5.0
- Pinterest’s “Pin It” button
- Start slideshow text on the header received more contrast
- Search box stays on after changing pages. Remembers window position and size.
- Navigation bar stays on after switch to Full Screen mode in FireFox
- The “After last page” modal window is hidden in Full Screen mode
- Modifications in the event system should result in lower memory use
(important with IE, which does not recycle the unused memory properly)
Skin version: 3.4.6
Turtle skin has such an extensive feature set – I guess even the most experienced of you can find something new. To get into Turtle skin settings either click the little skin icon next to the skin chooser in jAlbum or press F4.
Show top navigation
Select to display a multi-level, site-wide top navigation menu at the top of the index page.
You can exclude the folders and display only the custom pages.
Include a logo at the top left corner of the navigation bar, linked to the top level album page. The max size is 180x40px. Suggested format: 8bit transparent PNG.
Link from the top level page
Adds a link which takes you one level up from the top level page. You can use any absolute or relative URL, not just the one level up (../).
Use breadcrumb path
Breadcrumb path is the clickable path of upper-level folders.
Use search box
Add an album-wide search box to your albums. Can search in the Title, Comment, Keywords and Face tag fields.
Skip thumbnail page
Visitors will taken straight to the first image in the album. However if there are sub-albums, you can’t skip the thumbnail page.
Offer download for…
- Nothing = to turn off this feature
- Scaled-down images = allow visitors to download the screen resolution images in the current folder packed as ZIP file
- Originals = allow visitors to download the original images as ZIP file, even if you did not include them normally in the album
- The whole album = visitors can download the whole album packed as ZIP file
Please note, albums using extended (accented) characters in file or folder names cannot be properly unzipped on Windows, because Windows decodes these characters mapping to the viewer PC’s default character set, while Java encodes always with UTF-8 encoding (which is capable of representing any character in any language). The files can be restored properly on every other OS though.
Turtle skin received quite a few new features recently, still I think it’s not too hard to pinpoint which will be the most popular: Facebook commenting. Yes, even though you can create sophisticated albums with jAlbum & Turtle, Facebook is the place your friends, family or clients (you name it) hang around. With this new tool your friends not only get notified of your fine new album, but they can comment on it instantly, and you’ll get notified of their comments right off. They can also choose to share their comments on their Facebook wall. This will make it possible to reach 100′s of people in no time. This little tutorial will show you how to add Facebook commenting to your albums.
Every album is different. Why should you use the same typeface for all? With version 3.3.0 came the improved font stacks to Turtle, and with 3.3.1 you can even choose a unique headline font for page titles. I will explain how these fonts work in your albums.
Building panoramic galleries is not fully supported by most of the web album tools today. You need to have some panning tool to be able to conveniently handle these extreme-wide photos. In Turtle 3.2.0 I have introduced some new techniques to support this.
The swipe control has been extended to let users pan panoramic images horizontally and trigger the switch for next (previous) photo only when the right edge gets below the 90% of the window width. The left and right arrows on the keyboard can also be used to pan left and right until you reach the far end, when it falls back to the original previous (next) picture functionality. But a working example is worth a thousand words according to the ancient Chinese wisdom. Click the image below to test it “in vivo”.
Use the Left and Right arrow buttons to pan through, or move the image with the mouse, or simply swipe left and right on touch devices.
- Compatibility issues with jAlbum 10.3
- Missing skin.properties.file (continuous update attempts)
Note: this version is using a call, replaces the deprecated one, which requires jAlbum 10.3 or newer
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)