Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

InfiniteHits : specify CSS class for "show more" button

See original GitHub issue

Do you want to request a feature or report a bug?

A feature

Feature: What is your use case for such a feature?

I would like to be reuse an existing CSS class to style the button.

Feature: What is your proposed API entry? The new option to add? What is the behavior?

You could add options.cssClasses.showMoreButton option, then the classes would be added to the <button> element.

What is the version you are using? Always use the latest one before opening a bug issue.

1.11.11

Issue Analytics

State:
Created 6 years ago
Reactions:6
Comments:9 (9 by maintainers)

Top GitHub Comments

1reaction

Sponecommented, Jul 6, 2018

Here you go: https://github.com/algolia/instantsearch.js/pull/3026

1reaction

mthuretcommented, Jan 16, 2018

If I’m not mistaken, with the IS.css new guidelines, the classname will be directly on the button and therefore the possibility of overriding it with an option will derive from it. Is it correct? @bobylito @ronanlevesque cf: https://instantsearch-css.netlify.com/widgets/infinite-hits/

Top Results From Across the Web

infiniteHits | InstantSearch.js - Algolia

The infiniteHits widget is used to display a list of results with a “Show more” button. To configure the number of hits to...

Styling infiniteHits with Algolia search - css - Stack Overflow

I have an Algolia search widget set up in my site, however the results all have their list number next to them. How...

InfiniteHits - InstantSearch specs

Choose a CSS theme: ... Show previous and show more disabled ... </li> </ol> <button class="ais-InfiniteHits-loadMore">Show more results</button> </div>.

algolia/react-instantsearch-widget-loadmore-with-progressbar

A custom show more React button component. className, string, false, -, Custom CSS classes. translations. object.

W3.CSS Buttons - W3Schools

w3-block, Class that can be used to define a full width (100%) button. ... two (or more) button bars on the same line,...