Forum Discussion

Hoekstra_VFZ's avatar
4 years ago

Pagination instead of 'View more'

Hi,

Recently the awesome design team of Khoros delivered our new communities. Now I am trying to getting to find my may around all the custom stuff.

In this case I want to enable pagination instead of a 'view more' button below the comments in a thread. (This actually was included in the design specs we delivered, so in theory we could raise a ticket to get it fixed. However I need to understand the mechanics of it first).

For instance on our blog pages we do have pagination:
https://community.ziggo.nl/t5/Tips-van-Ziggo/Ziggo-verbetert-de-programma-informatie-in-de-TV-Gids/ba-p/727466

On our forum page we do not (instead an orange button 'Meer reacties laden'):
https://community.ziggo.nl/t5/De-Community/Feedback-over-de-nieuwe-Community-deel-je-hier/td-p/720745

I cannot find a setting in Admin or Atudio. Searching around here on Atlas I get the impression pagination cannot be set. So I dug around the forum page, and components XML a bit.

In Forum Topic Page there is a component message-list-detail-with-inline-editors which I think is the default one containing replies and the pagination section. This component cannot be edited.

In Forum Page (this seems to be the board page? confusing terminology) there is a component custom.message-list. This component can be edited, i can see this inside the component:

<#-- pagination -->
<#if showPaging == "true">
<#assign pagingQry = basePagingQry + whereClause />
<#assign topicCnt = commonUtils.executeLiQLQuery(pagingQry, true) />
<#assign pageableItem = webuisupport.paging.pageableItem.setCurrentPageNumber(pageNum).setItemsPerPage(pageSize?number).setTotalItems(topicCnt).setPagingMode("enumerated").build />
<@component id="common.widget.pager" pageableItem=pageableItem />
</#if>
<#--/pagination -->


This suggests there is a global pagination setting. Now I am lost.
Please help  with the next step to get pagination om my forum pages.

  • Hoekstra_VFZ You can try adding <component id="common.widget.pager"/> in the XML view of forum topic page and then hiding the existing "Load More" button with CSS. This would work.

    If you appreciate my efforts, please give me a kudo ↓
    Accept as solution to help others find it faster.

5 Replies

  • MattV's avatar
    MattV
    Khoros Staff
    4 years ago

    On the Forum Page (yes, aka Board Page), you see a entirely custom message list, and custom code to support paging for it.

    You COULD in theory repurpose that code for paging on the Forum Topic Page, but that would actually be more work than necessary.

    There is a component called simply thread-pager that you could add to the forum topic page (you would have to add this in the XML view for the page in studio, since it doesn't appear in the components list), and would add the pagination, and respect the admin settings, without any additional work. But the message list doesn't have any setting or config to hide the load more, so that would have to be hidden with CSS. 

    Once you do that, you should be good to go.

  • Hoekstra_VFZ You can try adding <component id="common.widget.pager"/> in the XML view of forum topic page and then hiding the existing "Load More" button with CSS. This would work.

    If you appreciate my efforts, please give me a kudo ↓
    Accept as solution to help others find it faster.

  • Hi all,

    The quick solution is the one kritikak came up with. Thanks!

    This is the current quilt of ForumTopicPage:

     

    <quilt layout="custom-two-column-main-side" nestable="false" disableTopCssClass="false">
      <add to="common-footer">
        <component id="quilt:Footer"/>
      </add>
      <add to="side-content">
        <component id="custom.related-content"/>
        <component id="custom.featured-post"/>
      </add>
      <add to="main-content">
        <component id="solution-count-conditional"/>
        <component id="solution-list"/>
        <component id="reply-count-conditional"/>
        <component id="message-list-detail-with-inline-editors"/>
        <component id="common.widget.pager"/>
      </add>
      <add to="common-header">
        <component id="quilt:Header"/>
      </add>
      <add to="main-top-content">
        <component id="topic-message"/>
        <component id="thread-pager"/>
      </add>
    </quilt>

     

    Note that I have added <component id="common.widget.pager"/> and that <component id="thread-pager"/> was allready present in main-top-content. But doesn't seem to do anything in main-content and in main-top-content (We have set threaded mode instead Linear modme on our topics).

    Pagination is visible now! 😎 

    The load more button will be removed in Css, and I will move some other stuff around. But now I have got something to work with.

    I suspect <component id="thread-pager"/> is something depricated?

    Would be intersted to know more about this one.

     

  • Is it possible to add pagination on the TKB articles? 
    I can see the thread pager and custom widget pager available on the TKB message page in the theme.hermes pages. However, it is not showing on any of the TKB pages.