Venus 38 User's Manual

Index Page

Index Page » Title Bar

Index Page » Icons

Index Page » Other

Index Page » Logo Image

Thumbnails

Thumbnails » Design

Thumbnails » Captions

Thumbnails » Overlay Icons

Slides

Slides » Navigation

Slides » Options

Slides » Appearance

Slides » Caption

Slides » Downloads

Dark & Light Styles

If you choose the Dark or Light style, the padding around the slide image would be the same color as the dimming background. This would then give the appearance of icons seeming to be positioned badly, and of the slide caption seeming to be too far below (or above) the slide image. Therefore, if either of these two styles is chosen, the padding setting, shadow opacity, and caption separation are ignored, unless you also elect to use a lightbox border. There will be no padding or shadow on the image, and the caption will appear directly below (or above) the slide image.

Fonts » Album

Fonts » Album » Font Family

Fonts » Album » Google Font

Fonts » Album » WOFF File

Fonts » Index Page

Fonts » Index Page » Font Styles

Fonts » Slides & Info Page

Fonts » Slides & Info Page » Slide Font Styles

Fonts » Slides & Info Page » Info Page Font Styles

Text

Text » Tooltips

Text » Other

Info Page » Design

Info Page » Design » Layout

Info Page » Design » Image

Info Page » Design » Contact

Info Page » Text

Info Page » Text » Title

Info Page » Text » Body

Code » CSS

Code » CSS

Code » Top & Bottom Info

Code » Top & Bottom Info

Code » HTML

Code » HTML » Head

Code » HTML » Body Opening

Code » HTML » Body Closing

Misc

Misc

Custom

Custom » Create a custom style

Custom » Index Pages

Custom » Slides

Custom » Info Page

Custom » Theme Image

Custom » Banner

Custom » Body Background Texture

About

About

Info: Project Structure

Venus handles the project structure in a way that is unlike any other skin. In most skins, the top level contains thumbnails that link to each of the folders in the project - each folder then has its own index page. Venus, on the other hand, shows the contents of each of the folders as a group of thumbnails on the top-level index page. There is, in fact, only one index page in the completed album. As a result, the project structure for a Venus album has several absolute restrictions:

As an example, the skin could be used to show a relatively small number of images from each day of a trip. Place the images in folders called Day One, Day Two, Day Three, and so on. In the resulting album, there will be an index page with a group for each day of the trip, with the thumbnails for the images corresponding to that day.

The skin is particularly well-suited to creating an "album of albums," using web locations. You could create three folders: Family Albums, Travel Albums, and Pet Albums. In the first folder, add a web location for each family album. In the second folder, add a web location for each travel album. In the third folder, add a web location for each pet album. The resulting album will show three groups of thumbnails, each of which is a link to an independent album. As with all web locations, of course, these links could point to any site on the internet, not just to your own albums.

Info: Video Support

In Venus, support for videos added to a project is dependent upon the video support built into jAlbum. For videos to work properly in an album, video support must be enabled in jAlbum under Tools (jAlbum in macOS), Preferences, Advanced. The slide window that displays the video will be the same size as the video's native dimensions, reduced as necessary to fit within the visitor's viewport. If those dimensions are larger than the image bounds chosen under Album » Settings » Images » Image bounds » Images, the display will be reduced to fit within those bounds, preserving the aspect ratio. The actual video file in the album will not be adjusted - only the display window is scaled down as necessary.

With video support enabled in jAlbum, the core program automatically provides a thumbnail image for the video. In image editing mode, a slider is available to choose a video frame other than the one automatically selected. This can be especially helpful if the video starts with several seconds of a black screen - the automatically-selected frame might be black in that case.

It is possible to provide your own representing image for the video, which could be an image that doesn't even appear in the video. Choose a full-sized image (a regular JPG file, and not just a small thumbnail), change its extension to .thm, and give it the same name as your video. For example, for a video called mydog.mp4, the image file should be named mydog.thm. This file should then be added to the project at the same time the video is added to the project. This image will then be used both for the thumbnail and for the video frame while the video is loading and after it has finished playing.

Your web host must provide video files with the correct header information. The MIME type must be video/mp4 - if an MP4 file is delivered by your web host with any other MIME type, playback will fail in some browsers. If you find that a video in your album plays properly when you preview the album locally, but displays only an error message when viewed from your web host, an incorrect MIME type is the most likely cause. Ideally, your web host should correct the server configuration, but if you can change your own .htaccess file on the server, adding this line will correct the problem:

