Home › Forums › Pro Support › Issue with Ajax Pagination
Tagged: Ajax Pagination
- This topic has 20 replies, 3 voices, and was last updated 2 years, 6 months ago by
Tom.
-
AuthorPosts
-
July 7, 2020 at 12:49 pm #17227
Alan
ParticipantI set up a list using Ajax pagination with 9 posts per page. When I click on the “Load More” button, the “Learn More” text for each of the subsequent groups of 9 posts appears outside of the button, and the button size is greatly reduced.
Additionally, the amount of space between the photo and Entry Title is not consistent for each post. You can see the page on my staging site here https://savacaystage.wpengine.com/destinations/amazon-tours-cruises/. Any suggestions on how to correct?
July 7, 2020 at 3:14 pm #17237Tom
KeymasterThat’s strange. I assume the image issue is because of lazy loading – what plugin are you using for that?
Never seen the read more issue – it’s completely changed the HTML. Can you try deactivating your other plugins to see if something is conflicting?
July 9, 2020 at 6:15 am #17277Alan
ParticipantTom:
I am using BJ Lazy Loading, but that was not the cause of the problem. It was Handl UTM Grabber plugin, which I use for conversion tracking on my live site. With that deactivated, he first issue is resolved. Any thoughts on how to correct the spacing issue between the photo and entry title?
Also, how can I change the color of the “Load More” button globally for all lists?
Thanks,
July 9, 2020 at 2:12 pm #17281Tom
KeymasterHi there,
Try this:
.wpsp-content-wrap .wp-show-posts-entry-header { margin-top: 0; }
As for the read more buttons – do you want to use that one style everywhere, or do you want the WPSP buttons to inherit your theme-styled buttons?
July 9, 2020 at 4:08 pm #17283Alan
ParticipantTom:
Just to be clear, we are talking about the Ajax “Load More” button, which loads (in my case) nine additional posts every time it is clicked. Styling it similar to the Blog “Load More” label would be fine. You can see the blog here https://savacaystage.wpengine.com/blog/.
The spacing issue is resolved…
July 10, 2020 at 2:42 pm #17300Tom
KeymasterAh, that button is inhering the styling from your theme (GeneratePress).
If you need to change it, you’d need to:
a) Change the styling of buttons in the theme Customizer
b) Use CSS to manually adjust it as neeeded:.load-more .button { background-color: #000; color: #fff; /* etc.. */ }
July 11, 2020 at 3:49 am #17318Zdeněk
ParticipantHi Tom,
I would like to customization Load more button, but I can’t do it. There are no options in plugin settings. If I change colors in Global Theme Customizer (Colors/Buttons) – I use GeneratePress – no change.
I would also like to change the content of the button. Please advise me how to proceed or what specific css file to change. Thanks a lot.July 11, 2020 at 3:29 pm #17324Tom
KeymasterThis button is using standard GP styles, so the Customizer should definitely work: https://www.screencast.com/t/eXEpSgTwlE6J
You can adjust the text like this:
add_filter( 'wpsp_ajax_load_more', function() { return 'Load more'; } ); add_filter( 'wpsp_ajax_loading', function() { return 'Loading'; } );
July 11, 2020 at 11:31 pm #17340Zdeněk
ParticipantI tried it again in Customizer, but no changes: htts://www.mestopacov.cz/upload/button.mp4
I’m sorry, but I’m a self-taught beginner, can you please explain in detail where to paste the code:
add_filter( ‘wpsp_ajax_load_more’, function() {
return ‘Load more’;
} );add_filter( ‘wpsp_ajax_loading’, function() {
return ‘Loading’;
} );Thanks in advance.
Zdenek
July 12, 2020 at 12:55 am #17343Zdeněk
ParticipantOK, problem with changing language solved. I edited wp-show-posts-pro.php file with your code.
The only problem now remains – customization colors.
Thx.
July 12, 2020 at 2:39 pm #17348Tom
KeymasterThat code should be added using one of these methods: https://docs.wpshowposts.com/article/adding-php/
As for the colors, can you confirm that the options in Customize > Colors > Buttons don’t change the button color?
July 13, 2020 at 4:36 am #17369Zdeněk
ParticipantYep, when i try change colors in Generatepress Theme – Customizer (Customize/Colors/Buttons) – no change. See video here: https://youtu.be/LYViXEqymGg
thx.
July 13, 2020 at 2:28 pm #17383Tom
KeymasterAh, that’s not a GP button, that’s a WPSP button. It should inherit the colors you have an in the read more button styling of that list.
In your list settings, find the button class option (https://docs.wpshowposts.com/article/content-overview/) and give it this class:
button
That will make it use the GP button styles.
July 14, 2020 at 3:04 am #17398Zdeněk
ParticipantI really don’t know what I’m doing wrong 🙁 https://youtu.be/ghaKupU0KXI
July 14, 2020 at 2:27 pm #17407Tom
KeymasterWhich page can I see that button on? Not able to find it.
-
AuthorPosts
- You must be logged in to reply to this topic.