Problems, need help? Have a tip or advice? Post it here.
12 posts Page 1 of 2
Hi, i have a problem using couch with top-up.js script for displaying photos on my site.
Top-up is basically very similar to any lightbox plugin, and i tought that it would be very easy to implement it with couch.

What i get is this strange behaviour in which photos in gif format are displayed correctly, and the ones in jpg are not.

Top up is used in this line:
<a href="<cms:show slikaVelika/>"><img src="<cms:show slikaMala/>"/></a>

where slikaVelika is big image(600x300) and slikaMala is small image(223x112).

I declared the template as clonable:
Code: Select all
<cms:template title='Slike' clonable='1'>
   <cms:editable name='slikaVelika'
                  crop='1'
                  width='600'
                  height='300'
                  type='image'
               />
   <cms:editable name='slikaMala'
                  crop='1'
                  width='223'
                  height='112'
                  type='image'
               />
</cms:template>


and then putting the <a href="<cms:show slikaVelika/>"><img src="<cms:show slikaMala/>"/></a> inside cms:masterpage tag.

When i put inside gif images it works ok, but with jpg it can't display the big image, instead it displays the smaller one again.
Thanks in advance!
Hi,

The code you provided seems to be ok.

Please try the following to debug this issue facing you -
Once the webpage showing the wrong image opens up in your browser, please see the source behind it that was generated by Couch.
The <a href="<cms:show slikaVelika/>"><img src="<cms:show slikaMala/>"/></a>
that you mentioned would have been converted to the real image sources.

Please verify that the image paths have been generated correctly.
This will give us a clue.

If you wish to, you may PM me your site's FTP/Couch creds along with exact details of the page displaying the problem and I can look into the problem first-hand.
Hi,

Thanks KK, for your quick reply as always.After some thinking i think this is my fault, not something in relation with couch.

What i have been doing is using one large image to populate the two image placeholders to work with top-up.js.I was thinking that by providing one large image and using crop would be enough for the gallery to work.

But it seems that timThumb script crops the big image and leaves it in small dimensions, so only the small image is displayed, in both the big and small variations.

My idea was that providing one image would be enough, it would be a big image(600x300) that would populate the big image placeholder, and the timThumb would crop it to fit the smaller size.

But instead, it crops the big image to a smaller one, and i'm only left with a small image in uploads folder.

My question is, is there a way for a client to use only one image(big one), and that the rest should be taken care by couch, so there is no need for clients to upload two images for any kind of lightbox(top-up) gallery to work?
Yes you can madebym. What you described is the purpose of the thumbnail editable region. Simply make these modifications to your 'slikaMala' editable region.

Before:
<cms:editable name='slikaMala' crop='1' width='223' height='112' type='image' />

After:
<cms:editable name='slikaMala' crop='1' width='223' height='112' assoc_field='slikaVelika' type='thumbnail' />

Your html should then work as intended:
<a href="<cms:show slikaVelika />"><img src="<cms:show slikaMala />" /></a>
I second cheesypoof's solution.

Post subject: Re: Displaying photos with top-up.js Reply with quote
Yes you can madebym. What you described is the purpose of the thumbnail editable region. Simply make these modifications to your 'slikaMala' editable region.

Before:
<cms:editable name='slikaMala' crop='1' width='223' height='112' type='image' />

After:
<cms:editable name='slikaMala' crop='1' width='223' height='112' assoc_field='slikaVelika' type='thumbnail' />

Your html should then work as intended:
<a href="<cms:show slikaVelika />"><img src="<cms:show slikaMala />" /></a>


Thank you for helping me, but something strange happened.Your solution worked fine, i changed the code, uploaded one big image, and both the thumbnail and the big version were displayed correctly.Also the big image was kept the original file size(43kb) in the uploads folder.

Then i tried to repeat the same process on more cloned images using the same image, just for example purposes, and then i only got the small image for both versions.
I looked into uploads folder, and there was only the cropped image(6kb) in there.No sign of the big image.

After that i uploaded a new big image, but it too gets croped, so i am left with only a small image.
Really don't understand why, given that it worked the first time?
Can you please paste in the entire template code?
Sure can.Here goes the template tag inside my gallery page.
Code: Select all
<cms:template title='Slike' clonable='1'>
   <cms:editable name='slikaVelika'
                  crop='1'
                  width='600'
                  height='300'
                  type='image'
               />
   <cms:editable name='slikaMala'
                  crop='1'
                  width='223'
                  height='112'
                  assoc_field = 'slikaVelika'
                  type = 'thumbnail'
                  
               />
</cms:template>


And here is where i use it in my gallery(galerija.php) page
Code: Select all
<cms:pages masterpage= 'galerija.php'>
            <p class="portfolio_item float alpha" href="#" style="float: left;">
               
                <a href="<cms:show slikaVelika/>"><img src="<cms:show slikaMala/>"/></a>
            </p>
            </cms:pages>
The code seems to be ok.
Could you please PM me your FTP/Couch creds?
And also perhaps point me to the exact page and images where the problem is cropping up.

Thanks
Thanks for the creds.

I had a look and uploaded an image named 'velika.jpg' (size 36KB) as the main image on one of the cloned pages. As expected, a thumbnail named 'velika-223x112.jpg' got created.

I used the same image in the other pages too and they all seem to be working fine.
In short - everything seems ok to me.
Please check and verify (try using 'velika.jpg' on some new pages).

Anyways, do let me know if you happen to run across the problem again.
12 posts Page 1 of 2