prettyPhoto and greybox extension

NigelShaw · Post by **NigelShaw** » Wed Jul 28, 2010 11:50 am

Hi,

i think im trying the impossible lol. 1st of all-

Greybox

the grey box extension is great but i want to try and get it to open the greybox from an image rather than text. any ideas how i can do this? the extension used is 'greybox browser'

PrettyPhoto

when adding a standard photo gallery, you can choose "lightbox" and then select "prettyPhoto" from the sub dropdown box.

i want to try and alter this so when i click a small image in a jQuery accordion side menu, it opens up a new image using prettybox. This it seems, is the bigger task at hand lol

can anyone give a little guidance or direction please?

many thanks

Nigel

BaconFries · Post by **BaconFries** » Wed Jul 28, 2010 12:23 pm

Hi Nigel when I made the "Greybox Browser" extension I just wrapped the script as it was using the text for onclick to display the greybox window....the "Greybox Gallery does use a thumbnail but this open a new image and not a new window as the greybox browser does to make it use a thumbnail instead of text it needs to be modified see the examples below

Greybox browser before

Code: Select all

<a href="http://www.google.com" title="Google" rel="gb_pageset[search_sites]">
<font style="font-size:20px;font-family:Ariel;text-decoration:none;font-style:normal;font-weight:normal;font-variant:normal" color=CC3300>Visit Google</font></a>

Greybox browser after

Code: Select all

<a href="http://www.google.com" title="Google" rel="gb_pageset[search_sites]"><img src="images/example.jpg" width="125" height="75" border="0" alt="MyPic" /></a>

If your are using the inbuilt jQuery accordion in WB then you can simply use the photogallery with a single image set it to use the lighbox/prettyPhoto then drag and drop the photogallery into the accordion panel you want to use the image in and on open of the accordion panel the image will be displayed and onclick will open in prettyPhoto..

NigelShaw · Post by **NigelShaw** » Wed Jul 28, 2010 12:39 pm

Hi,

nope, isnt computing in my brain today lol

Greybox.
how would i implement this? by using the extension and modifying it in properties? to clarify, i want to change the text to an image so when it is clicked, the greybox box opens and the desired web page is loaded.

prettyphoto.
how would i implement this? im trying to get a small image to open a larger 'different' image when clicked. if i can get it working, i can easily place it into the jquery object. its just getting the greybox & prettyphoto to work. I tried looking at making an extension but to be honest, the xsl was a little confusing for me this early in the day......

many thanks so far,

Nigel

BaconFries · Post by **BaconFries** » Wed Jul 28, 2010 1:08 pm

With the greybox you would need to do this manually in the HTML code it cannot be done in the extension itself...
Open the HTML code generated by WB in a HTML editor I use notepad++ for this you can use whatever you prefer...

In the HTML you would look for this:

Code: Select all

<a href="http://www.google.com" title="Google" rel="gb_pageset[search_sites]"> 
<font style="font-size:20px;font-family:Ariel;text-decoration:none;font-style:normal;font-weight:normal;font-variant:normal" color=CC3300>Visit Google</font></a>

And chage to this:

Code: Select all

<a href="http://www.google.com" title="Google" rel="gb_pageset[search_sites]"><img src="images/example.jpg" width="125" height="75" border="0" alt="MyPic" /></a>

Save and then upload to your server please that this would need to be done each time you wish this as it cannot be done in WB.

Drag the jQuery object in WB to page place were you wish it to be shown
Drag Photo Gallery to page open properties add/insert the image you wish set to lightbox/prettyPhoto close....

Expand the accordion section you wish to place the Photo Gallery into place were you wish in the opened section of the accordion ypu can npw preview click on the tab to open accordion it will slide open and the image you placed will be there click on image/photo and it will open in prettyPhoto...

NigelShaw · Post by **NigelShaw** » Wed Jul 28, 2010 1:57 pm

Hi Bacon

thanks for your advice. was hoping i could do something within WB. is there another similar lightbox type tool that will open a web browser? my reason for this is i have a link that re-directs users to our partner brand site but i dont want them to leave our site. i didnt want to open a new page as again, they leave the site. the greybox is great because you can use the browser and when closed, the site is still active.

i like the lightbox effect but a browser type would be collio

cheers

nigel

BaconFries · Post by **BaconFries** » Wed Jul 28, 2010 3:30 pm

Hi Nigel I cant promose anything definite but I will try to upload a version that uses a image instead of text sometime tonight or tomorrow....

NigelShaw · Post by **NigelShaw** » Wed Jul 28, 2010 4:55 pm

Hi,

that would be great (no promises lol )

i have sort of made one but the image that is selected doesnt stay proportionate and the link doesnt work either though the greybox does work....

nigel