Getting the image dimensions in smarty

manuel · **Joined:** Fri Nov 30, 2007 9:15 am **Posts:** 329

Using the height and width of the images and thumbnails in your gallery templates should be pretty straightforward, not? Well i guess it wasn't... Until now!

Note: the codes below are supposed to be located inside the main "foreach" in your gallery template!

Code:

{foreach from=$images item=image}

1. How can we get the image sizes using a php modifier?

We use the getimagesize modifier for this:

Code:

{$image->file|getimagesize}

This returns an Array containing all necessary information:

Code:

Array ( [0] => 385 [1] => 100 [2] => 2 [3] => width="385" height="100" [bits] => 8 [channels] => 3 [mime] => image/jpeg ) 1

ps: you can see the contents of the array generated by the "getimagesize modifier" by using:

Code:

{$image->file|getimagesize|@print_r}

2. Getting the values out of the array and storing them in variables.

Below you will find the "cut and paste" code that will provide you with separate variables for the height and width of your full size images in the gallery module.
(change the "i" variable, the "getimagesizeval" and change "$image->file" to "$image->thumb" for the thumbnail sizes)

Code:

{assign var="i" value=0}
{foreach from=$image->file|getimagesize item="image"}
{assign var="i" value=$i+1}
{capture assign="getimagesizeval"}getimagesizeval{$i}{/capture}{capture assign="$getimagesizeval"}{$image}{/capture}
{/foreach}

If you have correctly placed the code above inside of the main foreach loop in your gallery template, this will result in the following variables being available to use in your templates:

Code:

getimagesizeval1 = 385
getimagesizeval2 = 100
getimagesizeval3 = 2
getimagesizeval4 = width="385" height="100"
getimagesizeval5 = 8
getimagesizeval6 = 3
getimagesizeval7 = image/jpeg

If you have something to share, please don't hold back!
You can also find this article on the i-do-this blog:
http://www.i-do-this.com/blog/49/Getting-the-image-dimensions-in-smarty

Greetings,
Manuel

FletcherT · **Joined:** Tue Jul 26, 2011 8:00 pm **Posts:** 3

I'm slowly picking up the language. I've been trying to figure out how to store the in variables, until now! Hah. Thanks so much.

manuel · **Joined:** Fri Nov 30, 2007 9:15 am **Posts:** 329

Hi FletcherT,

Glad it helped you out!

You can find the official documentation on "assign" here:
http://www.smarty.net/docs/en/language.function.assign.tpl

The most important tips for someone new to smarty (i can think of) is to use {$yourvariable|@print_r} to find out the contents of the various variables and to use {get_template_vars} on your pages to find out the full list of available variables.

Greetings,
Manuel

manuel · **Joined:** Fri Nov 30, 2007 9:15 am **Posts:** 329

To use this with custom Field Definitions in the News module you have to capture the full URL first as the custom Field Definitions are "Files", not "Images"...

(ps: "achtergrond_afbeelding" is the name of the custom Field Definition, replace that with your own...)

Code:

{capture assign="bgimg"}{$entry->file_location}/{$entry->achtergrond_afbeelding}{/capture}
{assign var="i" value=0}
{foreach from=$bgimg|getimagesize item="image"}
{assign var="i" value=$i+1}
{capture assign="getimagesizeval"}getimagesizeval{$i}{/capture}
{capture assign="$getimagesizeval"}{$image}{/capture} {/foreach}

Greetings,
Manuel

brutusmaximus · **Posted:** Wed Apr 10, 2013 9:46 am

The tutorial is nice, but it didn't work out for me. It only outputted the the names of the vars instead of the values. Below the code that worked out for me. I added extra comments for (smarty beginners).

Code:

{capture assign="bgimg"}uploads/{$item->imgSrc}{/capture}
            
// Start 'counter' var with value 0
{assign var="i" value=0}

// Start loop 
{foreach from=$bgimg|getimagesize item="image_attr"}

    // Increment var i + 1 (value of i is now: 1)
    {assign var="i" value=$i+1}

    // capture image attribute values
    {capture assign="imgAttrValue"}{$image_attr}{/capture}

    // assign values to imgAttrName$i 
    //($i will be replaced with number of i)
    {assign var="imgAttrName$i" value="$imgAttrValue"}

{/foreach}

// use following vars
{$imgAttrName1}
{$imgAttrName2}
{$imgAttrName3}
{$imgAttrName4}
{$imgAttrName5}
{$imgAttrName6}
{$imgAttrName7}

manuel · **Joined:** Fri Nov 30, 2007 9:15 am **Posts:** 329

Dear brutusmaximus,

Please take a look at the article, Calguy1000 pointed out we could use php functions instead of php modifiers so i've made some serious changes to the article:
http://www.i-do-this.com/blog/49/Getting-the-image-dimensions-in-smarty

(might need to hit Ctrl+F5 to refresh)

Greetings,
Manuel

Getting the image dimensions in smarty

Who is online