Solved Templates

Newsberg pagination responsive

Asked by Isidro 3 years ago Last activity 3 years ago

Newsberg template pagination is not working as expected. For small devices, when pagination shows 10+ pages, the list doesn't "shrink", showing all page numbers from 1 to 10, plus "Previous" and "Next" buttons at both sides when available, and part of that content overflows the screen.

I've tested it directly with latest J3 Newsberg 2.0.0 quickstart. Just copy 100 from existing articles into, for example, "Entertainment" category, and browse in the frontend to /entertainment section, enable responsive view in Firefox/Chrome/whatever and you'll see what I'm talking about.

Is there any quick fix for this? Thanks in advance.

Accepted answer

Marked as the solution
Toufiq Senior Staff

add this css code

.com-content-category-blog__pagination ul {
    display: flex;
    flex-wrap: wrap;
}

6 more replies

Toufiq Senior Staff

Hi there,

I appreciate you reaching out. I sincerely apologize for this oversight. Will you please provide me the Joomla administrator access to check the issue? I will check & get back to you soon. 

-Thanks

Isidro Asked this

Hi

As I said, I just installed the quickstart locally without any modifications, just made a copy of several existing articles, added them to a specific category and checked. You might be able to do that with your existing demo site. I have no remote site to show you, but the issue is there, believe me. Thanks!

Isidro Asked this

Hi Toufiq.

Thanks a lot for the follow up with this. I made a copy of 100 existing articles into "business" category. If you enable responsive view tool in your browser and select a mobile screen size you'll see that pagination is not "adapting" to the screen size as it's supposed to do:

http://helix-framework.org/user/newsberg/index.php/business-blog

Hope this is enough to point the devs in the right direction to fix the issue. Thanks a lot!

Isidro Asked this

Hi Toufiq

Thanks a lot for the quick reply. This "workaround" makes the pagination usable.

I thought Joomla's Cassiopeia's pagination shrinked to fit small screens automatically, but I just checked and it has the same problem. Actually, I found it's a reported bug for Joomla 4:

https://issues.joomla.org/tracker/joomla-cms/32674

I would suggest to add some extra CSS and/or javascript so the pagination would adapt to the screen size showing only 3-4 page numbers in small devices for future versions. Maybe you could just add an override for Helix Ultimate for pagination, as suggested in the thread I posted above.

Thanks for the support!

Toufiq Senior Staff

We will improve in the future. Thanks for your suggestion.

Log in to reply.