<div class="slider-wrapper"> <div class="slider"> <ul class="items"> <li> </li> </ul> </div> </div> </div> </div> </div> </header> <section id="content"><div class="ic"></div> <div class="main"> <div class="wrapper img-indent-bot"> <article class="col-1"> <img class="img-border" src="assets/images/banner-1.jpg" alt=""> </article> <article class="col-1"> <img class="img-border" src="assets/images/banner-4.jpg" alt=""> </article> <article class="col-1"> <img class="img-border" src="assets/images/banner-5.jpg" alt=""> </article> <article class="col-1"> <img class="img-border" src="assets/images/banner-2.jpg" alt=""> </article> <article class="col-2"> <img class="img-border" src="assets/images/banner-3.jpg" alt=""> </article> <div class="wrapper"> <article class="column-1"> <div class="indent-left"> <div class="maxheight indent-bot"> <h3 class="p1">Stock fencing</h3> <h6 class="p2">If you need to patch up an existing stock fence or install new stock proof fencing then ask us about our services before you go anywhere else.</h6> <p class="p2">We can fit a full range of stock fencing wire, posts, staples and stakes.</p> </div> </div> </article> <article class="column-2"> <div class="maxheight indent-bot"> <ul> [[Gallery? &album=`Stock`]] </ul> </div> <hr /> [[!GalleryItem]] [[!+galitem.image:notempty=` <div class="image"> <a href="[[+galitem.image]]"><img class="[[+galitem.imgCls]]" src="[[+galitem.image]]" alt="[[+galitem.name]]" /></a> <br />Albums: [[+galitem.albums]] </div> `]] </article>
<div class="slider-wrapper"> <div class="slider"> [[+gallery]] </div> </div> </div> </div> </div> </header> <section id="content"><div class="ic"></div> <div class="main"> <div class="wrapper img-indent-bot"> <article class="col-1"> <img class="img-border" src="assets/images/banner-1.jpg" alt=""> </article> <article class="col-1"> <img class="img-border" src="assets/images/banner-4.jpg" alt=""> </article> <article class="col-1"> <img class="img-border" src="assets/images/banner-5.jpg" alt=""> </article> <article class="col-1"> <img class="img-border" src="assets/images/banner-2.jpg" alt=""> </article> <article class="col-2"> <img class="img-border" src="assets/images/banner-3.jpg" alt=""> </article> <div class="wrapper"> <article class="column-1"> <div class="indent-left"> <div class="maxheight indent-bot"> <h3 class="p1">Stock fencing</h3> <h6 class="p2">If you need to patch up an existing stock fence or install new stock proof fencing then ask us about our services before you go anywhere else.</h6> <p class="p2">We can fit a full range of stock fencing wire, posts, staples and stakes.</p> </div> </div> </article> <article class="column-2"> <div class="maxheight indent-bot"> <ul> [[Gallery? &album=`Stock`]] </ul> </div> <hr /> [[!GalleryItem &toPlaceholder=`gallery`]] [[!+galitem.image:notempty=` <div class="image"> <a href="[[+galitem.image]]"><img class="[[+galitem.imgCls]]" src="[[+galitem.image]]" alt="[[+galitem.name]]" /></a> <br />[[+galitem.description]] </div> `]] </article> </div> </div> </section>
<div class="slider-wrapper"> <div class="slider"> [[!Gallery? &album=`Stock` &plugin=`galleriffic` &renderNavControls=`0` &renderSSControls=`0` &toPlaceholder=`gallery` ]] </div> </div> </div> </div> </div> </header> <section id="content"><div class="ic"></div> <div class="main"> <div class="wrapper img-indent-bot"> <article class="col-1"> <img class="img-border" src="assets/images/banner-1.jpg" alt=""> </article> <article class="col-1"> <img class="img-border" src="assets/images/banner-4.jpg" alt=""> </article> <article class="col-1"> <img class="img-border" src="assets/images/banner-5.jpg" alt=""> </article> <article class="col-1"> <img class="img-border" src="assets/images/banner-2.jpg" alt=""> </article> <article class="col-2"> <img class="img-border" src="assets/images/banner-3.jpg" alt=""> </article> <div class="wrapper"> <article class="column-1"> <div class="indent-left"> <div class="maxheight indent-bot"> <h3 class="p1">Stock fencing</h3> <h6 class="p2">If you need to patch up an existing stock fence or install new stock proof fencing then ask us about our services before you go anywhere else.</h6> <p class="p2">We can fit a full range of stock fencing wire, posts, staples and stakes.</p> </div> </div> </article> <article class="column-2"> <div class="maxheight indent-bot"> <ul> [[+gallery]] </ul> </div> <hr /> </article>
<div class="slider-wrapper"> <div class="Slider"> [[!GalleryItem]] [[!+galitem.image:notempty=` <div class="image"> <a href="[[+galitem.image]]"><img class="[[+galitem.imgCls]]" src="[[+galitem.image]]" alt="[[+galitem.name]]" /></a> </div> `]] <hr /> </div> </div> </div> </div> </div> </header> <section id="content"><div class="ic"></div> <div class="main"> <div class="wrapper img-indent-bot"> <article class="col-1"> <img class="img-border" src="assets/images/banner-1.jpg" alt=""> </article> <article class="col-1"> <img class="img-border" src="assets/images/banner-4.jpg" alt=""> </article> <article class="col-1"> <img class="img-border" src="assets/images/banner-5.jpg" alt=""> </article> <article class="col-1"> <img class="img-border" src="assets/images/banner-2.jpg" alt=""> </article> <article class="col-2"> <img class="img-border" src="assets/images/banner-3.jpg" alt=""> </article> <div class="wrapper"> <article class="column-1"> <div class="indent-left"> <div class="maxheight indent-bot"> <h3 class="p1">Stock fencing</h3> <h6 class="p2">If you need to patch up an existing stock fence or install new stock proof fencing then ask us about our services before you go anywhere else.</h6> <p class="p2">We can fit a full range of stock fencing wire, posts, staples and stakes.</p> </div> </div> </article> <article class="column-2"> <div class="maxheight indent-bot"> <ul> [[!Gallery? &album=`Stock` &toPlaceholder=`gallery`]] <h1><a href="[[~[[*id]] &galAlbum=`[[+gallery.id]]`]]"></a></h1> [[+gallery]]
I've solved the width and the caption just to find out how to display large picture on loading of page instead of first click on thumbnail
[[!GalleryItem?]] [[!+galitem.image:notempty=` <div class="largeImage"> <a href="[[+galitem.image]]"><img class="[[+galitem.imgCls]]" src="[[+galitem.image]]" alt="[[+galitem.name]]" /></a> </div> `]] [[!Gallery? &toPlaceholder=`gallery` &album=`Stock` &thumbTpl=`NewGalleryThumb` &thumbWidth=`150` ]] [[+gallery]]
<div class="galleryContainer"> <div class="[[+cls]]"> <a href="[[+linkToImage:if=`[[+linkToImage]]`:is=`1`:then=`[[+image_absolute]]`:else=`[[~[[*id]]? &[[+imageGetParam]]=`[[+id]]` &[[+albumRequestVar]]=`[[+album]]` &[[+tagRequestVar]]=`[[+tag]]` ]]`]]"> <img class="[[+imgCls]]" src="[[+fileurl:phpthumbof=`w=160&h=100&zc=1`]]" alt="[[+name]]" /> </a> <h1>[[+description]]</h1> </div> </div>