Pagination Appears Broken

Upon installing Bundable, you may notice that the pagination near your footer appears to be broken or out-of-place (see example). Because there are so many themes out there, it's difficult to guarantee seamless integration with all of them. Luckily, there is an easy fix here!

https://d33v4339jhl8k0.cloudfront.net/inline/65628/66b730a26c0f8970fed00860c9541ea57828dd1a/e86f5eb1ff3b4afc29c8c8f8f289139fac38d266/image001.png

https://d33v4339jhl8k0.cloudfront.net/inline/65628/460f1948842061d491c2aa36b508a583729c84d8/4bff0dc8efc7d40cf64866f8b67b57ea116bcea7/image002.png

Fixing Pagination

  1. Go to your Shopify admin.
  2. Head to Online Store > Themes > Edit Code
  3. In the code editor, click through to theme.liquid on the left hand side. This will open the general liquid code for your theme.
  4. Most themes will have all the code nestled within the <body></body> tags. Copy and paste the below code right before the closing </body> tag and Save Changes.
<!-- Bundable Code Start -->
{% if request.path contains 'bundle-builder' %}
<style>
#bdlr__bundle-widget .bdlr__products--inner {
  position: static;
  height: auto;
}
#bdlr__bundle-widget .bdlr__products {
  height: auto;
}
.pagination li {
  display: inline-block;
}
.pagination {
  text-align: center;
}
body #PageContainer {
  max-width: inherit;
  padding: 0;
  margin: 0 auto;
}
</style>
{%endif%}
<!-- Bundable Code End -->

Still need help? Contact Us Contact Us