Like
Likes
36
Downloads
9762
Author
AndreWolff AndreWolff
Install skin

You can also install the skin by unzipping this file into the skin folder.

Min. jAlbum version
15.3
Description

The PhotoSwipe skin has the same index page as the Slide Show 4 skin, but the Slide page is replaced by the PhotoSwipe JavaScript gallery developed by Dmitry Semenov, see http://photoswipe.com/

So like the Slide Show 4 skin it is a small single page html5 compliant skin which gives maximum attention to your photos, because it will fill your screen with your photo, by adapting the image size to the screen size of your tablet or computer. The focus is not lead away by other small pictures or text.

Navigation and control is possible via buttons, via the keyboard on a PC and via one finger swipes on the iPhone or iPad and other touch screen devices. The buttons at the top of the index page are optional and can be hidden or displayed by clicking the theme image or the album title.
Navigation on the slide page: Swipe left / right to the next or previous image, spread to zoom in, drag to pan, pinch to zoom out or close, tap to toggle the controls, double-tap to zoom, swipe up or down to close the slide page and return to the index page.

The skin has a responsive layout of the thumbnails gallery: you can choose for an elastic table where the thumbnails grow or change if the window size changes or you can choose to reduce the number of thumbnails per row if the window width is reduced or make an elegant image gallery with the Justified Gallery plugin. A Justified Image Grid respects the original aspect ratio, no detail is lost due to cropping.

An album may contain a mix of photos and movies. For thumbnails of movies on the index page a special border color may be selected.

This skin allows you to use one central resources folder for all your albums

Several settings can be changed by the viewer like the button size and the font size, which is is useful for small devices like an iPhone and in case you have troubles reading small letters. It is also possible to change here the viewing time for a slide in the optional slide show presentation.

You can display the album embedded in your web page with an iframe and you can show the first enlarged picture from a link on your web page without displaying the index page with thumb-nails.

You can choose for fixed shape thumbnails or for thumbnails with the full aspect ratio (no part of the picture cropped, but showing everything).

You can use plain text or html code both in the album description and in the slide descriptions.

Via 7 optional links on the index page, displayed as standard text buttons, as icon buttons, in a tool-bar or in the menu-bar at the top of the index page, you can add links to other albums or web-pages in a new window or in the same window. You can also display a web-page in a frame on the index page. The optional responsive menu-bar can be replaced by a Hamburger button on small devices.

Optional Facebook and email 'Share' button on the index page and for each slide share links to Facebook, Twitter, email and Pinterest. If GPS information is available in a photo, the location can be displayed in Google Maps. Finally each slide has an optional 'Download' link.

Use my program MakeMap to display the photos in a Google Maps or Google Earth map with links to the slide pages.

If the album contains wide (panorama-) pictures, an expand icon is added above the image on the slide page, if check-mark 'Spherical Panoramic image' or 'Cylindrical Panoramic image'in the Panoramic image panel for an image has been set. For a 360° cylindrical panorama, you should set also set check-mark '360° panorama', in that case you can endless scroll through the panorama. If you set the 'Spherical Panoramic image' check-mark, the panorama can be viewed in Jérémys Photo Sphere Viewer.

It is also possible to view your panoramic pictures on external pages like the 360Cities.net site or with Google street View.

jAlbums 14 web-locations are supported:
You can make a top album of albums or display the web-location in the slide page as an image with a link to open the website in a new tab or you can display the website instead of a slide image. Via extra buttons you can navigate to other parts of the album. You can use this mode to display YouTube videos and/or external panorama pages in-line in the album.

With jAlbum 15 it is now also possible to define a theme image by dragging an image to the Theme Image box in the new Folder panel. This theme image can be used as background image or as a normal (responsive-) image, defined on the Theme image tab.

Features
jAlbum widget supportDisplays EXIF/IPTC dataMulti-language albumsBackground musicUses JavascriptTransition effect(s)Touch interface supportDisplays mapPlays video filesWeb page supportHas slideshowPlays audio filesFreewareSupports foldersResponsive layout
Created
Dec 30, 2015
Last updated
Oct 30, 2018
Support
Homepage

https://andrewolff.blogspot.nl/2014/07/slide-show-4-skin-manual.html

Usage
Commercial use is allowed only if you pay a 3rd party license.
Modifications of the skin are allowed.

Releases

1.9.6 Oct 30, 2018 (current)

New code for Theme image: theme image size should now be set in the Set Cropping window. The Theme Width and Theme Height fields on the Theme Image tab are removed.

A folder image is now reduced in height if the image is larger as the folderbox.

If you click the Facebook Share button or the Menu button on the slide page, the URL of the image and the URL of the web page are copied to the clipboard. This makes it easy to share the image and page in the native Facebook app and other apps.

Facebook Share code changed because of problems with the Facebook share function under iOS.

If the album shows no theme image, the Facebook share function shows now another photo.

New check-box ''Keep the common.css file locally' in the 'Fixed res path' group of the 'Web page' tab; only used if the 'Fixed res path' is not empty. This allows you for example to use another background image as used in the global res directory.

