Hello, I am creating several photo galleries for a client site and all is well for the most part. I have been following this documentation https://docs.couchcms.com/concepts/photo-gallery.html, but the only trouble I am having is utilizing the orderby field to organize the photos. The photos are not responding to the orderby directive at all. Any ideas?

Here is the snippet:

Code: Select all

              <cms:pages masterpage="theater.php" include_subfolders='0' orderby='file_name' order='asc'>
                <div class="row mt-5">
                      <div class="col mb-3 text-align-center">
                          <a href="<cms:show gg_image />" target="_blank">                    
                            <img src="<cms:show gg_image />" title="<cms:show k_page_title />" style="width: 100%; height: auto; display: block; margin: auto;"/>
                          </a>
                          <p class="text-center"><cms:show k_page_title /></p>
                      </div>
                </div>
              </cms:pages>

[trendoman]

I suggest to attach complete template zipped for a full review, including editable fields defs.

[KK]

The snippet posted by OP seems to be working just fine for me.

Thank you both for your replies. I wanted to share some code as I am still unable to find success with this.

First, here is my template for the gallery:

Code: Select all

<?php require_once( 'couch/cms.php' ); ?>
<cms:template title='Theater' clonable='1' dynamic_folders='1' gallery='1'>

   <cms:editable
      name="gg_image"
      label="Image"
      desc="Upload your image here"
      width="750"
      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='115'
      height='115'
      enforce_max='1'
      type="thumbnail"
   />

</cms:template>

<cms:show gg_image />
<?php COUCH::invoke(); ?>

Second, here is where I am generating the photo display on the front end:

Code: Select all

<cms:pages masterpage="theater.php" include_subfolders='0' orderby='file_name' order='asc'>
                <div class="row mt-5">
                      <div class="col mb-3 text-align-center">
                          <a href="<cms:show gg_image />" target="_blank">                    
                            <img src="<cms:show gg_image />" title="<cms:show k_page_title />" style="width: 100%; height: auto; display: block; margin: auto;"/>
                          </a>
                          <p class="text-center"><cms:show k_page_title /></p>
                      </div>
                </div>
              </cms:pages>

As you can see, I am trying to sort the photos alphabetically by file name, but no matter what I do they refuse to change the order they are displaying in. Anyone spot any mistakes in the code I am overlooking? Much appreciated!

Bump? Anyone?

[trendoman]

Bump? Anyone?

It is a mistake to not zip everything for review. I just tested that piece of code and it is ok. As the last measure check what query tag <pages> sends to database by using parameter return_sql='1' as in -

Code: Select all

<cms:pages masterpage='theater.php' include_subfolders='0' orderby='file_name' order='asc' return_sql='1' />

The printed output will be similar to what follows (note the ORDER BY clause) -

SELECT p.id, p.template_id FROM couch_pages p WHERE p.template_id='3' AND p.page_folder_id='-1' AND p.publish_date < '2020-07-18 09:08:11' AND NOT p.publish_date = '0000-00-00 00:00:00' AND p.parent_id=0 ORDER BY p.file_name asc LIMIT 0, 1000

If you do see something similar, then pages tag works allright but, perhaps, somethine else is messing up your output (like styles or scripts). Your published extract of code has no errors and worked fine for me as well.

Thank for the tip. I checked the SQL and got this result, so it appears that is as expected.

Code: Select all

SELECT p.id, p.template_id FROM couch_pages p WHERE p.template_id='5' AND p.page_folder_id='-1' AND p.publish_date < '2020-07-18 23:32:39' AND NOT p.publish_date = '0000-00-00 00:00:00' AND p.parent_id=0 ORDER BY p.file_name asc LIMIT 0, 1000

Can you confirm that the "Name" field in this screenshot is the "file_name" field that I should be expecting it to order by? ?

I am using Bootstrap, but haven't added any additional script libraries and don't have too much custom styling, so I'm really unsure of anything that could be interesting with the order of the photos. Of course, this is the only remaining item on this client's website

I apologize, I've never been asked to zip up a project before in any other forum, so I'm curious what exactly I should be zipping up and attaching here? The entire project would greatly exceed the upload size limit. Just the gallery template and the page it is rendered on?

Thank you.

[trendoman]

If by "Name" you refer to the second editable field (filled-in automatically when uploading image to gallery) then it is a name of the cloned page, referred in ordering as page_name and usable in code as k_page_name variable. We can use it to order pages as explained in https://docs.couchcms.com/tags-referenc ... ml#orderby -

Code: Select all

<cms:pages masterpage='blog.php' orderby='page_name'></cms:pages>

The file_name is actual name of the picture, i.e. olympus_c960.jpg.

Note that image's filename is not necessarily equal to page_name, because the latter can be changed at will (for example, by clearing the name field, changing title and then save) to have a different pretty-url for the particular page.

THANK YOU! This whole time I was incorrectly assuming the Name field in admin was file_name. That fixed it!

Much appreciated!