AddType video/mp4 .mp4

In addition, video files must not be compressed by the server using something like gzip, for example.

Info: HTML Tags and jAlbum Variables

HTML tags and jAlbum variables may be used in a number of different contexts, and will be honored in the album (including things like links). jAlbum variables will be passed to the jAlbum engine and will be evaluated before they are placed in the completed album. Almost all user entries are treated in this manner:

If you use a < or > character in a text string, it is assumed to be part of an HTML tag, and may produce errors if it isn't. If you want to use one of those characters as simple text, use its HTML entity code, instead.

Info: Google Fonts & WOFF Files

A longstanding problem with web pages is that fonts are not actually included in the page code. The page simply includes some text, along with an instruction in the CSS that tells the browser what font to use to display that text. But if the visitor's computer doesn't have that font installed, it falls back to a default, or works its way down whatever font stack is indicated in the CSS until it finds a font that it can use. The effect of this limitation is that web page designers are generally forced to rely on a small set of "web safe" fonts, fonts that can reliably be found on most visitors' computers.

Packaging fonts with web pages in a way that allows the site visitor to install the font on his computer, while possible, runs afoul of copyright protections. Most fonts, even those normally distributed with a new computer, are protected by copyright, and you don't have the right to make them available to others.

To address this problem, Google Fonts and Web Open Font Format (WOFF) files can be used. The font is not actually installed on the visitor's computer. It is used only for displaying text on your web page.

In Venus, you may add two Google Fonts and a WOFF file, and tell the skin which font to use for each text element, with the default being the selected regular font family. Decorative fonts can be difficult to read at smaller sizes, and are therefore best used only for page titles. You are likely to find that they look better when displayed with a larger font size than you would use for a regular font, and with normal weight, rather than bold. More traditional fonts may be suitable for all text.

To choose a Google Font, visit the Google Fonts page, and identify the font you want to use. Scroll down on the page to view suggested font pairings. You might want to use a more elaborate font for titles, and a simpler font for captions. Make a note of its name, and enter the name in the Venus settings. Venus does not support the use of Google Font multiple styles. If you see a font listed, and it indicates that there are multiple styles of that font available, when you enter its name in the Venus settings, the skin will use the basic style of that font.

There are now many hundreds of free WOFF files available. Search the web for free woff to find sources (some sites require registration). In most cases, the fonts are free for you to use on your website, even if the website is commercial, but the font designers retain copyright, so you don't have permission to redistribute the files directly to others. Often, these free fonts are provided in a variety of formats - WOFF, OTF, TTF, EOT, SVG, and so on. The format needed for Venus is indicated by a .woff file extension. In many cases, the download will be provided as a zip archive containing several formats - you need to extract the .woff file from that archive and use that one for inclusion in the skin.

The FontSquirrel site is a typical example, offering many free fonts. Find one you like, and then click on the name of the font (not on the Download link). Then look for a Webfont Kit link on the menu bar. There, you can choose the WOFF format. If a font is available in only one format, the Webfont Kit menu bar choice will be absent. In that case, you can download another format, like TTF, then use FontSquirrel's Webfont Generator to upload the TTF and convert it to WOFF - choose the Expert radio button after you've uploaded the TTF version. In short, it may take some exploration to find the WOFF file you need.

See Fonts » Album to include a Google Font and/or WOFF file in your album.

Info: Linking to Originals

If you choose Link to originals in the main jAlbum settings (Album » Settings » Pages), your images will not be scaled or modified in any way. They will be used directly in the slide pages of the album. the skin will adjust the slide display to the visitor's viewport, but because the files have not been scaled, the file sizes may be very large, making this setting a poor choice for a web album. However, you can resize your images before using them in jAlbum, in which case choosing Link to originals might be suitable. If you also select HiDPI images, your original images will be shown at one-half their native dimensions, to preserve clarity on high-density displays.

If you choose Link to scaled-down images only, videos will be shown in their native dimensions, or to fit within the image bounds, or to fit within the visitor's viewport, whichever is smaller. If you choose Link to originals, videos will be shown in their native dimensions, or to fit within the visitor's viewport, whichever is smaller.

Info: HiDPI Images

