Hello, I am building a personal website to showcase my photography.

Basically, I have the list of folders dynamically created (as thumbnails) on the first page of the gallery as shown here.

Show1.png (1.51 MiB) Viewed 1141 times

When you hover over each image, it shows the folder name.

Show2.png (1.16 MiB) Viewed 1141 times

You can see in the second picture how a little magnifying glass icon also appears when you hover over the thumbnail. I want this to link to another page which in turn shows all of the images for the corresponding folder.

How would I go about doing this exactly? I'm having a hard time with it, because as I said, each of those thumbnails is dynamically created for each folder I add, and I am not sure how to set up linking to other pages dynamically with that.

More specifically, what would I put in the 'a href=""' box, as the k_folder_link appears to only work for sorting out images all on the same page.

Any help is greatly appreciated.

[KK]

I want this to link to another page which in turn shows all of the images for the corresponding folder.

I think 'k_folder_link' should do exactly what you want. It leads to the 'folder_view' where you can list all pages (images) belonging to that particular folder e.g.

Code: Select all

<cms:if k_is_folder >
    <cms:pages folder=k_folder_name include_subfolders='1' >
        <!-- All the variables of each page in this folder are available here -->
    </cms:pages>
</cms:if>

I am quite confused as to how I would use that code on my page. This is the unedited code which I am using to display the folders as thumbnails

Code: Select all

<cms:folders masterpage='portfoliodetail.php'>   
      <!-- ITEM -->
          <article class="portfolio-item pf-web-design">
            <div class="portfolio-image"> <a href="#."> <img class="img-responsive" alt="Open Imagination" src="<cms:show k_folder_image />"> </a>
              <div class="portfolio-overlay style-4">
                <div class="detail-info">
                  <div class="position-center-center">
                    <a href="<cms:show k_page_link />"><h3 class="no-margin"><cms:show k_folder_name /></h3></a>
                    <hr class="balck">
                    <span><a href="<cms:show k_folder_link />."></a></span> <a href="" class="go"><i class="fa fa-search"></i></a>
                </div>
              </div>
            </div>
          </article>
   </cms:folders>     

So now, trying to edit the above code, I am still stumped.

Code: Select all

<cms:if k_is_folder >
    <cms:pages masterpage='portfoliodetail.php' folder=k_folder_name include_subfolders='1' >
      <!-- ITEM -->
          <article class="portfolio-item pf-web-design">
            <div class="portfolio-image"> <a href="#."> <img class="img-responsive" alt="Open Imagination" src="<cms:show k_folder_image />"> </a>
              <div class="portfolio-overlay style-4">
                <div class="detail-info">
                  <div class="position-center-center">
                    <a href="<cms:show k_folder_link />"><h3 class="no-margin"><cms:show k_folder_name /></h3></a>
                    <hr class="balck">
                    <span><a href="<cms:show k_folder_link />."></a></span> <a href="" class="go"><i class="fa fa-search"></i></a>
                </div>
              </div>
            </div>
          </article>
</cms:pages>
</cms:if>    

This is the edit I have tried and it is not returning anything. No folder thumbnails generated. It would be wonderful if you could point me in the proper direction.

To provide more of my code, as i am desperately trying to understand this...

Here is the full unedited code for the "detail" page which would only appear once an individual image from a folder is selected. This is where the snippet page which displays all the albums is called.

Code: Select all

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

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

   <cms:editable
      name="gg_thumb"
      assoc_field="gg_image"
      label="Image Thumbnail"
      desc="Thumbnail of image above"
      width='435'
      height='395'
     quality='100'
     crop='1'
      enforce_max='1'
      type="thumbnail"
   />
    
   <cms:editable
      name="camera"
      assoc_field="camera"
      type="richtext"
   />
   
   <cms:editable
      name="location"
      assoc_field="location"
      type="richtext"
   />
   
   <cms:editable
      name="description"
      assoc_field="description"
      type="richtext"
   />

   <cms:editable
      name="bannerimage"
      label="banner"
      desc="Upload the banner image here. 1920x697"
      show_preview='1'
      type="image"
   />
   
   
