Follow us on Twitter X-Cart on Facebook Wiki
Shopping cart software Solutions for online shops and malls

Greybox Smart Window v5.53 Implementation

 
Reply
   X-Cart forums > X-Cart 4 > Dev Questions
 
Thread Tools Search this Thread
  #1  
Old 11-05-2007, 06:01 AM
  chamberinternet's Avatar 
chamberinternet chamberinternet is offline
 

X-Wizard
  
Join Date: Sep 2005
Location: Lancashire, UK
Posts: 1,470
 

Default Greybox Smart Window v5.53 Implementation

Hello ...

This mod was inspired from Zaja (7Dana) who released the Lightbox JS v2.0 implementation.
Bascially it's a replacement of the detailed images popup to be displayed using Greybox rather than Thickbox.

More Info on Greybox: http://orangoo.com/labs/GreyBox/

Example of Implementation: http://www.onlinebearings.co.uk/205-litre-side-lever-barrel-pump-pr-16351.html

This mod has only been tested on v4.1.8 & v4.1.9

Install Instructions:

1)
Unzip the file and copy the greybox folder into the /skin1 directory.

2)
Open /skin1/greybox/gb_productpage.tpl and ensure the "GB_ROOT_DIR" variable is set to the the URL where the Greybox source files are located.
e.g.
Code:
var GB_ROOT_DIR = "http://www.yourdomain.com/skin1/greybox/files/";

3)
Open the /skin1/customer/main/product.tpl and find the following line:
Code:
{include file="modules/Detailed_Product_Images/popup_image.tpl"}

Straight after the above line add the following:
Code:
{include file="greybox/gb_productpage.tpl" }

4)
Within the same file (product.tpl), comment {* *} the following code (Located near the bottom):
Code:
{if $active_modules.Detailed_Product_Images ne "" && ($config.Detailed_Product_Images.det_image_popup ne 'Y' || $js_enabled ne 'Y')} <p /> {include file="modules/Detailed_Product_Images/product_images.tpl" } {/if}

Thats It...

Regards

Shafiq :sK
Attached Files
File Type: zip xc_greybox_4.1.9.zip (21.7 KB, 448 views)
__________________
Developing in 4.7.x now (Dipping into v5 - Slowly!)
Have used 4.1.x, 4.2.x, 4.4.x, 4.5.x, 4.6.x & 4.7.x
Multiple Instances of X-Cart
MySQL 5.6.37
CentOS 7.4


Chamber Internet
- Lancashire, United Kingdom
http://www.chamberelancs.co.uk
Reply With Quote
  #2  
Old 03-05-2008, 04:54 AM
 
donavichi donavichi is offline
 

X-Adept
  
Join Date: Apr 2004
Location: United Kingdom
Posts: 697
 

Default Re: Greybox Smart Window v5.53 Implementation

Awesome implementation. Thanks for doing that.

I needed this to work with 4.0 on one site so here's the only modifications I had to do to make to gb_productpage.tpl work with 4.0 branches:

replaced {lng.lbl_click_to_enlarge} with 'enlarge' - you could also add the lang variable if you wish.
replaced the second image href from 4.1 version to 4.0 version.
changed 'http://xcart/skin1/greybox/files/' to '{$SkinDir}/greybox/files/ - stops the 'unsecure page elements' warning in IE if your site uses http & https.

Here's the adapted gb_productpage.tpl - replace the one supplied in the 4.1 zip above to this and your 4.0 site will have a working greybox mod...

Code:
{if $images ne ""} {section name=image loop=$images} {if $images[image].avail eq "Y"} {if $images[image].tmbn_url} <div style="display:{cycle values="block,none,none,none,none,none"};"> <a href="{$images[image].tmbn_url}" title=" {$images[image].alt|escape}" rel="gb_imageset[detailed]">enlarge</a> </div> {else} <div style="display:{cycle values="block,none,none,none,none,none"};"> <a href="{$xcart_web_dir}/product_image.php?imageid={$images[image].imageid}" title="{$images[image].alt|escape}" rel="gb_imageset[detailed]">enlarge</a> </div> {/if} {/if} {/section} <script type="text/javascript"> var GB_ROOT_DIR = "{$SkinDir}/greybox/files/"; </script> <script type="text/javascript" src="{$SkinDir}/greybox/files/AJS.js"></script> <script type="text/javascript" src="{$SkinDir}/greybox/files/AJS_fx.js"></script> <script type="text/javascript" src="{$SkinDir}/greybox/files/gb_scripts.js"></script> <link href="{$SkinDir}/greybox/files/gb_styles.css" rel="stylesheet" type="text/css" /> {/if}
__________________
Best regards,

Donavichi.
- - -

Website Copywriting || Web Design || FAQs || Home & Garden Blog
Reply With Quote
  #3  
Old 03-05-2008, 08:14 AM
  chamberinternet's Avatar 
chamberinternet chamberinternet is offline
 

X-Wizard
  
Join Date: Sep 2005
Location: Lancashire, UK
Posts: 1,470
 

Default Re: Greybox Smart Window v5.53 Implementation

Cool ... Thanks for sharing this.

Shafiq :sK
__________________
Developing in 4.7.x now (Dipping into v5 - Slowly!)
Have used 4.1.x, 4.2.x, 4.4.x, 4.5.x, 4.6.x & 4.7.x
Multiple Instances of X-Cart
MySQL 5.6.37
CentOS 7.4


