Hi

I am winning with the demo site of couchcms and got quite a few good features integrated and learning it properly as I do each feature and study it to make sure I understand how it works, the one bit I have got stuck on is a bootstrap lightbox photo gallery

I am using this one: https://www.codeply.com/go/84yMeticox/b ... s-lightbox

It works if I use the coding with no couchcms tags integrated, below is the coding with no couchcms tags integrated

Code: Select all

<div class="container">
    <div class="row">
        <div class="col-12">
        <div class="row">
            <a href="https://unsplash.it/1200/768.jpg?image=251" data-toggle="lightbox" data-gallery="example-gallery" class="col-lg-3 col-md-4 col-6 my-3">
                <img src="https://unsplash.it/600.jpg?image=251" class="img-fluid card">
            </a>
            <a href="https://unsplash.it/1200/768.jpg?image=252" data-toggle="lightbox" data-gallery="example-gallery" class="col-lg-3 col-md-4 col-6 my-3">
                <img src="https://unsplash.it/600.jpg?image=252" class="img-fluid card">
            </a>
            <a href="https://unsplash.it/1200/768.jpg?image=253" data-toggle="lightbox" data-gallery="example-gallery" class="col-lg-3 col-md-4 col-6 my-3">
                <img src="https://unsplash.it/600.jpg?image=253" class="img-fluid card">
            </a>
            <a href="https://unsplash.it/1200/768.jpg?image=254" data-toggle="lightbox" data-gallery="example-gallery" class="col-lg-3 col-md-4 col-6 my-3">
                <img src="https://unsplash.it/600.jpg?image=254" class="img-fluid card">
            </a>
            <a href="https://unsplash.it/1200/768.jpg?image=255" data-toggle="lightbox" data-gallery="example-gallery" class="col-lg-3 col-md-4 col-6 my-3">
                <img src="https://unsplash.it/600.jpg?image=255" class="img-fluid card">
            </a>
            <a href="https://unsplash.it/1200/768.jpg?image=256" data-toggle="lightbox" data-gallery="example-gallery" class="col-lg-3 col-md-4 col-6 my-3">
                <img src="https://unsplash.it/600.jpg?image=256" class="img-fluid card">
            </a>
        </div>
    </div>
</div>
</div>

If I integrated the couchcms tags in and upload photos from the cms admin side, it looks like the photos don't seem to upload correctly. I have attached a screenshot of the issue. Below is the coding with couchcms integrated

Code: Select all

<div class="container">
    <div class="row">
        <div class="col-12">
            <h1 class="page-title">Projects</h1>
        <h3 class="gallery-title">Gallery 1</h3>
        <div class="row">
        <cms:pages masterpage="gallery.php" include_subfolders='0' >
            <a href="<cms:show gg_image />" data-toggle="lightbox" data-gallery="example-gallery" class="col-lg-3 col-md-4 col-6 my-3">
                <img src="<cms:show gg_thumb />" class="img-fluid card">
            </a>
         </cms:pages>
        </div>
    </div>
</div>
</div>

Thank you in advance

UPDATE: Sorry sorted it, so stupid, I forgot to include the couchcms template tag coding below

Code: Select all

<cms:template title='Gallery' clonable='1' dynamic_folders='1' gallery='1' order='6'>

<cms:editable
      name="gg_image"
      label="Image"
      desc="Upload your main image here"
      show_preview='1'
      preview_height='200'
      type="image"
   />

   <cms:editable
      name="gg_thumb"
      assoc_field="gg_image"
      label="Image Thumbnail"
      desc="Thumbnail of image above"
      width='400'
      height='400'
      enforce_max='1'
      type="thumbnail"
   />


</cms:template>

[KK]

Hi,

Looks like a permission issue.
Please check the permissions of the 'couch/uploads' folder and try tweaking them (755 and then 777).

Hope it helps.

Hi KK

Thank you for the reply, I had the permissions set to 755 and seems ok and working now