Photo Album Beautifier Stack

Photo Album Beautifier Stack

style the built in Photo Album page

This stack allows you to style the built in Photo Album page, far beyond the possibilities of the theme you’re using. The Photo Album Beautifier stack works great on its own, but also works together seamlessly with the LightboxPlus stacks to turn a standard Photo Album page into a beautiful, responsive lightbox gallery.

New in version 1.5: you can now also choose to use an overlay on the images. See Demo #11 and Demo #12 for examples.

Demo
Visit the demo site to see the stack in action.

Usage
Method #1: Import a Photo Album page into a Stacks page with PlusKit (preferred)
  • Add a Photo Album Page, a Stacks page and a PlusKit page to your project.
    In Page Inspector > General of both the Photo Album Page and the PlusKit page disable Enabled and Show in Menu. Give both pages a meaningful name. I prefer to make the pages that are only used for importing into other pages with PlusKit subpages of the PlusKit page, but that’s up to you.
  • Add a Photo Album Beautifier Stack to the Stacks page.
  • Make sure that Album type is set to Gallery (not Slideshow!) in Page Inspector > Page > General on the Photo Album Page.
  • Import the Photo Album Page into the Stacks page.
    On the photo album page, add @import((PAGENAME)) in any styled text area, select the code and apply Format > Ignore Formatting.
Method #2: Import a Stacks page into a Photo Album page with PlusKit
  • Add a Photo Album Page, a Stacks page and a PlusKit page to your project.
    In Page Inspector > General of both the Stacks page and the PlusKit page disable Enabled and Show in Menu. Give both pages a meaningful name. I prefer to make the pages that are only used for importing into other pages with PlusKit subpages of the PlusKit page, but that’s up to you.
  • Add a Photo Album Beautifier Stack to the Stacks page.
  • Make sure that Album type is set to Gallery (not Slideshow!) in Page Inspector > Page > General on the Photo Album Page.
  • Import the Stacks page into the Photo Album page.
    On the photo album page, add @import((PAGENAME)) in the sidebar, select the code and apply Format > Ignore Formatting.
  • When combining this stack with a LightboxPlus Stack, select the option use with a LightboxPlus Stack and drag the LightboxPlus Stack into the dropzone at the bottom (fig. 1).
  • Bonus (unsupported!): you can use the stack's built in options for Background, Border, Margin and Padding to style the album description, but leave the Fill Mode on Fill.
With method #2, only the Photo Album description (and perhaps extracontent areas if available) can be used for content besides the actual gallery. Unfortunately, you cannot style or use links in the Photo Album description area, let alone use other content. That’s why I prefer to import the Photo Album page into a Stacks page, not vice versa.

Limitations

  • The stack does not work properly with Javascript turned off.
  • In Internet Explorer 9 and worse, the effects on hover don’t work (except opacity).

Support
Please use this form to report all issues, questions and comments.

This stack requires the Stacks plugin by YourHead (version 3 or higher).
Do you like this stack? Please consider leaving a review in the RapidWeaver Community’s Addons section [link].
LightboxPlus stack with a CollagePlus stack
fig. 1
Photo Album Beautifier Stack HUD
© 2012-2017 Marathia Web Design | Contact