Chamber Internet
- Lancashire, United Kingdom
http://www.chamberelancs.co.uk
Reply With Quote
  #4  
Old 03-18-2008, 05:59 AM
 
Acquamarina Acquamarina is offline
 

X-Adept
  
Join Date: Aug 2006
Location: USA
Posts: 811
 

Default Re: Greybox Smart Window v5.53 Implementation

Hi,
Does it work with the CSS for the site? I would rather have a lighter color background like the examples on the Greybox site.
Thanks for sharing that - it is a great improvement from the 4.1.9 default which is "jittery" and not smooth at all.
__________________
Vera B
4.4.5
CFLSystems.com mods, Kosmos eBay Integration, Feed Manager Pro, custom mods, BCSEngineering Mods, CDSEO PRO
Hosting by EWDHosting - The best home for your x-cart.
Reply With Quote
  #5  
Old 03-18-2008, 06:04 AM
  chamberinternet's Avatar 
chamberinternet chamberinternet is offline
 

X-Wizard
  
Join Date: Sep 2005
Location: Lancashire, UK
Posts: 1,470
 

Default Re: Greybox Smart Window v5.53 Implementation

Haven't messed with with the css file supplied (gb_styles.css) but pretty sure you can change the colour of the background.

Regards

Shafiq :sK
__________________
Developing in 4.7.x now (Dipping into v5 - Slowly!)
Have used 4.1.x, 4.2.x, 4.4.x, 4.5.x, 4.6.x & 4.7.x
Multiple Instances of X-Cart
MySQL 5.6.37
CentOS 7.4


Chamber Internet
- Lancashire, United Kingdom
http://www.chamberelancs.co.uk
Reply With Quote
  #6  
Old 03-19-2008, 04:38 AM
 
Acquamarina Acquamarina is offline
 

X-Adept
  
Join Date: Aug 2006
Location: USA
Posts: 811
 

Default Re: Greybox Smart Window v5.53 Implementation

Thank you, I'll give it a try.
__________________
Vera B
4.4.5
CFLSystems.com mods, Kosmos eBay Integration, Feed Manager Pro, custom mods, BCSEngineering Mods, CDSEO PRO
Hosting by EWDHosting - The best home for your x-cart.
Reply With Quote
  #7  
Old 03-19-2008, 08:44 AM
 
Acquamarina Acquamarina is offline
 

X-Adept
  
Join Date: Aug 2006
Location: USA
Posts: 811
 

Default Re: Greybox Smart Window v5.53 Implementation

Followed the directions to a T and it looks great (when it works) but I now have both features and the GreyBox works on and off. The default x-cart and the GreyBox links appear one above the other.

Sometimes the "Enlarge for detail" link on GreyBox just takes you to the image itself, one has to hit the back button on the browser to go back to the product page.

It looks great in FireFox, but it is so wide in IE 7.0 that the close button is hidden and one has to scroll to the right to see it. It's frustrating for a visitor as the site is fluid and fits fine on my high resolution screen (1280x1024). Is there anyway to reduce the size of the navigation bar?


This is what the code in the product.tpl looks like after commenting out, please see if you see a mistake there:

{*{if $active_modules.Detailed_Product_Images ne "" && ($config.Detailed_Product_Images.det_image_popup ne 'Y' || $js_enabled ne 'Y')}
<br />
{include file="modules/Detailed_Product_Images/product_images.tpl" }
{/if}*}


I found this line further up:

{if $active_modules.Detailed_Product_Images ne "" && $config.Detailed_Product_Images.det_image_popup eq 'Y' && $images ne '' && $js_enabled eq 'Y'}
{include file="modules/Detailed_Product_Images/popup_image.tpl"}
{include file="greybox/gb_productpage.tpl" }

Then commented out the first portion and got this error:

Error: Smarty error: [in customer/main/product.tpl line 19]: syntax error: unexpected {elseif} (Smarty_Compiler.class.php, line 476) in /home/...../Smarty-2.6.12/Smarty.class.php on line 1095

Parse error: syntax error, unexpected T_ELSEIF in /home/......./var/templates_c/%%70^70F^70F20BF0%%product.tpl.php on line 40



Any suggestions?

Thanks so much - it looks fantastic! It will be even better when I get rid of the quirks.
__________________
Vera B
4.4.5
CFLSystems.com mods, Kosmos eBay Integration, Feed Manager Pro, custom mods, BCSEngineering Mods, CDSEO PRO
Hosting by EWDHosting - The best home for your x-cart.
Reply With Quote
  #8  
Old 07-08-2010, 10:15 AM
 
RahulNeo RahulNeo is offline
 

Member
  
Join Date: May 2010
Posts: 16
 

Default Re: Greybox Smart Window v5.53 Implementation

How to add this effect in buy now button in 4.1.9?Actually I want to open a new greybox which will say that item is added to cart.How to achieve this in buy now??
__________________
X Cart Gold 4.3.1
X Cart Pro 4.3.2
Reply With Quote
Reply
   X-Cart forums > X-Cart 4 > Dev Questions


Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT -8. The time now is 09:43 PM.

   

 
X-Cart forums © 2001-2020