Разработка конвертера размеров (RU/EU/US/UK) на 1С-Битрикс

Разработка конвертера размеров (RU/EU/US/UK) на 1С-Битрикс

Возвраты из-за неправильного размера — головная боль любого интернет-магазина одежды или обуви. Покупатель вводит свой US 8, получает неподходящий товар, пишет претензию. Мы разрабатываем конвертер размеров на 1С-Битрикс, который мгновенно переводит RU/EU/US/UK системы, снижая процент возвратов на 15–30% (опыт наших проектов). В отличие от статичной таблицы, конвертер решает конкретную задачу пользователя: «я знаю свой американский размер, скажите российский». Это разные инструменты с разными сценариями использования, хотя данные для обоих берутся из одного источника.

Сценарии использования конвертера

Сценарий 1: Конвертер на странице каталога или категории. Пользователь ещё не выбрал товар, хочет разобраться с размерной сеткой. Отдельная страница /razmer/ или блок в сайдбаре.

Сценарий 2: Конвертер в модальном окне на карточке товара. Прямо при выборе размера — удобнее всего, не уводит со страницы.

Сценарий 3: Inline-конвертер рядом с выбором торговых предложений. Компактный виджет «Не знаете свой размер? Введите US/EU:» рядом с кнопками ТП.

Как конвертер снижает возвраты?

Конвертер работает мгновенно, без перезагрузки страницы. Данные загружаются один раз при инициализации и обрабатываются на клиенте. Это исключает ошибки перевода и снижает когнитивную нагрузку на покупателя. В наших проектах внедрение конвертера уменьшало возвраты по причине «не подошёл размер» в среднем на 20%.

Хранение данных конвертера

Данные конвертации берутся из тех же таблиц, что и для таблицы размеров. Важно, что конвертер работает в обе стороны: из любой системы в любую. Поэтому структура данных должна это поддерживать — все системы хранятся в одной строке:

-- Та же таблица, что для таблицы размеров SELECT size_ru, size_eu, size_us_m, size_us_w, size_uk, foot_length_mm FROM b_shoe_size_rows WHERE chart_id = ? ORDER BY foot_length_mm ASC; 

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

Реализация конвертера: клиентская логика

Для UX конвертер должен работать мгновенно, без сетевых запросов. Данные загружаются один раз при инициализации страницы (или при открытии модального окна) и затем обрабатываются на JS:

// Данные прокидываются из PHP в JSON при загрузке страницы const sizeData = <?= json_encode($arResult['SIZES'], JSON_UNESCAPED_UNICODE) ?>; // Структура: [{size_ru: 40, size_eu: 40, size_us_m: 7, size_us_w: 8.5, size_uk: 6, ...}] function convertSize(fromSystem, value, toSystem) { const numValue = parseFloat(value); const row = sizeData.find(r => { const fieldName = `size_${fromSystem}`; return parseFloat(r[fieldName]) === numValue; }); if (!row) return null; return row[`size_${toSystem}`]; } 

Форма конвертера:

<div class="size-converter"> <select id="from-system"> <option value="ru">RU</option> <option value="eu">EU</option> <option value="us_m">US (муж.)</option> <option value="us_w">US (жен.)</option> <option value="uk">UK</option> </select> <input type="text" id="size-input" placeholder="40"> <button onclick="doConvert()">Конвертировать</button> <div id="conversion-result" hidden> <table class="result-table"> <tr><th>RU</th><th>EU</th><th>US M</th><th>US W</th><th>UK</th></tr> <tr id="result-row"><!-- заполняется JS --></tr> </table> </div> </div> 

function doConvert() { const from = document.getElementById('from-system').value; const value = document.getElementById('size-input').value.trim().replace(',', '.'); const row = sizeData.find(r => String(r[`size_${from}`]) === value); if (!row) { document.getElementById('conversion-result').hidden = true; alert('Размер не найден. Проверьте введённое значение.'); return; } document.getElementById('result-row').innerHTML = ` <td>${row.size_ru}</td> <td>${row.size_eu}</td> <td>${row.size_us_m}</td> <td>${row.size_us_w}</td> <td>${row.size_uk}</td> `; document.getElementById('conversion-result').hidden = false; } 

Автодополнение ввода

При вводе в поле конвертера появляются подсказки с доступными значениями — это предотвращает ввод несуществующих размеров:

const input = document.getElementById('size-input'); input.addEventListener('input', function() { const from = document.getElementById('from-system').value; const query = this.value; const suggestions = sizeData .map(r => String(r[`size_${from}`])) .filter(v => v.startsWith(query)); renderSuggestions(suggestions); }); 

Что нужно учесть при интеграции с фильтром?

Расширенный кейс: конвертер интегрируется с умным фильтром Битрикс. Пользователь вводит свой US 8, конвертер переводит в RU 40–41, фильтр автоматически устанавливает значение «Размер: 40, 40.5, 41» и показывает только подходящие товары.

function applyToFilter(sizeRu) { const filterCheckboxes = document.querySelectorAll(`[data-filter-size="${sizeRu}"]`); filterCheckboxes.forEach(cb => { cb.checked = true; cb.dispatchEvent(new Event('change')); }); } 

Это требует доработки шаблона умного фильтра и добавления data-атрибутов к чекбоксам размеров.

SEO конвертера

Отдельная страница конвертера может привлекать трафик по запросам «конвертер размеров обуви», «перевести US размер в российский». Для этого страница должна:

• Иметь семантическое название и описание
• Содержать статичную таблицу размеров (которую индексируют поисковики, в отличие от динамически сгенерированной через JS)
• Иметь структурированные данные Table в Schema.org

Процесс разработки

1. Анализ размерных сеток поставщиков и формирование единой таблицы соответствия.
2. Проектирование UX: выбор сценариев (модальное окно, inline, отдельная страница).
3. Реализация на PHP (инфоблоки, HL-блоки, компонент 2.0) и JS (конвертация, автодополнение).
4. Интеграция с 1С через CommerceML для автоматического обновления данных.
5. Тестирование на всех устройствах и браузерах.
6. Деплой и настройка кэширования (тегированное кэширование компонента).

Что входит в работу

• Анализ размерных сеток и подготовка данных
• Разработка компонента конвертера с автодополнением
• Интеграция с умным фильтром (опционально)
• SEO-страница конвертера со статической таблицей и Schema.org
• Интеграция с 1С: обмен данными через CommerceML
• Обучение сотрудников работе с конвертером
• Техническая поддержка в течение 2 недель

Сроки

Конвертер размеров — один из самых быстрых в разработке инструментов снижения возвратов. Небольшой объём работы, прямой измеримый эффект. Закажите разработку конвертера — свяжитесь с нами для консультации. Оценим ваш проект и предложим оптимальное решение.