X-Cart: shopping cart software

X-Cart forums (https://forum.x-cart.com/index.php)
-   Dev Questions (https://forum.x-cart.com/forumdisplay.php?f=20)
-   -   Lightbox JS v2.0 implementation (https://forum.x-cart.com/showthread.php?t=23858)

BizzyB 01-13-2007 05:03 AM

Re: Lightbox JS v2.0 implementation
 
Read this thread from first to last - sounds so good and can't wait to get this installed.

Hope I can get it up and running with my limited knowledge!

Many thanks.

TheMommyMarketplace 01-13-2007 11:19 AM

Re: Lightbox JS v2.0 implementation
 
Quote:

Originally Posted by Zaja
Amy, open thickbox_productpage.tpl and remove div’s around thumbnail images.


Zaja-Could you show me what it would look like? Here is my thickbox_productpage.tpl:

{if $images ne ""}
<div style="white-space:nowrap;color:#D90000;font-weight:bold;padding:2px;margin:10px 0 4px;">{$lng.lbl_detailed_images} &not;</div>
{section name=image loop=$images}
{if $images[image].avail eq "Y"}
{if $images[image].tmbn_url}
<div style="white-space: nowrap;padding-left:10px;"><a href="{$images[image].tmbn_url}" title="{$images[image].alt|escape}" class="thickbox" rel="[detailed]"><img src="{$images[image].tmbn_url}" width="75" style="border:0;" alt="{$lng.lbl_click_to_enlarge|escape}" /></a></div>
{else}
<div style="white-space: nowrap;padding-left:10px;"><a href="{$xcart_web_dir}/product_image.php?imageid={$images[image].imageid}" title="{$images[image].alt|escape}" class="thickbox" rel="[detailed]"><img src="{$images[image].tmbn_url}" width="75" style="border:0;" alt="{$lng.lbl_click_to_enlarge|escape}" /></a></div>
{/if}
{/if}
{/section}
{/if}

I took out the <div style="white-space: nowrap;padding-left:10px;"> and </div> both the 2nd & 3rd time they appear & everything went very wrong & thickbox stopped working altogether. Are those the "div's" you were talking about? I am completely new to this, so I can't even begin to figure out what's wrong. Thank you so much for your help!

eta-I tried it again & this time it doesn't seem to change anything. Thickbox is still working, but the thumbnails are still vertical.

Zaja 01-14-2007 03:36 AM

Re: Lightbox JS v2.0 implementation
 
Amy, thickbox_productpage.tpl:
Code:

{if $images ne ""}
<div style="white-space:nowrap;color:#D90000;font-weight:bold;padding:2px;margin:10px 0 4px;">{$lng.lbl_detailed_images} &not;</div>
<div style="display:inline;border:0;padding:2px;">
{section name=image loop=$images}
{if $images[image].avail eq "Y"}
{if $images[image].tmbn_url}
<a href="{$images[image].tmbn_url}" title="{$images[image].alt|escape}" rel="[detailed]"><img src="{$images[image].tmbn_url}" width="60" alt="{$lng.lbl_click_to_enlarge|escape}" /></a>
{else}
<a href="{$xcart_web_dir}/product_image.php?imageid={$images[image].imageid}" title="{$images[image].alt|escape}" rel="[detailed]"><img src="{$images[image].tmbn_url}" width="60" alt="{$lng.lbl_click_to_enlarge|escape}" /></a>
{/if}
{/if}
{/section}
</div>
{/if}
{*        adjust widht with following spacer  *}
<img src="{$ImagesDir}/spacer.gif" width="200" height="1" alt="" />


INPORTANT: Open skin1.css, find PImgBox class and remove width: 100px; property.

TheMommyMarketplace 01-14-2007 05:58 AM

Re: Lightbox JS v2.0 implementation
 
INPORTANT: Open skin1.css, find PImgBox class and remove width: 100px; property.[/quote]

Zaja-Thank you so much for your help. I don't have a line in my skin1.css titled PImgBox. When I search for "100", I have "border-bottom: 1px solid #86be6f; width: 100%;" and "position: absolute; z-index: 100". I have a custom skin--is that the problem?

Zaja 01-14-2007 06:12 AM

Re: Lightbox JS v2.0 implementation
 
No problem, simply ignore this instruction.

MattUK 01-20-2007 12:52 PM

Re: Lightbox JS v2.0 implementation
 
Quote:

Originally Posted by Zaja
Amy, thickbox_productpage.tpl:
Code:

{if $images ne ""}
<div style="white-space:nowrap;color:#D90000;font-weight:bold;padding:2px;margin:10px 0 4px;">{$lng.lbl_detailed_images} &not;</div>
<div style="display:inline;border:0;padding:2px;">
{section name=image loop=$images}
{if $images[image].avail eq "Y"}
{if $images[image].tmbn_url}
<a href="{$images[image].tmbn_url}" title="{$images[image].alt|escape}" rel="[detailed]"><img src="{$images[image].tmbn_url}" width="60" alt="{$lng.lbl_click_to_enlarge|escape}" /></a>
{else}
<a href="{$xcart_web_dir}/product_image.php?imageid={$images[image].imageid}" title="{$images[image].alt|escape}" rel="[detailed]"><img src="{$images[image].tmbn_url}" width="60" alt="{$lng.lbl_click_to_enlarge|escape}" /></a>
{/if}
{/if}
{/section}
</div>
{/if}
{*    adjust widht with following spacer  *}
<img src="{$ImagesDir}/spacer.gif" width="200" height="1" alt="" />


INPORTANT: Open skin1.css, find PImgBox class and remove width: 100px; property.


I used that code but thickbx stopped working, the thumbnails just linked to the large image .jpg rather than loading the image using AJAX

Also, another queston while I'm at it :)

How do you change/remove edit the 'Detailed images ╛' text that appears avove the thumbnails?

NightFire 01-20-2007 01:37 PM

Re: Lightbox JS v2.0 implementation
 
The detailed images text is controlled by your language label. You can edit your language label, or you can edit the file where it is controlled.

See the first two lines:

Code:

{if $images ne ""}
<div style="white-space:nowrap;color:#D90000;font-weight:bold;padding:2px;margin:10px 0 4px;">{$lng.lbl_detailed_images} &not;</div>


MattUK 01-21-2007 02:21 AM

Re: Lightbox JS v2.0 implementation
 
Thanks Nightfire - that worked fine :)
Anyone have any ideas on why the thickbox_productpage.tpl is linking to the .jpg though?

jamesh3 01-22-2007 11:14 PM

Re: Lightbox JS v2.0 implementation
 
Installed thickbox (see my config in sig). It works but it is missing a few bits that I have seen on other installs. How do I get the next link to appear in the box?
And to confirm I am using this mod the right way: I have moved my images from database to files. Images now are on xcart/images directory. I added the images for my product via detailed images, these now appear as links below my product thumbnail on the product detail page. Click on the link launches thickbox but I only get one image, description and a close link. No next link to the next image. ..that's the link I'm trying to get. Any help much appreciated.

Zaja 01-23-2007 03:06 AM

Re: Prev - Next navigation problem and fix
 
Sorry fellows, It's my fault.

To fix Prev - Next navigation problem open skin/thickbox/thickbox_productpage.tpl and replace:
[detailed] with: thickbox_detailed

or download updated mod from here.


All times are GMT -8. The time now is 08:36 PM.

Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.