Link to external site from smoothgallery image

388 Posts

Terry Reply #1, 16 years, 8 months ago

Hi all!

I’m trying to create a slide show where each image has link to an external site. I’m almost there!

The gallery and the external URL links are working. However, I want the links to open in a new window. I’ve added target="blank" as shown here in my custom gallerypicturetpl file.

<a target="blank" href="[+maxigallery.picture.descr+]" title="link to [+maxigallery.picture.descr:htmlent+]" alt="link to [+maxigallery.picture.descr:htmlent+]" class="open"></a>

However, this is getting stripped so the link open but not in a new window/tab.

Although less important right now, the alt tag I added is also not working. I found this reference that suggest it should work. http://modxcms.com/forums/index.php/topic,40353.0.html

I suspect these are related issues?

Any suggestions?

www.terrybarthdesign.com

2,310 Posts

bunk58 Reply #2, 16 years, 8 months ago

Shouldn’t that be :

target="_blank"

388 Posts

Terry Reply #3, 16 years, 8 months ago

Bunk58

Yes, of course, thank you. Unfortunately, that’s not the problem.

The code never makes it out of the chunk it’s being stripped out somewhere--as is the alt tag.

Still stuck. . .

Terry

www.terrybarthdesign.com

4,213 Posts

doze Reply #4, 16 years, 8 months ago

Could you post your full setup... you possibly have something else going on than the attributes being stripped out. Maybe you are looking for a wrong document or you are defining a wrong chunk to use as the template.

"He can have a lollipop any time he wants to. That's what it means to be a programmer."

388 Posts

Terry Reply #5, 16 years, 8 months ago

Doze, thank you.

modx 1.0.2
maxigallery 0.5.2

Here’s my snippet call:

[[MaxiGallery? &display=`embedded` &embedtype=`smoothgallery`  &galleryPictureTpl=`terrysgallerypicturetpl` &max_pic_size=`150` &smoothgallery_width=`150` &smoothgallery_height=`150` &smoothgallery_timed=`true` &smoothgallery_fadeDuration=`1600` &smoothgallery_delay=`3900` &smoothgallery_showInfopane=`false` &smoothgallery_showCarousel=`false` &smoothgallery_showArrows=`false` &gal_query_ids=`all`  &order_by=`random` ]]

Here’s my tpl chunk:

[+maxigallery.embedtype:is=`smoothgallery`:then=` 
	<div class="imageElement">
	<h3>[+maxigallery.picture.title:htmlent+]</h3>
	<p>[+maxigallery.picture.descr:htmlent+]</p>
	<a target="_blank" href="[+maxigallery.picture.descr+]" title="link to [+maxigallery.picture.descr:htmlent+]" alt="link to [+maxigallery.picture.descr:htmlent+]" class="open"></a>
	<img src="[(base_url)][+maxigallery.path_to_gal+][+maxigallery.picture.filename+]" class="full" />
	<img src="[(base_url)][+maxigallery.path_to_gal+]tn_[+maxigallery.picture.filename+]" class="thumbnail" />
	</div>
`+]

[+maxigallery.embedtype:isnot=`smoothgallery`:then=`
 
<li>
[+maxigallery.embedtype:is=`slidebox`:then=` 

  <a href="[(base_url)][+maxigallery.path_to_gal+][+maxigallery.picture.filename+]" rel="lightbox_[+maxigallery.path_to_gal+]gallery">

`+]

[+maxigallery.embedtype:is=`lightboxv2`:then=` 

	<a href="[(base_url)][+maxigallery.path_to_gal+][+maxigallery.picture.filename+]" rel="lightbox[maxigallery]" title="[+maxigallery.picture.title:htmlent+] - [+maxigallery.picture.descr:htmlent+]">

`+]

[+maxigallery.embedtype:is=`slimbox`:then=` 

	<a href="[(base_url)][+maxigallery.path_to_gal+][+maxigallery.picture.filename+]" rel="lightbox[maxigallery]" title="[+maxigallery.picture.title:htmlent+] - [+maxigallery.picture.descr:htmlent+]">

`+]

[+maxigallery.embedtype:is=`popup`:then=` 

	<a href="javascript:void(0);" onClick="javascript:openWindow('[(base_url)][+maxigallery.path_to_gal+][+maxigallery.picture.filename+]','[+maxigallery.picture.title:htmlent+]',[+maxigallery.picture_height_normal+],[+maxigallery.picture_width_normal+],'gallery');">

`+]

[+maxigallery.embedtype:is=`external`:then=` 

	<a href="[(base_url)][+maxigallery.path_to_gal+][+maxigallery.picture.filename+]" rel="external">

`+]

[+maxigallery.embedtype:is=``:then=`
	
	<a href="[+maxigallery.picture.descr+]">

`+]
	
	 	<img src="[(base_url)][+maxigallery.path_to_gal+]tn_[+maxigallery.picture.filename+]" class="thumbnail" title="[+maxigallery.picture.title:htmlent+] [+maxigallery.strings.click_to_zoom+]" alt="[+maxigallery.picture.title:htmlent+] [+maxigallery.strings.click_to_zoom+]" />
	
	</a>
	[+maxigallery.picture.title:isnot=``:then=`
		<p style="width: [+maxigallery.picture_width_thumb+]px;">
		[+maxigallery.picture.title:htmlent+]
		</p>
	`+]
</li>
`+]

Anything else you’d like to see?

Thank you so much!

Terry

www.terrybarthdesign.com

4,213 Posts

doze Reply #6, 16 years, 8 months ago

Ok, so you are using SmoothGallery. The SmoothGallery javascript creates the link by itself in js code, so you need to modify that if you want the link to open in external window and have the title. Btw, I believe that links should have title attributes and not alt attributes.. alt attributes are for images.

See /assets/snippets/maxigallery/smoothgallery/js/jd.gallery.js and the lines around 107, 160 and 560.

"He can have a lollipop any time he wants to. That's what it means to be a programmer."

388 Posts

Terry Reply #7, 16 years, 8 months ago

Doze

I think got it. Don’t know the first thing about js but I took a shot and it seems to be working. This is the section where I added the targe="_blank". Not the same as the line #s you mentioned (don’t have 560 lines).

Starting on line 92

if (this.options.embedLinks)
{
this.currentLink = new Element(’a’).addClass(’open’).setProperties({
href: ’#’,
target: ’_blank’,
title: ’’
}).injectInside(element);

Seems to be working. Anything else I should know/do?

www.terrybarthdesign.com

4,213 Posts

doze Reply #8, 16 years, 8 months ago

No, that’s fine.. It’s the same place, but I guess you are using MaxiGallery v0.5.2.. the v0.6 test version has a newer version of SmoothGallery. You might want to update to that version, it got alot of fixes in it..

"He can have a lollipop any time he wants to. That's what it means to be a programmer."

388 Posts

Terry Reply #9, 16 years, 8 months ago

Thank you so much!

www.terrybarthdesign.com