Configure KnpPaginator to work with Twitter Bootstrap

Question

i'm trying to apply twitter bootstrap css style to my knp pagination without modifying the vendor.
Is there a way to configure KnpPaginator so to detect existing bootstrap css style sheets?because as the screenshot shows, it is build to work with bootstrap.

Answer 1

@Derick F: thank you a lot, i found an other way :
i just replaced:

pagination: KnpPaginatorBundle:Pagination:sliding.html.twig

with

pagination: KnpPaginatorBundle:Pagination:twitter_bootstrap_v3_pagination.html.twig

its the default template included in knp bundle.

Answer 2

Yes, in your config.yml and your knp_paginator settings:

knp_paginator:
    template:
         pagination: AcmeBundle:Common:paginator-bootstrap.html.twig

and then in paginator-bootstrap.html.twig

{% if pageCount > 1 %}
    <ul class="pagination">
    {% if first is defined and current != first %}
        <li class="first"><a href="{{ path(route, query|merge({(pageParameterName): first})) }}">&lt;&lt;</a></li>
    {% endif %}

    {% if previous is defined %}
        <li class="previous"><a class="hidden-xs" href="{{ path(route, query|merge({(pageParameterName): previous})) }}">&lt;</a></li>
    {% endif %}

    {% for page in pagesInRange %}
        {% if page != current %}
            <li class="page"><a href="{{ path(route, query|merge({(pageParameterName): page})) }}">{{ page }}</a></li>
        {% else %}
            <li class="current active"><a>{{ page }} <span class="sr-only">(current)</span></a></li>
        {% endif %}
    {% endfor %}

    {% if next is defined %}
        <li class="next"><a class="hidden-xs" href="{{ path(route, query|merge({(pageParameterName): next})) }}">&gt;</a></li>
    {% endif %}

    {% if last is defined and current != last %}
        <li class="last"><a href="{{ path(route, query|merge({(pageParameterName): last})) }}">&gt;&gt;</a></li>
    {% endif %}
    </ul>
{% endif %}