Next-page button for the Gbook module
Previous article Next articleThe Gbook module for CMS Made Simple shows guestbook replies in a paginated view. I wanted to show the replies all under each other and with "endless scrolling".
How to use
First you create a new "summary view" Gbook template and load the default template content.
The code related to pagination can be removed, so you will end up with something like:
{foreach from=$gbook_entries item='gbook_entry'}
<div class="gbook_entry">
<div class="gbook_entry_date">{$gbook_entry->create_date|date_format:'%x %R'}</div>
<div class="gbook_entry_name">{$gbook_entry->name}</div>
<div class="gbook_entry_title">{$gbook_entry->title}</div>
<div class="gbook_entry_message">{$gbook_entry->message}</div>
{if $gbook_entry->rating && $gbook_props.allow_rating}
<div class="gbook_entry_rating">
{for $i=1 to 5}
{if $i <= $gbook_entry->rating}
<img src="modules/Gbook/images/star_full.png" alt="{$i}" />
{else}
<img src="modules/Gbook/images/star_empty.png" alt="{$i}" />
{/if}
{/for}
</div>
{/if}
</div>
{/foreach}
</div>
Now you add at the top of the template the line:
And at the bottom:
<div>
{foreach from=$gbook_pagelinks key='pagenumber' item='pagelink'}
{if $pagenumber == $gbook_currentpage+1}
<a href="{$pagelink}" class="jscroll-link" rel="nofollow">Load More »</a>
{/if}
{/foreach}
</div>
{/if}
</div> {* +++ end .jscroll-content +++ *}
Set the new template as the default one! At this moment opening the guestbook page will show you the first page of replies. Clicking at the Load More link will open the next page with replies.
Lazy loading/Endless scrolling
The Load More link contains the jscroll-link class. This class can be used to automate the loading of new replies. Read more about how to create this at: https://www.cmscanbesimple.org/blog/cmsms-modules-and-endless-scrolling »
Note: change in this tutorial the required jQuery code the contentSelector from .jscroll to .jscroll-content !!
Working example
Comment Form
ReviewManager
ReviewManager
0 Comments
No comments yet...