Forums / Install & configuration / image problems

image problems

Author Message

Sagar Khushalani

Thursday 02 November 2006 9:38:33 am

hello
i'm having problems with my images on the website. i uploaded some images onto my website in a gallery, and they won't show. the php info shows GD is enabled. i also have imagemagick. roles and policies are fine. any ideas?

i'm using ezp 3.8.4.
the site is:
http://www.sagarkhushalani.com

also, look at the latest updates part on the toollist. the links are all messed up (the last updates were the images so...)

any help is appreciated.

Sagar Khushalani

http://www.sagarkhushalani.com

Claudia Kosny

Thursday 02 November 2006 11:02:26 am

Hi Sagar

Can you see the images in the admin view? If not most likely the permissions for the var/storage folder are not correct.
You can also manually check whether the images are uploaded correctly, they should be in the folder var/<site_access>/storage/images/ followed by a directory structure made out of node specific data.

If the images are visible in the admin view there is most likely something wrong with the template you use to display the images. Enable full debug output, empty the cache and try again. Any interesting info? If yes please post here.

You should have a look at the templates anyway because the template you use for latest updates seems to be not correct. No matter whether the image is there or not the a href should be closed. If there is an error with the image the innerHTML of the a tag might be empty but the closing tag should be there regardless.
Also I think that displaying what I assume to be the name of the picture both as a heading and as content-caption is not necessary for the latest update so I would do without one or the other in this listing.

Greetings from Luxembourg

Claudia

Sagar Khushalani

Thursday 02 November 2006 11:16:33 am

Hi Claudia
Thanks for your reply. If I go into my site admin, then into the folders where I have stored the pictures, click on the icon and click view, I can see them. Also if I do a direct URL to them:

http://www.sagarkhushalani.com/var/plain_site/storage/images/photography/shambhala_stupa/beautiful_colours/409-1-eng-GB/beautiful_colours.jpg

then I can see them. How do I enable full debug output? Sorry I'm sort of new to this.
I also noticed the latest updates. It seems to get worse everytime I clear the cache. Now my calendar is linked to the last image in the latest updates section. :'(

Thanks a lot
Sagar

>If the images are visible in the admin view there is most likely something wrong with the >template you use to display the images. Enable full debug output, empty the cache and try >again. Any interesting info? If yes please post here.

Sagar Khushalani

http://www.sagarkhushalani.com

Claudia Kosny

Thursday 02 November 2006 11:31:38 am

Hi Sagar

The easiest way to enable debug ouput is from the admin view. There you have a box for quick settings on the righthand side. There select your public site access and tick the checkboxes for debug output. The list of used templates might also be useful. Please note that due to caching you might have to empty the cache and reload the page to see all debug messages.

Please also post the template code you use for displaying the latest updates (if necessary limit it to the part with the pictures if it is very long). The problem with the calendar is just because the a tag is not properly closed. For a every opened <a href=...> there must be a closing <a/> tag which is missing in your template.

Claudia

Sagar Khushalani

Thursday 02 November 2006 11:44:10 am

well. there's no error debug output. i had all the outputs checked just in case.

here's the template code for the latest updates image.tpl:

{* Image - List item view *}
<div class="content-view-listitem">
<div class="class-image">
<h3>{$node.name|wash}</h3>
<div class="attribute-image">
<p>{attribute_view_gui attribute=$node.data_map.image image_class=listitem href=$node.url_alias|ezurl()}</p>
</div>
<div class="content-caption">
{attribute_view_gui attribute=$node.data_map.caption}
</div>
</div>
</div>

this is the slideshow gallery stuff:

{* Gallery - Full view *}
<div class="view-slideshow">
<div class="class-gallery">
{let page_limit=1
children=fetch_alias( children, hash( parent_node_id, $node.node_id,
offset, $view_parameters.offset,
limit, $page_limit ) )
list_count=fetch_alias( children_count, hash( parent_node_id, $node.node_id ) )}
{section show=$children}
<div class="content-view-children">
{section var=child loop=$children sequence=array(bglight,bgdark)}
{node_view_gui view=galleryslide content_node=$child parent_name=$node.name}
{/section}
</div>
{/section}
{include name=navigator
uri='design:navigator/gallery.tpl'
page_uri=concat( '/content/view', '/slideshow/', $node.node_id )
item_count=$list_count
view_parameters=$view_parameters
item_limit=$page_limit}
<div class="content-link">
<p>
<a href={$node.url_alias|ezurl}>Thumbnail view</a>
</p>
</div>
{/let}
</div>
</div>

