[SOLVED]Gallery extra field: How to use it for external URL?

[jakovbak]

Helo everyone!
Latest CMSMS, latest Gallery module, using customized PrettyPhoto template.
Trying to add an extra field which contains working link to external URL. It supposed to be placed below an album image thumbnail (it's a 'portfolio' and images of websites I have created over the years should have direct link to corresponding sites, I don't want one to write or copy/paste URL's to see the live website).
It seems HTML is not allowed in extra fields so there must be some other way to do it. My guess is - getting the URL from specific extra field via gallery template. But I'm a designer and I don't know anything about that kind of coding...
Many thanks in advance for any kind of pointing me to the right direction!
Jakovbak

[mel]

Hi,
I use in my template
title="{$image->comment|cms_escape:htmlall}">

Just replace title/comment with your own field.

Good luck.
Mel

[jakovbak]

Hi Mel!
Thanks for advice! Tried but failed thou...
Guess it's because my lack of knowledge when it comes to php or smarty coding. Anyway, this is where I came to:

This is my Extra field called "weblink":

Code: Select all

<div id="weblink"><a href="http://www.somedomain.com">Visit site</a></div>

And this is the frame for image in album, a part of template:

Code: Select all

<div class="imageframe">
	<div class="img">
	{if $image->isdir}
		<a href="{$image->file}" title="{$image->titlename}"><img src="{$image->thumb|escape:'url'|replace:'%2F':'/'}" alt="{$image->titlename}" /></a><br />
	{$image->titlename}
	
	{else}
   <a class="group" href="{$image->file|escape:'url'|replace:'%2F':'/'}" 

title="{$image->fields.weblink|cms_escape:htmlall}" 

rel="prettyPhoto[{$galleryid}]"><img src="{$image->thumb|escape:'url'|replace:'%2F':'/'}" alt="{$image->titlename}" /></a>
	{/if}
	</div><!-- end .img -->
</div><!-- end .imageframe -->

I have divided with line breaks your code line with my customization so you can easily see where it is.
I have styled #weblink with CSS but it won't show. So, either the placing is wrong or I've messed up the entire code somewhere but I can't find what or where went wrong!
If you would be so kind and take a look at this maybe you'll figure it out...

Thanks again and have a nice day!
Jakov

[velden]

From the gallery help:

The Gallery module allows defining numerous custom fields. A custom field can belong to a subgallery or to an image.
Gallery-related fields can be called directly in the gallerytemplate with {$fields.your_field_alias.name} and {$fields.your_field_alias.value}. You could also create a foreach loop on {$fields}.
Image- and subgallery-related fields can be called within the images foreach loop in the gallerytemplate with {$image->fields.your_field_alias.name} and {$image->fields.your_field_alias.value}

In your case I quess it would become

Code: Select all

...
src="{$image->thumb|escape:'url'|replace:'%2F':'/'}" alt="{$image->titlename}" /></a>

<div id="weblink"><a href="{$image->fields.weblink.value}">Visit site</a></div>

   {/if}
   </div><!-- end .img -->
...

[jakovbak]

Btw, if I use

title="{$image->comment|cms_escape:htmlall}"

instead of my code

title="{$image->fields.weblink|cms_escape:htmlall}"

then desired link is shown in single image call which is great solution to the feature I've been looking for weeks! Finally I gave up on it but then you reminded me to try again with your solution!
But I would still like to show those links below certain images...

Tnx and regards!
Jakov

[jakovbak]

Hello Velden!
I've tried your solution but it's not quite working. If I put

<div id="weblink"><a href="{$image->fields.weblink.value}">Visit site</a></div>

in template, then it makes visible "Visit site" under each and every image in album, no matter if there is or isn't and extra field attached to an image. And of course, all of those "Visit site" - links are pointing to same URL.
So, my guess is, your suggestion could be an idea how to approach to this problem but obviously needs some changes in code. Obviously, I'm not the man for the job thou...
But we're getting closer to the working solution thanks to good people!
Tnx and have a nice day!

[velden]

Well, it depends on whether you've attached your field to a galleries or to images. I guess images else the field would not exist ($image->fields.weblink)

You can check for a value and only if it exists show the link.

Code: Select all

{if $image->fields.weblink.value}
<div id="weblink"><a href="{$image->fields.weblink.value}">Visit site</a>
{/if}

However I don't understand why all links point to the same url.

Further I don't exactly understand what you mean by

It supposed to be placed below an album image thumbnail

Maybe a link to the site would clarify that.

[jakovbak]

I'll send you a PM with link and details...

[velden]

Got a PM but is says:

This message has been removed by its author before it was delivered.

[jakovbak]

I've messed something up... Sent again, this time should be delivered!

[jakovbak]

Hello again!
Thanks to velden, this topic is now successfully solved! He did a really great job and here's what we came up with:

1) In Gallery module Image Custom Field must be defined as "type=Text area";

2) In this example Custom Field is named "weblink" (without quotes);

3) URL you wish to use in Custom field must be formatted as plain URL, for example: http://www.somedomain.com

4) For easy styling, Custom Field is wrapped in <div id="weblink"></div>;

5) Part of the PrettyPhoto template you are using in Gallery module should now look like this (starting from {else}, the rest is irrelevant for this, comments are included)

Code: Select all

{else}

  {* clear variables *}
  {assign var='weblink_value' value=''}
  {assign var='weblink_div' value=''}
  
  {* capture value of $image->fields.weblink.value and put it in variable $weblink_value*}
  {capture name='weblink' assign='weblink_value'}{$image->fields.weblink.value}{/capture}
  
  {* if exists/contains value $weblink_value *}
  {if $weblink_value}
  
    (* then create a new variable $weblink_div containing the div, anchor url etc *}
    {capture name='weblinkdiv' assign='weblink_div'}<div id="weblink"><a href="{$weblink_value}">Visit site</a></div>{/capture}
  
  {/if}       
         {* print a decode version of the $weblink_div variable in the title attribute of this anchor. Will be used in the image popup if exists *}
         <a class="group" href="{$image->file|escape:'url'|replace:'%2F':'/'}" title="{$weblink_div|cms_escape:htmlall}" rel="prettyPhoto[{$galleryid}]"><img src="{$image->thumb|escape:'url'|replace:'%2F':'/'}" alt="{$image->titlename}" />
         </a>
   
      {* print contents of $weblink_div for url below thumbnail*}   
      {$weblink_div}

      {/if}

That's it!
Thanks again velden!
Best regards folks!