kmarcink2

Ohh, do you then plan to skip this version and implement version 5 when it comes out instead to reduce amount of work your team and the plugin users need to do to fix breaking changes? I am curious because I haven’t seen any new update on your ticket for over a year.

Also, how can I prevent the creation of custom taxonomy and product indexes in Algolia?

E.g. I see there the following indexes:

• prod_terms_book_category
• prod_terms_book_format
• prod_posts_product

Thank you, that’s very kind of you.

Algolia code examples are a great starting point. It works our of the box after adding it to the project. Then I just need to customize it for my needs. So it should not be a challenge. Example.

// 1. Create a render function
const renderRefinementList = (renderOptions, isFirstRender) => {
  const {
    items,
    isFromSearch,
    refine,
    createURL,
    isShowingMore,
    canToggleShowMore,
    searchForItems,
    toggleShowMore,
    widgetParams,
  } = renderOptions;

  if (isFirstRender) {
    const input = document.createElement('input');
    const ul = document.createElement('ul');
    const button = document.createElement('button');
    button.textContent = 'Show more';

    input.addEventListener('input', event => {
      searchForItems(event.currentTarget.value);
    });

    button.addEventListener('click', () => {
      toggleShowMore();
    });

    widgetParams.container.appendChild(input);
    widgetParams.container.appendChild(ul);
    widgetParams.container.appendChild(button);
  }

  const input = widgetParams.container.querySelector('input');

  if (!isFromSearch && input.value) {
    input.value = '';
  }

  widgetParams.container.querySelector('ul').innerHTML = items
    .map(
      item => <br>        <li><br>          <a<br>            href="${createURL(item.value)}"<br>            data-value="${item.value}"<br>            style="font-weight: ${item.isRefined ? 'bold' : ''}"<br>          ><br>            ${item.label} (${item.count})<br>          </a><br>        </li><br>
    )
    .join('');

  [...widgetParams.container.querySelectorAll('a')].forEach(element => {
    element.addEventListener('click', event => {
      event.preventDefault();
      refine(event.currentTarget.dataset.value);
    });
  });

  const button = widgetParams.container.querySelector('button');

  button.disabled = !canToggleShowMore;
  button.textContent = isShowingMore ? 'Show less' : 'Show more';
};

// 2. Create the custom widget
const customRefinementList = connectRefinementList(
  renderRefinementList
);

// 3. Instantiate
search.addWidgets([
  customRefinementList({
    container: document.querySelector('#refinement-list'),
    attribute: 'brand',
    showMoreLimit: 20,
  })
]);

Source: https://www.algolia.com/doc/api-reference/widgets/refinement-list/js/?client=With+a+CDN#full-example

• This reply was modified 1 year, 3 months ago by kmarcink2.

interesting. Do you know when upgraded Autocomple will be rolled out?

Thank you for trying to better understand my setup.

I don’t use the search page and the default facets prepared by the plugin.

I think I only use the content indexing to algolia and and access to Autocomplete/Instantsearch libraries. Everything else I write custom, e.g. ranking, frontend UI, what facets to use, how facets should behave etc.

Here is what I have at the moment.

In this case do you recommend any specific way of using your plugin?

Yes, I am trying to customise the default setup that the plugin does. The site that I am building is a search engine, so I need to make the Algolia UI work on the homepage.

When users interact with facets on the homepage the following url is generated example.com/?facet_name=value1,value2 . When users share this url with others or reload the page, WP redirects this user to the following url example.com/?facet_name=value1%2Cvalue2 , which is what I am trying to prevent.

If I use other page than homepage for the search engine, it should be fine, but I need to use homepage because the website is the search engine.

Do you know maybe why the redirect is happening?

Thank you for your suggestion, it helped me discover something new.

In my setup, the homepage is the page on which I load InstantSearch search and filters. I just discovered that on the homepage, WP automatically encodes comma character in the url parameter, but it does not seem to do it on other pages.

Example 1: Comma ecoded
Entered url: https://ww.wp.xz.cn/?test=sd,ds
URL redirecred to: https://ww.wp.xz.cn/?test=sd%2Cds

Example 2: Comma not encoded
Entered url: https://ww.wp.xz.cn/about/?test=sd,ds

Trying to figure why and if this can be prevented. Do you maybe know?