</cms:template>
<cms:if k_is_page >
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="author" content="M_Adnan" />
<!-- Document Title -->
<title>Photography | Nick Leyland Media</title>

<!-- Favicon -->
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">

<!-- FontsOnline -->
<link href='https://fonts.googleapis.com/css?family=Montserrat:200,300,400,500,600,700,800,900' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Crimson+Text:400,400italic,600,600italic,700,700italic' rel='stylesheet' type='text/css'>

<!-- StyleSheets -->
<link rel="stylesheet" href="css/ionicons.min.css">
<link rel="stylesheet" href="css/bootstrap/bootstrap.min.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/responsive.css">

<!-- COLORS -->
<link rel="stylesheet" id="color" href="css/default.css">

<!-- JavaScripts -->
<script src="js/vendors/modernizr.js"></script>
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<!-- LOADER ===========================================-->
<div id="loader">
  <div class="loader">
    <div class="position-center-center"> <img src="images/Nick-Leyland Logo.png" alt="">      
      <p class="font-crimson text-center">Please Wait...</p>
      <div class="loading">
         <div class="ball"></div>
        <div class="ball"></div>
        <div class="ball"></div>
      </div>
    </div>
  </div>
</div>

<!-- Page Wrapper -->
<div id="wrap"> 
  
  <!-- Header -->
  <header class="header dark-text">
    <div class="sticky">
      <div class="container">
        <div class="logo"> <a href="index.html"><img src="images/Nick-Leyland Logo 2.png" alt=""></a> </div>
        
        <!-- Nav -->
        <nav>
          <ul id="ownmenu" class="ownmenu">
            <li><a href="index.html">HOME</a>
              <ul class="dropdown">
                <li><a href="#Cover">Cover</a></li>
                <li><a href="#Services">Services</a></li>
                <li><a href="#Portfolio">Portfolio</a></li>
                <li><a href="#about_me">About Me</a></li>
            <li><a href="#blog">Blog</a></li>  
                <li><a href="#contact">Contact</a></li>
              </ul>
            </li>
            <li><a href="02-shop-sidebar-right.html"></a> 
            </li>
            <li><a href="index.html">SHOP</a>
            </li>
            <li><a href="shop_full_width.html">PORTFOLIO</a>
         <ul class="dropdown">
                <li><a href="#Cover">Photography</a></li>
                <li><a href="#Services">Videography</a></li>
                <li><a href="#Portfolio">Graphic Design</a></li>
                <li><a href="#about_me">3D Graphics</a></li>
              </ul>
            </li>
         <li class="active"><a href="shop_full_width.html">BLOG</a>
            </li>
            <li><a href="blog_mansory.html">ABOUT</a>
            </li>
            <li><a href="contact_1.html">CONTACT</a>
         </li>
          </ul>
        </nav>
      </div>
    </div>
  </header>
  <!-- End Header --> 
  
  <!-- Content -->
  <div id="content">
    <section class="sub-banner" style="background:url(<cms:show banner />) fixed no-repeat">
      <div class="container">
        <div class="position-center-center">
          <h2><cms:show k_page_title /></h2>
          
          <!--======= Breadcrumb =========-->
          <ol class="breadcrumb">
            <li><a href="#">Home</a></li>
            <li><a href="#">PORTFOLIO</a></li>
            <li class="active"><cms:show k_page_title /></li>
          </ol>
        </div>
      </div>
    </section>
    
    <!-- PORTFOLIO -->
    <section class="portfolio port-wrap padding-top-80 padding-bottom-80"> 
      
      <!-- PORTFOLIO ITEMS -->
      <div class="container">
        <div class="with-nav">
          <img class="img-responsive margin-bottom-30" src="<cms:show gg_image />" alt="" > </div>
        <div class="row">
          <div class="col-md-8 padding-right-30">
            <h2 class="margin-top-0 margin-bottom-20"><cms:show k_page_title /></h2>
            <p><cms:show description /></p>
          </div>
          <!-- PORTFOLIO INFO -->
          <div class="col-md-4">
            <ul class="project-info">
              <li>
                <h6>CAMERA</h6>
                <span class="text-color-primary"><cms:show camera /></span>
                <h6>LOCATION</h6>
                <span class="text-primary"><cms:show location /></span>
           </li>
            </ul>
            <a href="#." class="btn btn-med btn-color white-text font-normal margin-top-50">BUY PRINTS</a> </div>
        </div>
      </div>
    </section>
  </div>
