Pagination by twig

This page demonstrates how you can paginate data.
First switch “urlparam” at the plugins options at “Shortcode-Attributes” to on. Then “…?no=3” will work.

Shortcode:

[jsoncontentimporterpro parser=twig id=NO_OF_TEMPLATE_BELOW url=https://api.meetup.com/2/open_events?lat=48.1250724792&lon=11.5571479797&key=... urlparam=no]

twig template:

no of found meetups: {{meta.total_count}}<br>
{% set noonpage = 20 %}
{% set noofpages = (meta.total_count/noonpage) | round(0, 'ceil') %} show on {{noofpages}} pages:
{% for i in 1..noofpages %} 
{% if i==urlparam.no %} 
<b>this is page: </b>
{{urlparam.no}}
{% else %} 
<a href=?no={{i}}>{{i}}</a>
{% endif %} 
{% endfor %}<br>
{% set start = noonpage *(urlparam.no-1)+1 %}
{% set end= noonpage *(urlparam.no) %} 
{% if start < 1 %} {% set start = 1 %} {% set end = noonpage %} {% endif %} show {{start}} to {{end}} &
<hr>
{% if meta.total_count==0 %} No meetup found {% endif %} <ul>
{% for event in results %} 
{% if loop.index0<end+1 and loop.index0 > start-1 %} <li>
{{loop.index0}} <a href="{{event.event_url}}" target=_"blank">{{event.name}}</a>
<br>
{% set realtime= event.time %} 
{% set shortts = realtime |slice(0,10) %}
{% if shortts|date("H:i")=="00:00" %} {{shortts|date("d.m.Y") }} {% else %} {{shortts|date("d.m.Y, H:i") }} Uhr {% endif %} {% if event.venue.city!="" %} , <a href="https://www.google.de/maps/place/{{event.venue.lat}},{{event.venue.lon}}" target="_blank">{{event.venue.name}}, {{event.venue.address_1}}, {{event.venue.city}}</a>
{% endif %} {% endif %} {% endfor %} 
</ul>

Example in action:

no of found meetups: 420
show on 21 pages: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21
show 1 to 20