I’ve been super naughty, staying up late, learning more about XSLT galleries than I care for. And for what? Well not just a bug fixed version of Scroll 0.1.3, but a new version 0.1.5 0.1.7 which includes the ability to change the gap between images. I’ve fixed the annoying unmentioned bug where the gallery is too big to fit across any size page (mixing 20px padding with 100% width-Doh!). 0.1.7 adds a cool menu bar (well it was there in 0.1.6, but that was seen only by a very small handful!)
However the big feature is something loads of people have asked for in a gallery… a Menu system…
Yep, that’s right, I’ve 5 menu places to add in your page links. I tried to do this before, but failed miserably. Just this time round I was in the zone a bit after figuring out more XSLT and got it to work.
Anyhow:
Updated for 0.1.7: Sample Gallery
0.1.7 also features more commented out code to fix height issues with landscape only height galleries. I’ve also fixed where ‘3rd Link’ should’ve read 3rd Page Name and put the link/name fields in the same box to tidy it up.
Big shout to Mark Sirota for his suggestions and bug testing on this.
Finally. If you want to add more menu items, I’ve included comments in the code on what to cut and paste. Remember to change where it says fifth to sixth with the pasted info and all will be fine. The comments are in both galleryMaker.xml and transformer.xslt.
If you use this gallery, please put a link to a sample gallery in the comments!
To install the gallery, you need to go to User/Library/Application Support/Adobe/Lightroom, (On XP got o C:Documents and SettingsUserApplication DataLightroom -Note that Application Data is a hidden folder, on Vista C:UsersUserAppDataRoamingAdobeLightroom ) where User is the name you log in with. Look for a folder called Web Galleries within. If it’s not there, create it yourself. Unzip the file into this folder and restart Lightroom.
The new Gallery will apppear in the Right Hand Panel, in the Galleries Pane.
I recommend that you create an alias/shortcut to this Lightroom folder for future use.
I really like this web template, but like kayoua, I want all my images to be the same height, and let the width be what it may. I don’t have much experience with the gallery templates, but am familiar with XML, so I took a crack at it.
Edit galleryMaker.xml, and make the following changes. If you’ve made changes to this file already, then the line numbers may not be the same.
First, on line 26, change width=”500″ to width=”2071″ (the maximum value for the slider).
(sorry for the strange formatting to come)
Next, replace line 378 with these two lines:
Finally, replace lines 415-424 with these lines:
As long as the width slider is set to a sufficiently large value, all images will be the same height. But, it still allows for a limit to be placed on the width if desired.
Hey arnaldo1 and Sean, where is the file transformer.xslt. I only see the golive and xml file in the folder.
Also if I change the image menu ‘gif’ color, will it change too?
-Kayoua
Worked perfect Sean. I didn’t even have to remove the Div tag. You are brilliant- Adobe should hire you! Thanks again!!!
Best -Arnaldo
In the transformer.xslt there is a section between 2 ul tags. Delete these and everything inbetween to remove the Menu. There is also a Div tag that contains it. You may need to remove that too.
Hi Sean! Your gallery ROCKS! It is working great for me. The only thing I wish I knew how to do is disable the menu area completely, so as to have a plain white background with only the images and scroll bar area visible.
http://www.arnaldovargas.com/
Please let me know if there is an easy way to do this!
Thanks again!
Arnaldo
It’s a little more complicated than that.
You need to find a javascript file that will disable the right click. Then search for the
section in transformer.xslt and include it there as. You’ll also need to include the file using aI did learn a little bit, but actually I don’t remember any of it. When I was using the ‘simple viewer’ from Picasa, I was told to just put in a code ‘right click = false’ that is not the exact code, but it was something like that.
I figure I might need to do something similar for this gallery in the galleryMaker.xml file. I just don’t know what is the code and where to put it exactly.
How much HTML do you know?
Thanks Sean, I did it and it worked! Do you know how I can disable the right click?
No, I said Lightroom applies the image size to both height and width,
If you edit the sizes part of galleryMaker.xml to a something like 600X400, it may keep a fixed height until you change the image size. When I figure out how to force a dimension I will add this to the gallery. As Lightroom need both a height and a width to work, I see no way how currently.
Did you say that there is a fixed height? From all of the web galleries I have seen on here, the horizontal images center themselves. Is there a way to get it fix so all the images will align at the top and bottom. If I put a vertical image next to a horizontal I want them to align from top to bottom. Let me know if there is a code I can use. Thanks!
This is a fantastic gallery! Thank you Sean!
But… I have two questions. Is it possible to fully remove the menu bar. and second, is there any way, as in earlier versions, to not see your copyright notice on the bottom?
I just want to be able to easily lay this scroll gallery into a frame on each page of my existing website for easy updates right from LR, so I need it to be very simple.
Please let me know.
Thanks!
Arnie
Wow, how nice.
I have been playing around with this for a while now, and like it alot, but 2 things would improve it to superior. I would like to be able to se the filenames, eg just under the photos, and the ability to change the font, For now I’m not able to see the Nordic characters, and it takes quite some brain to try to avoid them 😉
I like the concept of this gallery but since I have little or no experience with html I dont know how to setup the Menu links.I was able to do the links in your gallery index 1.1 Thank you for your great work….Ken
Sean,
Thanks very much, I like it a lot – extremely user-friendly. Keep it up!
http://www.markhout.com
I really like this. One note: I would like to see the same spacing on the left edge as in between each image. I also really like the way you added menu items with fill in boxes. Hats off. I look forward to seeing other web galleries with this!! Please. A Wish. I use Photoshops Bridge Horizontal Neutral web gallery a lot but as you know it is not available in Lightroom. It would be great to see it in Lightroom with the menu items added
Only HTML Galleries Mike.
For a small fee 😉
It was more about proof of concept Mike, and the code can be cut and pasted. It’s quite repetitious codewise. As will all of these galleries there’s a certain order to it:
First the code that defines the pages, then the code that lets you enter your own values, finally the code that binds them together in the galleryMaker.xml file. Then you need to call the results of the coding in the transformer.xslt. I’m not sure how much I commented on internally, but I’ve been adding more as I update. I’ll porbably only release one more update on this gallery with a proper menu bar.
Is there a way to add menu items like this to other galleries?
That will do it to an extent Tim.
I’ll also note that you can add ../eats/index.html etc,
to go up a gallery and back down to another one.
I really like this gallery. One question I have about modifying it.
The bottom space below the bottom scroll bar is quite large in my opinion. How can I get it smaller?
Increase the size of the image?
http://www.timbroyer.com/New/
thanks and keep up the great work.
Tim