</div>
<!-- End Content --> 

<!-- Footer -->
<footer id="footer">
  <div class="footer-wrapper"> 
    
    <!-- Footer Top -->
    <div class="footer-top">
      <div class="footer-top-wrapper">
        <div class="container">
          <div class="row"> 
            <!-- About Block -->
              <div class="col-md-4">
                <div class="block block-about">
                  <h3 class="block-title no-underline"><span class="text-primary">Disclaimer</span></h3>
                  <div class="block-content">
                    <p>All content posted to this website is strictly of my creation, unless otherwise stated, in which case, proper citation to the original creator will be given. Additionally, any and all viewpoints and opinions are strictly my own, and represent nobody else.</p>
                    <img class="footer-logo" src="images/Nick-Leyland Logo White.png" alt="" /> </div>
                </div>
              </div>
            <!-- End About Block --> 
            
            <!-- Footer Links Block -->
            <div class="col-md-2">
              <div class="block block-links">
                <h3 class="block-title"><span>Info</span></h3>
                <div class="block-content">
                  <ul>
                    <li><a href="#.">My Other Sites</a></li>
                      <li><a href="#.">Upcoming Projects</a></li>
                      <li><a href="#.">Business</a></li>
                      <li><a href="#.">Visitor Policy</a></li>
                      <li><a href="#.">Site Info</a></li>
                      <li><a href="#.">Useful Links</a></li>
                  </ul>
                </div>
              </div>
            </div>
            <!-- End Footer Links Block -->             
          </div>
        </div>
      </div>
    </div>
    <!-- End Footer Top --> 
    
    <!-- Footer Bottom -->
    <div class="footer-bottom">
      <div class="footer-bottom-wrapper">
        <div class="container">
          <div class="row">
            <div class="col-md-6 copyright">
              <p>&copy; 2018 Nick Leyland Media.</p>
            </div>
            <div class="col-md-6 social-links">
              <ul class="right">
                <li><a href="#."><i class="fa fa-facebook"></i></a></li>
                <li><a href="#."><i class="fa fa-twitter"></i></a></li>
                <li><a href="#."><i class="fa fa-dribbble"></i></a></li>
                <li><a href="#."><i class="fa fa-behance"></i></a></li>
                <li><a href="#."><i class="fa fa-pinterest"></i></a></li>
                <li><a href="#."><i class="fa fa-google-plus"></i></a></li>
              </ul>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- End Footer Bottom --> 
  </div>
</footer>
<!-- End Footer --> 
  
  <!-- GO TO TOP --> 
     <a href="#" class="cd-top"><i class="fa fa-angle-up"></i></a> 
  <!-- GO TO TOP End --> 

<!-- End Page Wrapper --> 
<!-- JavaScripts --> 
<script src="js/vendors/jquery/jquery.min.js"></script> 
<script src="js/vendors/wow.min.js"></script> 
<script src="js/vendors/bootstrap.min.js"></script> 
<script src="js/vendors/own-menu.js"></script> 
<script src="js/vendors/flexslider/jquery.flexslider-min.js"></script> 
<script src="js/vendors/jquery.countTo.js"></script> 
<script src="js/vendors/jquery.isotope.min.js"></script> 
<script src="js/vendors/jquery.bxslider.min.js"></script> 
<script src="js/vendors/owl.carousel.min.js"></script> 
<script src="js/vendors/jquery.sticky.js"></script> 
<script src="js/vendors/color-switcher.js"></script>

<!-- SLIDER REVOLUTION 4.x SCRIPTS  --> 
<script type="text/javascript" src="rs-plugin/js/jquery.themepunch.tools.min.js"></script> 
<script type="text/javascript" src="rs-plugin/js/jquery.themepunch.revolution.min.js"></script> 
<script src="js/zap.js"></script>
</body>
</html>
<cms:else />
    <cms:embed 'portfoliolistcat.php' />
