Album module question: where are my hovering arrows with Lightbox? [solved]

[nicmare]

how can i switch to lightbox? just installed album module! thickbox is default viewer.

[halm]

sorry, I didn't realize 

Go to album admin (Content>Photo Albums) In the tab "Available Templates", import Lightbox.
In "Options" tab, set Lightbox as default template (you can also assign different templates to individual albums)

Check if hovering nav arrows appear by default, else apply the proper URLs to Lightbox tpl (you know that drill )

[nicmare]

ah, awesome. it works! thanks alot dude! but damn it! i have to set the css completely new for this template .
can you recommend another template? i dont want to import every template just for testing purposes.
i like thickbox because the big image appears very quickly without any animation.

[halm]

These are the ones I tried:

The three overlay-tpls (Light/Grey/Thickbox) are pretty much the same in principle, but with slight differences.

• Lightbox has the nifty arrows you want
• Greybox has the nav/titlebar on top of the screen
• Thickbox is a little faster than the others, but without any bling bling, text-based nav.

Pat's Picture Gallery makes a standard OS-type popup

Simple Separate Pages displays selected image large on top, photo list below - but with a separate page for each big picture. I'm sure it's very SEO friendly!

cMotion does pretty much the same, but all on the same page. Plus, it ups the bling factor with a moving strip of thumbs for navigation.

I haven't gotten the one called Image Gallery to work, so I wouldn't know what it does?

Then there's Recently Updated, Random Image and Categories, but I suppose they go without saying

[sn3p]

I have CMSMS 1.1.4.1 "Taga" installed with Album 0.9.2 (running on windows using WAMP).
Works like a charm, but i can't get the prev/next images to show up.

I've tried setting the path's Elijah sugested in a previous post and even tried setting them absolute.
Tested in FF2, IE6 & IE7.. cleared cache.. but nothing..

Code: Select all

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../templates/db/lightbox/images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../templates/db/lightbox/images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(http://localhost/cmsmadesimple/modules/Album/templates/db/lightbox/images/nextlabel.gif) right 15% no-repeat; }

Could the problem be in the lightbox.tpl?
I dont see any id or class attributes in the next/prev href, allthough it seems the css is applied (except for the next/prev backgrounds).

Code: Select all

{* Include JS files. You can move this to the head of your page template if you want *}
<!--Lightbox 2.0.2-->
<__script__ type="text/javascript" src="modules/Album/templates/db/lightbox/js/prototype.js"></__script>
<__script__ type="text/javascript" src="modules/Album/templates/db/lightbox/js/scriptaculous.js?load=effects"></__script>
<__script__ type="text/javascript" src="modules/Album/templates/db/lightbox/js/lightbox.js"></__script>
<__script__ language="javascript" type="text/javascript" src="modules/Album/templates/db/js/SMRcode.js"></__script>

{if $pictureid !=0}

{* Big Picture *}
<div style="text-align:center">
<p class="bigpicturecaption"><strong>{$picture->name}</strong><br />
{$picture->comment}<br />
<span class="bigpicturenav">
{if $link.picture.previous}<a href="{$link.picture.previous}" title="Previous picture">< Previous</a>{/if}
 <span class= "albumpicturecount">( Picture {$picturenumber}/{$picturecount} )</span> 
{if $link.picture.next}<a href="{$link.picture.next}" title="Next picture">Next ></a></span>{/if}
</p>
<a href="" onmouseover="SMR_setLink(this);" target="_blank"><img src="{$picture->picture}" alt="{$picture->name} - {$picture->comment}" onload="SMR_resize(this, {$max_image_size});" title="{$picture->name}  - {$picture->comment}" /></a>
</div>
{/if}

Anyone got a clue?
Thanks in advance.

[Dr.CSS]

The only thing missing is the next/prev images?...

The .../ usually won't work...

Can you put the full path url in the address bar and get them to show?...

[sn3p]

Everything works, except for the next/prev images that won't show up.

I tried setting all paths absolute in the css but still but no luck (the links work in address bar).

Code: Select all

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(http://localhost/cmsmadesimple/modules/Album/templates/db/lightbox/images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(http://localhost/cmsmadesimple/modules/Album/templates/db/lightbox/images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(http://localhost/cmsmadesimple/modules/Album/templates/db/lightbox/images/nextlabel.gif) right 15% no-repeat; }

Thanks for looking into it.

[Dr.CSS]

Have you checked the permissions on the images and folder?...

You could move the images to say uploads/images/litebox litebox being a new folder then call them from there...

[sn3p]

Have you checked the permissions on the images and folder?...

You could move the images to say uploads/images/litebox litebox being a new folder then call them from there...

I don't think it's a permissions issue, since i use windows. (don't have a clue how to set permissions on windows using WAMP).

But to be sure i tried uploading the images through the "Image Manager" in a new folder called lightbox and setting the paths (e.g. http://localhost/cmsmadesimple/uploads/ ... tlabel.gif) in lightbox.css, but still doesn't work.

P.S. is the lightbox.css imported in the database when installing the lightbox template (Import Template)?
Or is the file lightbox.css still being used?

Andre, thanks for your suggestions. I'll look into it!

[sn3p]

SOLVED!

In the apache_error.log i noticed 2 errors:

Code: Select all

[Mon Oct 15 18:45:23 2007] [error] [client 127.0.0.1] File does not exist: D:/cmsmadesimple/modules/Album/images/blank.gif, referer: http://localhost/cmsmadesimple/modules/Album/css/stylesheet.css
[Mon Oct 15 18:45:23 2007] [error] [client 127.0.0.1] File does not exist: D:/cmsmadesimple/modules/Album/css/modules, referer: http://localhost/cmsmadesimple/modules/Album/css/stylesheet.css

It apears i was editing the wrong css file (modules/Album/templates/db/lightbox/css/lightbox.css).. arghh!!!
This is the file to get things done outside CMSMS, but the Album module uses modules/Album/css/stylesheet.css.

A bit confusing bacause both css files have identical blocks of code.
I suggest deleting the lightbox.css in future releases, or atleast make a note in the documentation.

Thanks for the help guys!

[nicmare]

did u really import the lightbox.tpl and set it as default template??
i had exactly the same problem and was wondering about the missing arrows because thickbox was default template all the time!!!

[sn3p]

Lightbox was the default template all the time.
Anyway, the problem is solved (read post above).

sn3p