Sagar Khushalani

http://www.sagarkhushalani.com

Claudia Kosny

Thursday 02 November 2006 12:23:26 pm

Hi Sagar

OK, since you sue attribute_view_gui to display the image attribute the actual display uses the template
\design\standard\templates\content\datatype\view\ezimage.tpl (or an override).

Here you can find the lines

    {section show=$href}<a href={$href}...{/section}
    {section show=and( is_set( $image ), $image )}
       ...{section show=$href}</a>{/section}
    {/section}

Move the first line within the second section

    {section show=and( is_set( $image ), $image )}
     {section show=$href}<a href={$href}...{/section}
       ...{section show=$href}</a>{/section}
    {/section}

This way you will at least have no problems with the links anymore as they are either not there at all or properly closed. Better yet replace the section with if as section is deprecated, but this is not necessary.

Reagrding the image problem itself: It looks like out of some reasons the different image sizes are not created on your system. If you call up attribute_view_gui with image_class=listitem, ez checks in the image.ini (or one of the append files) for the settings for image class. Then it creates the image using imagemagick or gd and stores it in the same folder as the original pic, just with the name of the image class appended. So you should have a picture
http://www.sagarkhushalani.com/var/plain_site/storage/images/photography/shambhala_stupa/beautiful_colours/409-1-eng-GB/beautiful_colours_listitem.jpg

So either the image.ini is wrong somehow or ez can not use your image program to convert the images (or I have the imaging system wrong which might well be...).

You can test the image.ini quite easily by removing all append files (just rename them) so the default settings from the main image.ini are used. Then use the imageclass=large instead of listitem, clear the cache and try again. If that does still not work, ez cannot access your image converter. First check the path to imagemagick in the image.ini. If that seems to be correct you have to ask your provider.

Claudia

Sagar Khushalani

Thursday 02 November 2006 12:45:39 pm

Claudia,

Well the link problem is solved, although they arent any links now (at least not all over the place).
However, I still cant figure out the image thing. I removed all the overrides for the image.ini but still no success. the default is set to large.

this is the ezimage.tpl:

{default image_class=large
css_class=false()
alignment=false()
link_to_image=false()
href=false()
target=false()
hspace=false()
border_size=0}

{let image_content=$attribute.content}

{section show=$image_content.is_valid}

{let image=$image_content[$image_class]}

{section show=$link_to_image}
{let image_original=$image_content['original']}
{set href=$image_original.url|ezroot}
{/let}
{/section}
{switch match=$alignment}
{case match='left'}
<div class="imageleft">
{/case}
{case match='right'}
<div class="imageright">
{/case}
{case/}
{/switch}

{section show=$css_class}
<div class="{$css_class|wash}">
{/section}

{section show=and( is_set( $image ), $image )}
<img src={$image.url|ezroot} width="{$image.width}" height="{$image.height}" {section show=$hspace}hspace="{$hspace}"{/section} style="border: {$border_size}px;" alt="{$image.text|wash(xhtml)}" title="{$image.text|wash(xhtml)}" />{section show=$href}</a>{/section}
{section show=$href}<a href={$href}{section show=and( is_set( $link_class ), $link_class )} class="{$link_class}"{/section}{section show=and( is_set( $link_id ), $link_id )} id="{$link_id}"{/section}{section show=$target} target="{$target}"{/section}>{/section}
{/section}

{section show=$css_class}
</div>
{/section}

{switch match=$alignment}
{case match='left'}
</div>
{/case}
{case match='right'}
</div>
{/case}
{case/}
{/switch}

{/let}

{/section}

{/let}

{/default}

Sagar Khushalani

http://www.sagarkhushalani.com

Sagar Khushalani

Thursday 02 November 2006 12:53:05 pm

