Jump to Content

Objective HTML

Photo Frame

{your_field}

This method allows you to fetch photos from the database using the fieldtype tags. The fieldtype tags pre process all queries before the channel entries loops runs so the number of queries used in the template is a fraction of what it would be without these provisions. If you find your self need more robust sorting and filtering, use the module tags.

The basic concept behind the fieldtype tags is you have two ways to use it: with the tagdata and without. If you choose to use it as a tag pair, then will loop through the photos and give you access to all the variables. If you use it as a standard variable it would output a formatted HTML image tag.

Parameters

alt=

This parameter will add an alt attribute to the photo. This parameter is only valid if the single variable format is used.

{your_field alt="Some Alt"}

class=

This parameter will add an class attribute to the photo. This parameter is only valid if the single variable format is used.

{your_field class="some-class"}

directory=

This parameter will allow you to output photos from a subdirectory inside of the parent upload directory. So for instance, if you want to output a photo using a native file manipulation, you can define that actual directory name here. If you define a parameter, a new template variable will be available.


{your_photos directory="_medium"}
	{photo:_medium}
	{photo:_medium:url}
	{photo:_medium:file}
	{photo:_medium:file_name}
{/your_photos}

height=

This parameter will add a height attribute to the photo. This parameter is only valid if the single variable format is used.

id=

This parameter will add an if attribute to the photo. This parameter is only valid if the single variable format is used.

{your_field id="some-id"}

limit=

This parameter will limit the number of photos returned.

offset=

This parameter will offset the number of photo returned.

prefix=

This parameter will change the default prefix, which is "photo:".


{your_photos}
	{photo:file}	
	{photo:url}	
{/your_photos}

{your_photos prefix="var"}
	{var:file}	
	{var:url}	
{/exp:your_photos}

size=

This parameter will override the default variables with the information regarding the photo manipulation that is defined. So if you define "small" and have a valid "small" image manipulation if will override the default the variables with the "small" path and url.


{your_photos size="small"}
	{photo:file}	
	{photo:url}	
{/your_photos}

title=

This parameter will add an title attribute to the photo. This parameter is only valid if the single variable format is used.

{your_field title="Some Title"}

width=

This parameter will add a width attribute to the photo. This parameter is only valid if the single variable format is used.


Variables

count
The loop count starting at 1
index
The loop count starting at 0
total_photos
The total number of photos
is_first_photo
Is the loop iteration on the first photo. (Returns TRUE or FALSE)
is_last_photo
Is the loop iteration on the last photo. (Returns TRUE or FALSE)
site_id
The site id
field_id
The photo frame field id
entry_id
The parent entry id
order
The index representing the order of the photo
height
The photo's height
width
The photo's width
x
The X coordinate of the crop
x2
The X2 coordinate of the crop
y
The Y coordinate of the crop
y2
The Y2 coordinate of the crop
file
The server path of the framed photo
original_file
The server path of the original photo
file_name
The current name of the photo
original_file_name
The original name of the photo
title
The photo title
description
The photo description
your_directory
If you define a directory parameter, then the "your_directory" represents the value of the parameter. You would want to define this parameter if you want to use one of the native image manipulations which store the images in the subdirectories.
your_directory:url
This is the photo's url within the defined directory.
your_directory:file
This is the photo's server path within the defined directory.
your_directory:file_name
This is the photo's filename within the defined directory.
your_size
If you define a size parameter, this variable will be the value of that parameter and output the url of the photo of that size. So if you have a size called "small" this would be the variable.
your_size:url
The photo's url of the defined size.
your_size:file
The photo's server path of the defined size.
your_size:file_name
The photo's file name of the defined size.
your_size:height
The height of the defined photo size.
your_size:width
The width of the defined photo size.

Example


{your_photos alt="Some Alt" class="Some Class"}

{your_photos}
	{photo:title}
	{photo:description}
	{photo:file}
	{photo:file_name}
	{photo:original_file}
	{photo:original_file_name}
	{photo:original_url}
	{photo:small}
	{photo:small:url}
	{photo:small:file}
	{photo:small:file_name}
	{photo:small:height}
	{photo:small:width}
	{photo:is_first_photo}
	{photo:is_last_photo}	
	{photo:total_photos}	
	{photo:grand_total_photos}
{/your_photos}