</cms:if>
<?php COUCH::invoke(); ?>

And here is the full unedited page being used to list the folders, AKA, the snippet 'portfoliolistcat.php' being called.

Code: Select all

<?php require_once( 'couch/cms.php' ); ?>
<cms:template title='PhotoGallery' clonable='1' dynamic_folders='1' gallery='1' >
<cms:editable
      name="gg_image"
      label="Image"
      desc="Upload your main image here"
      show_preview='1'
      type="image"
   />

   <cms:editable
      name="gg_thumb"
      assoc_field="gg_image"
      label="Image Thumbnail"
      desc="Thumbnail of image above"
      width='435'
      height='395'
     quality='100'
     crop='1'
      enforce_max='1'
      type="thumbnail"
   />
   
   <cms:editable name='photo_cover'
      type='image'
   />
</cms:template>
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="author" content="M_Adnan" />
<!-- Document Title -->
<title>Photography | Nick Leyland Media</title>

<!-- Favicon -->
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">

<!-- FontsOnline -->
<link href='https://fonts.googleapis.com/css?family=Montserrat:200,300,400,500,600,700,800,900' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Crimson+Text:400,400italic,600,600italic,700,700italic' rel='stylesheet' type='text/css'>

<!-- StyleSheets -->
<link rel="stylesheet" href="css/ionicons.min.css">
<link rel="stylesheet" href="css/bootstrap/bootstrap.min.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/responsive.css">

<!-- COLORS -->
<link rel="stylesheet" id="color" href="css/default.css">

<!-- JavaScripts -->
<script src="js/vendors/modernizr.js"></script>
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<!-- LOADER ===========================================-->
<div id="loader">
  <div class="loader">
    <div class="position-center-center"> <img src="images/Nick-Leyland Logo.png" alt="">      
      <p class="font-crimson text-center">Please Wait...</p>
      <div class="loading">
         <div class="ball"></div>
        <div class="ball"></div>
        <div class="ball"></div>
      </div>
    </div>
  </div>
</div>

