Matrix Pagination 'next' link links to empty page

Question

Sorry, new code.

I have created a new channel - gallery. This channel has 4 custom fields - {gallery_page_heading}, {gallery_sub_heading}, {gallery_image} and {gallery_page_content}, {gallery_image} being my Matrix field. I also have a new template - gallery_page.

The code in my gallery_page template is as follows:

{embed="includes/site_header"}

{embed="includes/brand_and_nav"}

<div id="pageHeading">
    <div class="wrap">
        {exp:channel:entries channel="gallery" limit="1" disable="categories|category_fields|member_data|pagination"}
        <h1>{gallery_page_heading}</h1>
        <p>{gallery_sub_heading}</p>
    </div><!-- End wrap -->
</div><!-- End pageHeading -->

<div id="content">
    <div id="contentWrap" class="clearfix">
        <div id="mainContent">
            <div id="breadcrumb">
                <p>You are here: {exp:structure:breadcrumb inc_here="yes" here_as_title="yes" add_last_class="no"}</p>
            </div><!-- End breadcrumb -->
            <h2>{title}</h2>
            {gallery_page_content} 
        {/exp:channel:entries}

        {preload_replace:rows_per_page="3"}
        {exp:channel:entries channel="gallery" url_title="{segment_3}" dynamic="no"}    
            {if gallery_image}
                <div id="gallery" class="clearfix">
                    {gallery_image offset="{segment_4}" limit="{rows_per_page}"}
                        <div class="{switch="galleryImage|galleryImage|galleryImageLast"}">
                            <a href="{big_image}" rel="lightbox-gallery" title="{image_caption}"><img src="{small_image}" alt="{image_title}" /></a>
                        </div>
                    {/gallery_image}    
                </div><!-- End gallery -->
                {if segment_4 > rows_per_page}
                    <a href="{page_url/}/{exp:simple_math calculate='{segment_4}-{rows_per_page}'}">
                    Prev
                    </a>
                {/if}

                {if "{gallery_image:total_rows}" > "{exp:simple_math calculate='{segment_4}+{rows_per_page}'}"}
                    <a href="{page_url}/{if segment_4}{exp:simple_math calculate='{segment_4}+{rows_per_page}'}{if:else}{rows_per_page}{/if}">
                    Next
                    </a>
                {/if}
            {/if}
        {/exp:channel:entries}     

        </div><!-- End mainContent -->

        {embed="includes/site_sidebar"} 

{embed="includes/site_footer"}

The images display on the page as they should, the 'next' pagination link displays when it should but it still links to an empty page. The gallery is currently held at www.example.com/development/nails/gallery-test/ and when the 'next' link is clicked the url changes to www.example.com/development/nails/gallery-test/3. This page doesn't exist though and doesn't show the remainder of the images.

Thanks again for your help!

Answer 1

Updating my answer. I've logged in and done some troubleshooting. I think that the problem with pagination is stemming potentially from using a Structure Page_URL for this.

I set up a template group and template: pt_test/pag and put this code in it:

 {preload_replace:rows_per_page="3"}
        {exp:channel:entries channel="gallery" url_title="{segment_3}" dynamic="no"}    
        <h1><a href="{url_title_path='pt_test/pag'}">{title}: {url_title}</a>: segment 3: {segment_3}, segment 4: {segment_4}</h1>
        {page_url}<br />
            {if gallery_image}
                <div id="gallery" class="clearfix">
                    {gallery_image offset="{segment_4}" limit="{rows_per_page}"}
                        <div class="{switch="galleryImage|galleryImage|galleryImageLast"}">
                            <a href="{big_image}" rel="lightbox-gallery" title="{image_caption}">{row_id}<img src="{small_image}" alt="{image_title}" /></a>
                        </div>
                    {/gallery_image}    
                </div><!-- End gallery -->


{if segment_4 > rows_per_page}
  <a href="{path='pt_test/pag/{url_title}'}/{exp:simple_math calculate='{segment_4}-{rows_per_page}'}">
    Prev
  </a>
{/if}

{if "{gallery_image:total_rows}" > "{exp:simple_math calculate='{segment_4}+{rows_per_page}'}"}
  <a href="{path='pt_test/pag/{url_title}'}/{if segment_4}{exp:simple_math calculate='{segment_4}+{rows_per_page}'}{if:else}{rows_per_page}{/if}">
    Next
  </a>
{/if}

            {/if}
        {/exp:channel:entries}     

If you visit this on the front-end and use the next and previous links, then you'll see that the pagination is working. I built the Next and Previous links a bit differently than you had, and I've got some diagnostics outputting by echoing out those segments to see what EE sees. But I think you should be able to take this working template and build from there.

Does that help?

Answer 2

I managed to get this working via lots of help from Lisa Wess (legend) and [Freebie][1]. I installed Freebie and set the 'Freebie Segments' to the number of images I wanted per page in my gallery. I then substituted all {segment_x} tags with {freebie_x} tags and changed some conditionals from my previous code above.

My new template code:

             {preload_replace:rows_per_page="3"}
                {exp:channel:entries channel="gallery" url_title="{freebie_2}" dynamic="no"}    
                    {if gallery_image}
                        <div id="gallery" class="clearfix">
                            {gallery_image offset="{freebie_3}" limit="{rows_per_page}"}
                                <div class="{switch="galleryImage|galleryImage|galleryImageLast"}">
                                    <a href="{big_image}" rel="lightbox-gallery" title="{image_title}"><img src="{small_image}" alt="{image_title}" /></a>
                                </div>
                    {/gallery_image}    
                        </div><!-- End gallery -->

                    {if freebie_3 == '3'}
                        <a href="{page_url}/">
                        Prev
                        </a>
                    {if:elseif freebie_3 > rows_per_page} 
                        <a href="{page_url}/{exp:simple_math calculate='{freebie_3}-{rows_per_page}'}">
                        Prev
                        </a>   
                    {/if}

                    {if "{gallery_image:total_rows}" > "{exp:simple_math calculate='{freebie_3}+{rows_per_page}'}"}
                        <a href="{page_url}/{if freebie_3}{exp:simple_math calculate='{freebie_3}+{rows_per_page}'}{if:else}{rows_per_page}{/if}">
                        Next
                        </a>
                    {/if}
                    {/if}
                {/exp:channel:entries}     

            </div><!-- End mainContent -->

Because my gallery was located at www.mysite.com/development/nails/gallery-test/ I had to change some of the {segment_x}/{freebie_x} tags back one, so from {segment_4}/{freebie_4} to {segment_3}/{freebie_3}, previously the code was looking at the wrong url segment.

I hope this explanation saves anyone else from running into this issue with Structure and Matrix image galleries with pagination.

Thanks again to Lisa Wess for all her help!

Answer 3

Stephen, I did some more searching around and came across this tutorial, which uses Freebie:

http://www.idfive.com/blog/2011/02/matrix-structure-freebie-expression-engine-image-gallery/

I am wondering if that might be the answer you're looking for. :)

-Lisa