cryogen-project / cryogen

A simple static site generator written in Clojure
http://cryogenweb.org/
Eclipse Public License 1.0
1.09k stars 96 forks source link

[feature] pagination for posts summary #234

Open kwladyka opened 3 years ago

kwladyka commented 3 years ago

Currently there is a way to do prev / next but not 0, 1, 2, ...

    <div id="prev-next">
        {% if prev-uri %}
        <a class="button left" href="{{prev-uri}}">&laquo; Prev</a>
        {% endif %}
        {% if next-uri %}
        <a class="button right" href="{{next-uri}}">Next &raquo;</a>
        {% endif %}
    </div>

I would like to add numbers between prev and next like in the example below. image

To make it possible we need to add data to Selmer with page index, URL, is page active.

Here is a Hugo example:

{{ if gt $paginator.TotalPages 1 }}
<nav>
    <ul class="pagination justify-content-center" style="flex-wrap: wrap">
        <li class="page-item{{ if not $paginator.HasPrev }} disabled {{ end }}">
            <a class="page-link" href="{{ if $paginator.HasPrev }}{{ $paginator.Prev.URL }}{{ end }}">
                <span aria-hidden="true">&laquo;</span>
            </a>
        </li>
        {{ range .Paginator.Pagers }}
        <li class="page-item{{ if eq . $paginator }} active{{ end }}"><a class="page-link" href="{{ .URL }}">{{ .PageNumber }}</a></li>
        {{ end }}
        <li class="page-item{{ if not $paginator.HasNext }} disabled {{ end }}">
            <a class="page-link" href="{{ if $paginator.HasNext }}{{ $paginator.Next.URL }}{{ end }}">
                <span aria-hidden="true">&raquo;</span>
            </a>
        </li>
    </ul>
</nav>
{{ end }}

This is the part which Cryogen doesn't have:

        {{ range .Paginator.Pagers }}
        <li class="page-item{{ if eq . $paginator }} active{{ end }}"><a class="page-link" href="{{ .URL }}">{{ .PageNumber }}</a></li>
        {{ end }}

So we need something in that taste.

holyjak commented 3 years ago

Could you use :extend-params-fn to add the pagination data you want so that you could use it in your Selmer templates? See http://cryogenweb.org/docs/customizing-cryogen.html

If you figure it out, please consider contributing the "recipe" to http://cryogenweb.org/docs/customizing-cryogen.html