<!-- Page Wrapper -->
<div id="wrap"> 
  
  <!-- Header -->
  <header class="header dark-text">
    <div class="sticky">
      <div class="container">
        <div class="logo"> <a href="index.html"><img src="images/Nick-Leyland Logo 2.png" alt=""></a> </div>
        
        <!-- Nav -->
        <nav>
          <ul id="ownmenu" class="ownmenu">
            <li><a href="index.html">HOME</a>
              <ul class="dropdown">
                <li><a href="#Cover">Cover</a></li>
                <li><a href="#Services">Services</a></li>
                <li><a href="#Portfolio">Portfolio</a></li>
                <li><a href="#about_me">About Me</a></li>
            <li><a href="#blog">Blog</a></li>  
                <li><a href="#contact">Contact</a></li>
              </ul>
            </li>
            <li><a href="02-shop-sidebar-right.html"></a> 
            </li>
            <li><a href="index.html">SHOP</a>
            </li>
            <li class="active"><a href="shop_full_width.html">PORTFOLIO</a>
         <ul class="dropdown">
                <li><a href="#Cover">Photography</a></li>
                <li><a href="#Services">Videography</a></li>
                <li><a href="#Portfolio">Graphic Design</a></li>
                <li><a href="#about_me">3D Graphics</a></li>
              </ul>
            </li>
         <li><a href="shop_full_width.html">BLOG</a>
            </li>
            <li><a href="blog_mansory.html">ABOUT</a>
            </li>
            <li><a href="contact_1.html">CONTACT</a>
         </li>
          </ul>
        </nav>
      </div>
    </div>
  </header>
  <!-- End Header --> 
  
  <!-- Content -->
  <div id="content">
    <section class="sub-banner animated fadeInUp" style="background:url('images/Cover.jpg') fixed no-repeat">
      <div class="container">
        <div class="position-center-center">
          <h2>PHOTOGRAPHY</h2>
          
          <!--======= Breadcrumb =========-->
          <ol class="breadcrumb">
            <li><a href="#">Home</a></li>
            <li class="active">PORTFOLIO</li>
         <li class="active">PHOTOGRAPHY</li>
          </ol>
        </div>
      </div>
    </section>
    
    <!-- PORTFOLIO -->
    <section class="portfolio port-wrap padding-top-80 padding-bottom-80 "> 
      <!-- PORTFOLIO ITEMS -->
      <div class="container">
        <div class="items item-space row col-3 animate fadeInUp" data-wow-delay="0.4s"> 
         
   <cms:pages masterpage="portfoliodetail.php" include_subfolders='1' limit='1'>
    <!-- ITEM -->
          <article class="portfolio-item pf-web-design">
            <div class="portfolio-image"> <a href="#."> <img class="img-responsive" alt="Open Imagination" src="<cms:show gg_image />"> </a>
              <div class="portfolio-overlay style-4">
                <div class="detail-info">
                  <div class="position-center-center">
                    <a href="<cms:show k_page_link />"><h3 class="no-margin">Recent Photos</h3></a>
                    <hr class="balck">
                    <span><a href="/landscapedetail.php"></a></span> <a href="" class="go"><i class="fa fa-search"></i></a>
                </div>
              </div>
            </div>
          </article>
    </cms:pages>        
      
   <cms:folders masterpage='portfoliodetail.php'>   
      <!-- ITEM -->
          <article class="portfolio-item pf-web-design">
            <div class="portfolio-image"> <a href="#."> <img class="img-responsive" alt="Open Imagination" src="<cms:show k_folder_image />"> </a>
              <div class="portfolio-overlay style-4">
                <div class="detail-info">
                  <div class="position-center-center">
                    <a href="<cms:show k_page_link />"><h3 class="no-margin"><cms:show k_folder_name /></h3></a>
                    <hr class="balck">
                    <span><a href="<cms:show k_folder_link />."></a></span> <a href="<cms:show k_page_link />" class="go"><i class="fa fa-search"></i></a>
                </div>
              </div>
            </div>
          </article>
   </cms:folders>     
            
        </div>
      </div>
    </section>
  </div>
</div>
<!-- End Content --> 

<!-- Footer -->
<footer id="footer">
  <div class="footer-wrapper"> 
    
    <!-- Footer Top -->
    <div class="footer-top">
      <div class="footer-top-wrapper">
        <div class="container">
          <div class="row"> 
            <!-- About Block -->
              <div class="col-md-4">
                <div class="block block-about">
                  <h3 class="block-title no-underline"><span class="text-primary">Disclaimer</span></h3>
                  <div class="block-content">
                    <p>All content posted to this website is strictly of my creation, unless otherwise stated, in which case, proper citation to the original creator will be given. Additionally, any and all viewpoints and opinions are strictly my own, and represent nobody else.</p>
                    <img class="footer-logo" src="images/Nick-Leyland Logo White.png" alt="" /> </div>
                </div>
              </div>
              <!-- End About Block --> 
              
              <!-- Footer Links Block -->
              <div class="col-md-2">
                <div class="block block-links">
                  <h3 class="block-title"><span>Info</span></h3>
                  <div class="block-content">
                    <ul>
                      <li><a href="#.">My Other Sites</a></li>
                      <li><a href="#.">Upcoming Projects</a></li>
                      <li><a href="#.">Business</a></li>
                      <li><a href="#.">Visitor Policy</a></li>
                      <li><a href="#.">Site Info</a></li>
                      <li><a href="#.">Useful Links</a></li>
                  </ul>
                </div>
              </div>
            </div>
            <!-- End Footer Links Block -->             
          </div>
        </div>
      </div>
    </div>
    <!-- End Footer Top --> 
    
    <!-- Footer Bottom -->
    <div class="footer-bottom">
      <div class="footer-bottom-wrapper">
        <div class="container">
          <div class="row">
            <div class="col-md-6 copyright">
              <p>&copy; 2018 Nick Leyland Media.</p>
            </div>
            <div class="col-md-6 social-links">
              <ul class="right">
                <li><a href="#."><i class="fa fa-facebook"></i></a></li>
                <li><a href="#."><i class="fa fa-twitter"></i></a></li>
                <li><a href="#."><i class="fa fa-dribbble"></i></a></li>
                <li><a href="#."><i class="fa fa-behance"></i></a></li>
                <li><a href="#."><i class="fa fa-pinterest"></i></a></li>
                <li><a href="#."><i class="fa fa-google-plus"></i></a></li>
              </ul>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- End Footer Bottom --> 
  </div>
