xGallery Shortcodes

[teaser]Making galleries with shortcodes has a few advantages. First, you’re already learning shortcodes for everything else, why use a different method for galleries? But most important: when they are shortcodes rather than a page type you can put then anywhere and mix them with any other page layout you create. We have gallery shortcodes which allow you to determine any amount of colums, spacing between columns/rows, and whether or not the images should have a border effect. Each thumb can lightbox a video (youtube or vimeo), or an image.[/teaser]

[line]
[h4]Five Column Example[/h4]

[lightbox_gallery columns=”5″ spacing=”18″ border=”yes”]
[gal_item title=”Image One” thumb=”{THEME_ROOT}/images/preview/200×200-1.jpg”]{THEME_ROOT}/images/preview/large-img-1.jpg[/gal_item]
[gal_item title=”Video Example” thumb=”{THEME_ROOT}/images/preview/200×200-2.jpg”]http://www.youtube.com/watch?v=XSGBVzeBUbk[/gal_item]
[gal_item title=”Another Video” thumb=”{THEME_ROOT}/images/preview/200×200-3.jpg”]http://vimeo.com/1084537[/gal_item]
[gal_item title=”Image Example” thumb=”{THEME_ROOT}/images/preview/200×200-4.jpg”]{THEME_ROOT}/images/preview/large-img-2.jpg[/gal_item]
[gal_item title=”Another Image” thumb=”{THEME_ROOT}/images/preview/200×200-5.jpg”]{THEME_ROOT}/images/preview/large-img-3.jpg[/gal_item]
[/lightbox_gallery]

[toggle_box title=”See The Shortcodes”]
[code_table]
[code_line][lightbox_gallery columns=”5″ spacing=”18″ border=”yes”][/code_line]
[code_line][gal_item title=”Title” thumb=”thumb-url”]large-image-or-video-url[/gal_item][/code_line]
[code_line][gal_item title=”Title” thumb=”thumb-url”]large-image-or-video-url[/gal_item][/code_line]
[code_line][gal_item title=”Title” thumb=”thumb-url”]large-image-or-video-url[/gal_item][/code_line]
[code_line][/lightbox_gallery][/code_line]
[/code_table]
[/toggle_box]

[line]
[h4]No Border Example[/h4]

[lightbox_gallery columns=”5″ spacing=”18″]
[gal_item title=”Image One” thumb=”{THEME_ROOT}/images/preview/200×200-1.jpg”]{THEME_ROOT}/images/preview/large-img-1.jpg[/gal_item]
[gal_item title=”Video Example” thumb=”{THEME_ROOT}/images/preview/200×200-2.jpg”]http://www.youtube.com/watch?v=XSGBVzeBUbk[/gal_item]
[gal_item title=”Another Video” thumb=”{THEME_ROOT}/images/preview/200×200-3.jpg”]http://vimeo.com/1084537[/gal_item]
[gal_item title=”Image Example” thumb=”{THEME_ROOT}/images/preview/200×200-4.jpg”]{THEME_ROOT}/images/preview/large-img-2.jpg[/gal_item]
[gal_item title=”Another Image” thumb=”{THEME_ROOT}/images/preview/200×200-5.jpg”]{THEME_ROOT}/images/preview/large-img-3.jpg[/gal_item]
[/lightbox_gallery]

[toggle_box title=”See The Shortcodes”]
[code_table]
[code_line][lightbox_gallery columns=”5″ spacing=”18″][/code_line]
[code_line][gal_item title=”Title” thumb=”thumb-url”]large-image-or-video-url[/gal_item][/code_line]
[code_line][gal_item title=”Title” thumb=”thumb-url”]large-image-or-video-url[/gal_item][/code_line]
[code_line][gal_item title=”Title” thumb=”thumb-url”]large-image-or-video-url[/gal_item][/code_line]
[code_line][/lightbox_gallery][/code_line]
[/code_table]
[/toggle_box]

[line]
[h4]Four Column Example[/h4]
[lightbox_gallery columns=”4″ spacing=”30″ border=”yes”]
[gal_item title=”Image One” thumb=”{THEME_ROOT}/images/preview/200×200-1.jpg”]{THEME_ROOT}/images/preview/large-img-1.jpg[/gal_item]
[gal_item title=”Video Example” thumb=”{THEME_ROOT}/images/preview/200×200-2.jpg”]http://www.youtube.com/watch?v=XSGBVzeBUbk[/gal_item]
[gal_item title=”Another Video” thumb=”{THEME_ROOT}/images/preview/200×200-3.jpg”]http://vimeo.com/1084537[/gal_item]
[gal_item title=”Image Example” thumb=”{THEME_ROOT}/images/preview/200×200-4.jpg”]{THEME_ROOT}/images/preview/large-img-2.jpg[/gal_item]
[/lightbox_gallery]

[toggle_box title=”See The Shortcodes”]
[code_table]
[code_line][lightbox_gallery columns=”4″ spacing=”30″ border=”yes”][/code_line]
[code_line][gal_item title=”Title” thumb=”thumb-url”]large-image-or-video-url[/gal_item][/code_line]
[code_line][gal_item title=”Title” thumb=”thumb-url”]large-image-or-video-url[/gal_item][/code_line]
[code_line][gal_item title=”Title” thumb=”thumb-url”]large-image-or-video-url[/gal_item][/code_line]
[code_line][/lightbox_gallery][/code_line]
[/code_table]
[/toggle_box]

no comments
Add a comment...

Your email is never published or shared. Required fields are marked *