Configuring KnpPaginator to work with Twitter Bootstrap

Vendor folder
I am trying to apply twitter bootstrap css style pagination without modifying the provider.
Is there a way to configure KnpPaginator to detect existing bootstrap css stylesheets? Since, as the screenshot shows, it is built to work with bootstrap.

+7
twitter-bootstrap symfony knppaginator
source share
2 answers

@Derick F: Thank you so much, I found another way:
I just replaced:

pagination: KnpPaginatorBundle:Pagination:sliding.html.twig 

from

 pagination: KnpPaginatorBundle:Pagination:twitter_bootstrap_v3_pagination.html.twig 

its default template is included with the knp kit.

+18
source share

Yes, in the config.yml and knp_paginator :

 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 %} 
+8
source share

All Articles