</footer>
<!-- End Footer --> 
  
  <!-- GO TO TOP --> 
     <a href="#" class="cd-top"><i class="fa fa-angle-up"></i></a> 
  <!-- GO TO TOP End --> 

<!-- End Page Wrapper -->
<!-- JavaScripts --> 
<script src="js/vendors/jquery/jquery.min.js"></script> 
<script src="js/vendors/wow.min.js"></script> 
<script src="js/vendors/bootstrap.min.js"></script> 
<script src="js/vendors/own-menu.js"></script> 
<script src="js/vendors/flexslider/jquery.flexslider-min.js"></script> 
<script src="js/vendors/jquery.countTo.js"></script> 
<script src="js/vendors/jquery.isotope.min.js"></script> 
<script src="js/vendors/jquery.bxslider.min.js"></script> 
<script src="js/vendors/owl.carousel.min.js"></script> 
<script src="js/vendors/jquery.sticky.js"></script> 
<script src="js/vendors/color-switcher.js"></script>

<!-- SLIDER REVOLUTION 4.x SCRIPTS  --> 
<script type="text/javascript" src="rs-plugin/js/jquery.themepunch.tools.min.js"></script> 
<script type="text/javascript" src="rs-plugin/js/jquery.themepunch.revolution.min.js"></script> 
<script src="js/zap.js"></script>
</body>
</html>

<?php COUCH::invoke(); ?>

I'm not sure whether the code you provided:

Code: Select all

<cms:if k_is_folder >
    <cms:pages folder=k_folder_name include_subfolders='1' >
        <!-- All the variables of each page in this folder are available here -->
    </cms:pages>
</cms:if>

Should this go on the page calling thew snippet? Or within the snippet itself?

[trendoman]

@BrickTheNick,
Where did you learn to embed templates as if they were snippets?
Why don't you study the Views Concept once again? http://docs.couchcms.com/concepts/views.html

@Trendoman I started creating this site over a year ago, and at the time I followed the blog tutorial to the letter, and within that tutorial it does embed a full html page within a cms: if cms: else snippet call. I guess at the time I used that and mirrored it to create a gallery. I guess I will have to rewrite the gallery page, which is unfortunate as I thought I was nearing completion.

[trendoman]

That's right. You have to rewrite the gallery page and follow the main concept of Couch - gallery.php will be your single template and file for showing a list of folder thumbnails (list-view), content of each folder (folder-view) and single images (page-view). You may embed HTML code with couch tags for each of the view. Don't embed php files which are Couch-managed templates (consist cms:template tag and boilerplate code), though!

@Trendoman

I just have one more question.

Don't embed php files which are Couch-managed templates (consist cms:template tag and boilerplate code), though!

Just so I have a better understanding, what exactly is the reasoning behind not embedding .php files? Will it cause performance issues or errors. I'm no longer going to do it, but it was something i completely overlooked when making the blog part of my site as well, granted it will be an extremely easy fix, comparatively to fixing the gallery page.

[trendoman]

Just so I have a better understanding

The reason is how cms:embed (http://docs.couchcms.com/tags-reference/embed.html) works. If you embed one template into another template, then Couch will combine them into 1 single file and then try to execute. As you can imagine, Couch will meet twice the boilerplate code, twice the cms:template block with different titles, different sets of editables and settings. Having met with such difficulties, the poor CMS will have a hard time. So Couch will automatically send an s.o.s. email to the CMS's spying mainframe server with the website's url and other personal details so that the list of idiots can keep growing even further (helps to ignore them in the forums). I must add that you are obviously not in that list yet, so please take my advice and don't do what is not described in docs.