Как в Woocommerce заменить select на slider js?

Question

[Александр Соболев]

Здравствуйте!
Задача в том, чтобы атрибуты товаров на странице отображались не в виде выпадающего списка, а в виде слайдера (ползунка).
Рассматривал варианты через готовые сторонние плагины вроде WC Fields Factory, и смотрел в сторону стандартной функции вроде woocommerce_form_field(), но нигде нет типа поля slider..

Вопрос: Через какой хук.. или фильтр.. или каким-то иным способом это можно поменять? Какие могут быть решения?

Comments

[Антон Литвиненко]

Не совсем понятно какие атрибуты вы хотите ползунком менять. Это подходит только для таких как цена, размер, тобишь там где меняется только числовое значение. Например цвет так наврядли выйдет менять

[Александр Соболев]

Антон Литвиненко, Витрина Кафе.
Шаурма.. Пицца итд
Больше сыра, Меньше сыра, С Томатами без, Острого соуса больше меньше и так долее по всем ингредиентам

[Антон Литвиненко]

Александр Соболев, чёт мне кажется, что так не выйдет. Ползунок оперирует однотипными данными. Но подождём ещё ответов, самому интересно)

Answer 1

[Пычев Анатолий]

Решение можно увидеть в тех же плагинах, которые заменяют стандартный select на любой другой тип (ярлычки, опции, флажки).

Алгоритм следующий:

• Прикрепляемся к любому хуку на странице товара. Все зависит от места , где вы хотите расположить Ваш элемент.
  
• Добавляете свой элемент.
  
• Скрываете родной select средствами css.
  
• В js при изменении своего элемента менете значение родного select-a и ннаоборот.
  

JS код можно подсмотреть в плагине variation swatches. Можете даже взять его за основу и переделать на свой лад.