New check-marks on the Index page / General: "Use as background color for the album description:" and "Fill box around the description". If both check-boxes and check-box "Show shadows on index page" have been checked, the Album description panel shows a shadow.

It is now possible to set the width of the the Album description panel.

Check-mark 'Show shadow in title' has been moved to the Index page / General tab and is now also used if the title is outside the theme image. The title gets no longer automatically a shadow if check-mark 'Show shadows of panels on the index page' has been set.

New check-mark and color selector on the Index page / General: "Use as background color for the album title:".

Problem with PhotoSwipe default-skin icons with Fixed root path solved.

More skins made by AndreWolff

Sign in to post
Write a comment
Post comment
edburdick

edburdick 6 months ago

Since updating to the latest versions of Jalbum and Photoswipe,, my videos don't start at all on my android devices running Chrome. The site is at http://www.edburdick.net/Picturelib/2017v-tanzania-trip/ . Is this an introduced bug, or am I doing something wrong? Note it does work on Firefox for Android, the noticeable difference being that there is a play button and time line at the bottom in firefox, but a play button in the middle of the player in Chrome. Are they using different players? jAlbum 15.4, PhotoSwipe 1.8.4 Thanks for any help

Reply
AndreWolff

AndreWolff 6 months ago

Hi Ed, I just tested your Maasai teenagers video: It runs fine on my iPad under iOS. I have a very old Android tablet, but there it runs fine with Chrome. I have another newer Android tablet where it does not run under Crome. Next I installed Firefox on that tablet and there it runs also OK. So I have no idea to solve your problem, unless you are going to use Firefox. Ed, please report problems in the forum: http://jalbum.net/forum/forum.jspa?forumID=11 This makes it easier to add enclosures like screen dumps etc. and you you could get suggestions from others having the same problem. Best regards, André

AndreWolff

AndreWolff 6 months ago

Hi Ed, I tested the movie of your Masai teenagers. It runs OK on my iPad under iOS 11. It runs also OK on a very old Android tablet under Chrome. It does not run under Chrome with a newer Android tablet, but next I installed Firefox where it runs also OK. So am afraid I can't offer a solution apart fro advising you to use Firefox instead of Chrome. Please report problems in the forum: http://jalbum.net/forum/forum.jspa?forumID=11 This makes it easier to add enclosures like screen dumps etc. and you might get advise of others having the same problem. Best regards, André

edburdick

edburdick one year ago

I really like this skin for the way it adapts to different devices. A couple of questions... Is there support for multiple levels of folders? Jalbum lets me create one, but when I click on it, the images I put in it are not displayed. Instead, it is as if I went to the first image at the same level as the folder. To scroll a bunch of thumbnails on a phone, I cannot swipe over the thumbnails, but need to use empty space on the edges. Is there a setting that supports swiping over the thumbnails? Thanks for the great work.

Reply
AndreWolff

AndreWolff one year ago

I do not understand your question about multiple levels of folders, could you please give a link to that album? About the swipes: try the various settings on the Index pages / General with the selection box after "Allows swipes:".

AndreWolff

AndreWolff one year ago

BTW Ed, please report problems in the forum: http://jalbum.net/forum/forum.jspa?forumID=11 This makes it easier to add enclosures like screen dumps etc. I don't see problems with multiple levels of folders as you can see in this test album: http://andrewolff.jalbum.net/Vecht_Beerze_PS/index.html

AndreWolff

AndreWolff one year ago

Did you see this remark in the manual: If an album contains folder albums, the thumbnail folder icons are displayed in a second table of thumbnail folder icons after the slide picture thumbnails of the top album. However it is the responsibility of the album creator that the folders are located after all normal images in the jAlbum Explore.

rundlewood

rundlewood 2 years ago

Andre, Thanks for getting back to me so quickly. After your email, I uninstalled Firefox and then did a clear install of it. That seems to have solved the problem. I did check that the browser view was reset though before doing this. I have not uploaded the site, am playing with different responsive skins and trying to integrate them into my website.

Reply
AndreWolff

AndreWolff 2 years ago

Ok nice to hear the problem is solved! I still like to get your link if the result is uploaded!

rundlewood

rundlewood 2 years ago

I have been looking at the code using Firefox's Inspector and the body font seems to be reset. The code is: instead of the 16px also I noticed that the H1 Tag is being reset : My setting in Album settings are Font-size: 16px and album title font-size : 22px Hope this info helps.

Reply
AndreWolff

AndreWolff 2 years ago

Well I can't reproduce this problem in my Firefox 50.0.2 version. I see in the inspector indeed font-size: 16px; with a line erased, but that is correct because this is modified in my Javascript SetViewersettings function.. What happens if you change the font size to 200% or 50% in the ste viewer settings window? Please give a link to your album, so that I can check it!

rundlewood

rundlewood 2 years ago

Photoswipe and Firefox 50.1.0 I created a basic photoswipe album and when I display it in firefox the fontsizes and not displayed correctly. They seem to be defaulting to 8px instead of the 16px in the settings. When displayed in Internet explorer the fonts are correct. Any suggestions of how to fix this?

Reply