High-density display devices, like Apple's retina displays, have twice the number of physical pixels (or more) within a given area, compared to regular devices. Images will appear sharper on these displays if they are larger, but displayed in half the CSS layout space. For example, an image that is 1200px wide is normally displayed in 1200 CSS pixels on a regular monitor, and is using 1200 physical pixels. But for a high-density device, it is better to provide an image that is 2400px wide, but then display it in 1200 CSS pixels on the monitor. When you do this, the display makes full use of the 2400 pixels that are available in the image, by using 2400 of its physical pixels.

jAlbum includes the option, under Settings » Images » General, of creating high-density thumbnails and/or slide images, referred to as HiDPI images. This doesn't actually produce images with a higher pixel density - there is no such thing. It simply produces images with double the image bounds - the skin, however, then displays these images in half the space.

Doing this may produce a better-looking image on a high-density monitor. The penalty is that the image files are typically several times the file size. They consume more bandwidth, taking longer to upload and longer to download when someone visits the site. The user with a regular monitor is forced to download much larger files, but gets no benefit from them.

The skin defaults to using HiDPI thumbnails, which produces better-looking thumbnails on high-density displays. Even on a regular monitor, these thumbnails look better when hovered, since the images are expanded when the visitor mouses over them. For thumbnails, this does produce larger files, but they're still relatively small, so the bandwidth penalty is minor.

Using HiDPI images is a different matter entirely. The bandwidth penalty is substantial, but the perceived improvement in display quality is not as dramatic as it is with small images like thumbnails. As the bandwidth available to your site visitors continues to grow, the greater use of bandwidth will become irrelevant. In addition, the skin does a lot of image preloading, so as a visitor moves through the slides, there will often be no delay, even with HiDPI images. Improving technology will eventually make this a non-issue, and you will be able to use HiDPI images in all your albums.

It should be noted that if the images you are adding to your project aren't fairly large to begin with, perhaps 3000x2000 pixels, there is no benefit to be gained by using HiDPI images, and there is no reason to choose that option. jAlbum can't interpolate, and produce more image information than what is present in the original images.

Recent jAlbum versions include the ability to produce albums with two sets of images, but the image display script used in this skin is not constructed to make use of them. In addition, a "2X variant" image in jAlbum is not handled the same way as a HiDPI image - the benefit of the greater density is lost.

If you want to provide HiDPI images to visitors with high-density monitors, but not penalize visitors with regular monitors, the only solution is to produce two copies of the album. Create your project and call it, for example, mydogLR (for "low resolution"), using image bounds that produce good-looking slides on a regular monitor (the skin defaults, for example). Accept the default settings - HiDPI thumbnails, but not HiDPI images. Upload your album to https://mysite.com/mydogLR/.

Now duplicate the entire project - click the down-arrow to the right of the project name in the jAlbum project panel, choose Duplicate Project, and call it mydogHR (for "high resolution"). In this duplicate project, choose HiDPI images, make the album, and upload it to https://mysite.com/mydogHR/.

Now you need to provide a steering script on your site, so that visitors will be directed to the appropriate album. Create a directory on your site called https://mysite.com/mydog/ and upload an index.html to it that contains the following:

<!DOCTYPE html>
<meta charset='UTF-8'>
<title>Redirect</title>
<script>
if(screen.width >= 768 && screen.height >= 768 && window.devicePixelRatio >= 2) {
	window.location = "http://mysite.com/mydogHR/";
} else {
	window.location = "http://mysite.com/mydogLR/";
}
</script>

All visitors can now be provided with a single link to your album: https://mysite.com/mydog/. The steering script will automatically direct visitors to the high resolution album if they are on anything the size of an iPad or larger, and have a high-density display. These are the visitors who can benefit from the larger slide images. Other visitors will be directed to the low resolution album.

Info: Version Updating

New versions of Venus are published with some regularity. These new versions generally include new features, improvements, and bug fixes. The jAlbum application will let you know when a new version is available, and users are encouraged to download and install the new version.

Info: Browser Support

Venus produces albums that display properly in most browsers.

Venus License

The Venus skin for jAlbum, including all supporting files, source code, compiled code, and scripts, ©2021, Jeff Tucker.

The skin uses the following open-source scripts:

You may use the software to create albums for personal or commercial sites. You may distribute copies of the software to others, but for any reuse or distribution, you must make clear to others the license terms of this software. You may modify the software for your own use.

The copyright holder reserves the right to waive or to withdraw any of these terms on a case-by-case basis.

The jAlbum application is free for personal use during the initial trial period, but after that, a Standard license is required. For commercial use, a Pro license is required. Visit the jAlbum site for further information.