Hi

I am trying to integrate couchcms into a gallery page and it's not working out so well. the thumbnails are all in one line vertically

The code for each photo in the gallery before the couchcms integration is below

Code: Select all
<div class="col-md-4 col-sm-6 col-xs-12 planting">
                            <div class="single-awesome-project">
                                <div class="awesome-img">
                                    <a href="#">
                                        <img src="img\gallery\small\ltl-paving-large-4.jpg" alt="">
                                    </a>
                                    <div class="add-actions text-center">
                                        <a class="venobox" data-gall="myGallery" href="img\gallery\large\ltl-paving-large-4.jpg">
                                            <i class="port-icon icon icon-picture"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>


After couchcms integration into gallery.php, the code is below

Code: Select all
<div class="col-md-4 col-sm-6 col-xs-12 planting">
                            <div class="single-awesome-project">
                                <div class="awesome-img">
                                <cms:pages masterpage="gallery.php" include_subfolders='0' >
                                <a class="venobox" data-gall="myGallery" href="<cms:show gg_image />">
                           <img src="<cms:show gg_thumb />" title="<cms:show k_page_title />" />
                           </a>
                        </cms:pages>
                              </div>
                                </div>
                                </div>


The link to the site is http://www.ltlpaving.co.uk/gallery.php

Can anyone help please as I think I have put some code in the wrong place

It should have 3 or 4 rows of the images and the thumbnails should be around the size of 250 x 250

Also how do I resize the thumbnail image sizes, I have tried to alter it in the couchcms tag below but the size stays the same, they are displaying as 115x86

Code: Select all
<cms:editable 
      name='gg_thumb'
      label='Image Thumbnail'
      desc='Thumbnail of the main image above'
      width='250'
      height='250'
      enforce_max='1'
      assoc_field='gg_image'
      show_preview='1'
      type='thumbnail'
      order='2'
   />


Thank you in advance

UPDATE: I have altered the coding abit and got them in a line but does go bit odd on some rows, I am not sure what to do now as am stuck

The updated coding is below

Code: Select all
<cms:pages masterpage="gallery.php" include_subfolders='0' >
                        <div class="col-md-4 col-sm-6 col-xs-12 planting">
                            <div class="single-awesome-project">
                                <div class="awesome-img">
                                <a class="venobox" data-gall="myGallery" href="<cms:show gg_image />">
                           <img src="<cms:show gg_thumb />" title="<cms:show k_page_title />" />
                           </a>
                              </div>
                                </div>
                                </div>
                                </cms:pages>


UPDATE: Think I have solved it with the following coding

Code: Select all
<cms:template title='Gallery' clonable='1' gallery='1'>
   <cms:editable
      name='gg_image'
      label='Image'
      desc='Upload your main image here'
      width='500'
      height='500'
      show_preview='1'
      preview_height='400'
      type='image'
      order='1'
      required='1'
   />
   
   <cms:editable
      name='gg_thumb'
      label='Image Thumbnail'
      desc='Thumbnail of the main image above'
      width='300'
      height='300'
      enforce_max='1'
      assoc_field='gg_image'
      show_preview='1'
      type='thumbnail'
      order='2'
   />
   
   </cms:template>

<cms:pages masterpage="gallery.php" include_subfolders='0' >
                        <div class="col-md-4 col-sm-6 col-xs-12 planting">
                            <div class="single-awesome-project">
                                <div class="awesome-img">
                                <a class="venobox" data-gall="myGallery" href="<cms:show gg_image />">
                           <img src="<cms:show gg_thumb />" title="<cms:show k_page_title />" />
                           </a>
                              </div>
                                </div>
                                </div>
                                </cms:pages>