Carousel of Zodiac Heads

The new instal­la­tion of mon­u­men­tal sculp­tures in front of Robert­son Hall is the per­fect oppor­tu­nity to show off the Jet­pack plugin’s new Carousel fea­ture, which extends the Word­Press native gallery fea­ture with a pre­sen­ta­tion over­lay that dynam­i­cally expands to fill the entire browser window.

Below are pho­tographs of Ai Weiwei’s “Cir­cle of Animals/Zodiac Heads” that I took Thurs­day after­noon. A sec­ond gallery of close­ups and some basic instruc­tions for adding gal­leries follow.

The eas­i­est way to add a gallery is to drag mul­ti­ple images at the same time over to the image upload dia­log that pops up when you click the “Add media” but­ton. After click­ing the save but­ton, a Gallery tab appears. The Carousel fea­ture is not men­tioned in the Upload/Insert dia­log, but the fea­ture is auto­matic if Carousel is turned on under the Jet­pack options. There is also a con­fig­u­ra­tion option to dis­play embed­ded EXIF data.

Cre­at­ing more than one gallery in a sin­gle post is a bit of a pain. You have to cre­ate a sec­ond post, insert a gallery, set that post to pri­vate, pub­lish it, take note of the post ID num­ber, go back to the first post and insert the gallery short code, but ref­er­ence that ID num­ber. Edits to the sec­ond gallery must be done in that other post.
Exam­ple, [gallery link="file" id="763"]

Because the Fan­cy­box plu­gin is also active on the pub­lished site, when you close the gallery over­lay, you then have to close the Fan­cy­box popup, which is a bit annoy­ing. If you want to use Fan­cy­box for indi­vid­ual images, but Carousel for gal­leries, you have to add a cus­tom jQuery selec­tor to the Fan­cy­box set­tings. Go to Set­tings → Fan­cy­box for WP and click on the “Gal­leries” tab. Select “Use a cus­tom expres­sion to apply Fan­cy­Box” and paste the fol­low­ing line of code into the textarea and save changes:
jQuery('a:has(img)[href$=".jpg"]:not("dt.gallery-icon > a")').addClass("fancybox").attr("rel","fancybox").getTitle();

I use the “Title” field for the Carousel cap­tions instead of the “Cap­tion” field because I don’t like the way the Cap­tion field dis­plays in the thumb­nail grid.

We ask that you resize your images before upload­ing them to your Word­Press site; oth­er­wise, you will quickly fill up your sites’s stor­age quota. For exam­ple, a raw 8-megapixel image from the iPhone 4S is about 3 to 3.5 megabytes. The same image when resized to 1280 by 960 pix­els and saved using Photoshop’s Save for Web dia­log (50% qual­ity JPEG) is around 200 kilobytes.

You must log in to post a comment.