oh i found this: design\standard\override\templates\thumbnail\image.tpl

<div class="content-view-thumbnail">
{attribute_view_gui attribute=$node.object.data_map.image image_class=small href=$node.url_alias|ezurl}
</div>

changed that to:
<div class="content-view-thumbnail">
{attribute_view_gui attribute=$node.object.data_map.image image_class=large href=$node.url_alias|ezurl}
</div>

but that didnt help either.

Sagar Khushalani

http://www.sagarkhushalani.com

Claudia Kosny

Thursday 02 November 2006 1:21:55 pm

Hi Sagar

Just adapt the links to wherever you want them although the way you have it now is not correct either. I meant to surround the image with the a tag whereas you put it after the image tag which is not correct. Just think about it before you change the template.
Here the single steps:
You want to display the image

<img src={$image.url|ezroot} width="{$image.width}" height="{$image.height}" {section show=$hspace}hspace="{$hspace}"{/section} style="border: {$border_size}px;" alt="{$image.text|wash(xhtml)}" title="{$image.text|wash(xhtml)}" />

Now you want to have a link on the image. That means you have to put the image inside a link tag. And since you might not always want a link you insert the link depending on whether there was a link target specified:

{section show=$href}
 <a href={$href}{section show=and( is_set( $link_class ), $link_class )} class="{$link_class}"{/section}{section show=and( is_set( $link_id ), $link_id )} id="{$link_id}"{/section}{section show=$target} target="{$target}"{/section}>
{/section}
<img src={$image.url|ezroot} width="{$image.width}" height="{$image.height}" {section show=$hspace}hspace="{$hspace}"{/section} style="border: {$border_size}px;" alt="{$image.text|wash(xhtml)}" title="{$image.text|wash(xhtml)}" />
{section show=$href}
 </a>
{/section}

Now you think that the image might not always be there and you want to display the html for the image only if there is a real image available.Therefore you put the code in an additional conditional statement:

{section show=and( is_set( $image ), $image )}
  {section show=$href}
    <a href={$href}{section show=and( is_set( $link_class ), $link_class )} class="{$link_class}"{/section}{section show=and( is_set( $link_id ), $link_id )} id="{$link_id}"{/section}{section show=$target} target="{$target}"{/section}>
  {/section}
  <img src={$image.url|ezroot} width="{$image.width}" height="{$image.height}" {section  show=$hspace}hspace="{$hspace}"{/section} style="border: {$border_size}px;"  alt="{$image.text|wash(xhtml)}" title="{$image.text|wash(xhtml)}" />
  {section show=$href}
    </a>
  {/section}
{/section}

{section show=$foo}
...
{/section}
is the deprecated version of
{if $foo}
...
{/if}
which works like a usual if condition. The code within such a condition is only executed if the condition evaluates to true (which it usually does if the variable has some content at all)

Regarding the image problem itself:
The default imageclass is only used if you do not specify another imageclass in the attribute_view_gui function. So make sure the imageclass parameter in the image.tpl (NOT in the ezimage.tpl you just posted) it set to large (for testing).

I have just seen that the image.ini.append.php in the override folder must be there to provide the path to imagemagick. On a windows machine this should look like this:

[ImageMagick]
IsEnabled=true
ExecutablePath=d:\imagemagick-6.2.6-q16
Executable=convert.exe

probably followed by some alias settings. So first make sure that the path is correct depending on wherever imagemagick is located on your server and enable the file again. Clear the cache and try again.

If you still don't get any image the permissions for the var/<site_access>/storage/images/ folder are wrong or ez is not allowed to use imagemagick or something else is happening that I don't have the slightest clue about. Unfortunately I cannot help you with any of these problems so good luck with troubleshooting...

Maybe (hopefully...) I have just missed a very simple reason for your problem but I really don't know any other possible reasons right now.

Good luck

Claudia

Sagar Khushalani

Thursday 02 November 2006 1:27:49 pm

Claudia,

Thanks alot. I'll try everything you've said. If it still doesnt work I'll just start over by reloading ezp and see what happens.

Thanks again,
Sagar

Sagar Khushalani

http://www.sagarkhushalani.com