Change Pagination to Endless Scrolling

Front page Support Forums Ikebana Theme Support Change Pagination to Endless Scrolling

This topic contains 19 replies, has 2 voices, and was last updated by  chao 4 years ago.

Viewing 10 posts - 1 through 10 (of 20 total)
  • Author
    Posts
  • #1734

    chao
    Participant

    Hi, can I change the pagination style at the portfolio page (Page 1, 2, 3, etc.) with a Read More Button – endless scrolling style?

    If yes, just point me to the file that is needed to edit, and some insight in case I break the theme :D

    #1736

    satori
    Member

    Hey Chao,

    Ikebana has not been explicitly tested with the infinite scroll so far, but the theme’s portfolio masonry layout is based on Isotope, which can be combined with Paul Irish’s Infinite Scroll plugin. Thus with some customizations and changes to the theme’s code it should be possible to use the infinite scroll function; for the sake of clarity, please note that such changes are not covered by the theme’s support guarantee on ThemeForest because they are classified as theme customization. To implement the infinite scroll, you will need to integrate the plugin itself, as well as most probably edit the theme’s “header-functions.php” and “page_portfolio.php” template files.

    Should you have more questions, do not hesitate to ask!

    Sincerely,
    Andrew / Satori Studio

    #1747

    chao
    Participant

    Yeah, I get it. However, it seems paginate_links() function doesn’t work on page with portfolio template, which means the said plugin can’t get the data from portfolio post type.

    Are there any workaround this?

    • This reply was modified 4 years ago by  chao.
    #1749

    chao
    Participant

    Also, how can I style the position of the generated portfolio-item? They always have width: 100% or something after using endless plugin. Are there any hints? etc.

    There is an error though

    TypeError: $(…).masonry is not a function @ /wp-content/plugins/infinite-scroll/behaviors/masonry-isotope.js?ver=2.6.1:18

    I tested it with WP default, it was fine

    • This reply was modified 4 years ago by  chao.
    #1751

    chao
    Participant

    Ok, I found out that the error is the main problem, and also the plugin jquery files are not included in the portfolio template static page.

    How can I fix both of them?

    #1752

    chao
    Participant

    Sorry, I fixed the error: “the plugin jquery files are not included in the portfolio template static page. ” by modifying the plugin file

    Now, there is only one problem which I have no idea how to fix it

    TypeError: $(…).masonry is not a function @ /wp-content/plugins/infinite-scroll/behaviors/masonry-isotope.js?ver=2.6.1:18

    And also

    “how can I style the position of the generated portfolio-item? They always have width: 100% or something after using endless plugin. Are there any hints? etc.”

    • This reply was modified 4 years ago by  chao.
    #1757

    satori
    Member

    Hey Chao,

    I apologize for the delay in my reply!

    The WordPress plugin based on the Infinite Scroll will not function with Ikebana’s portfolio layout because the latter is based on the Isotope masonry layout and the former only envisages simple multi-page blog-type pages. The Isotope uses a special method called “appended” to add new items, which is not included into the WordPress plugin for Infinite Scroll.

    You would need to use the plain jQuery version of the Infinite Scroll with Ikebana’s portfolio page.

    Anyhow, I will implement the effect on your website, since I was planning to add it to the theme anyway. Please send me your ftp account login and password – I’ve made a typo in the php code while altering the needed files on your website, now it can only be fixed by re-uploading the correct files via ftp (you can do it yourself if you wish – just upload the file from this archive into the “wp-content/themes/Ikebana/” directory on your install.

    Sincerely,
    Andrew / Satori Studio

    #1764

    chao
    Participant

    Hi again, I have fixed the function file with your version.

    So what is the next step? Do I need to implement plain Jquery of the scroll into the page myself or just leave it there?

    I sent you the ftp details anyway. It’s in the support mail

    • This reply was modified 4 years ago by  chao.
    #1772

    satori
    Member

    I’ve inserted the code into the parent theme’s header-functions.php instead of the child’s and it works now ;)

    For the record, in total during the setup of the Infinite Scroll I’ve made changes to the following files:
    – added folder /infinitescroll/ to the parent theme’s /scripts/ folder
    – modified parent’s “functions.php”
    – modified parent’s “header-functions.php”
    – modified child’s “page_portfolio.php”

    Important notice: the plugin does not take into account sticky posts in its architecture, thus in case you have sticky posts, they will keep re-appearing at the very bottom of the page once you scroll all the way down; it is therefore advised not to have sticky portfolio projects while the plugin is active.

    Sincerely,
    Andrew / Satori Studio

    #1775

    chao
    Participant

    All right, thank you :). This feature is cool and you should add it into your theme btw. Next Page is so yesterday.

    Wait, there is a problem. I can’t click to access the project posts that are rendered by scrolling. Is there anything wrong

    • This reply was modified 4 years ago by  chao.
Viewing 10 posts - 1 through 10 (of 20 total)

You must be logged in to reply to this topic.