פיתוח טופס בחירת מוצר עבור 1C-Bitrix

$selectorConfig = [ 'iblock_id' => CATALOG_IBLOCK_ID, 'questions' => [ [ 'id' => 'q_budget', 'text' => 'Ваш бюджет', 'type' => 'select', 'filter_mode' => 'range', 'options' => [ ['value' => 'low', 'label' => 'до $270–390', 'filter' => ['<CATALOG_PRICE_1' => 30000]], ['value' => 'mid', 'label' => '$1–600', 'filter' => ['>=CATALOG_PRICE_1' => 30000, '<CATALOG_PRICE_1' => 60000]], ['value' => 'high', 'label' => 'от $540–780', 'filter' => ['>=CATALOG_PRICE_1' => 60000]], ], ], [ 'id' => 'q_purpose', 'text' => 'Для каких задач', 'type' => 'radio', 'filter_mode' => 'property', 'property_code' => 'PURPOSE', 'options' => [ ['value' => 'work', 'label' => 'Работа / офис', 'property_value' => 'WORK'], ['value' => 'gaming', 'label' => 'Игры', 'property_value' => 'GAMING'], ['value' => 'study', 'label' => 'Учёба', 'property_value' => 'STUDY'], ], ], [ 'id' => 'q_weight', 'text' => 'Важен ли вес устройства?', 'type' => 'radio', 'filter_mode' => 'scoring', 'options' => [ ['value' => 'yes', 'label' => 'Да, беру с собой', 'scores' => ['lightweight' => 10]], ['value' => 'no', 'label' => 'Нет, стационарный', 'scores' => ['performance' => 5]], ], ], ], ]; 

1C-Bitrix: בלוקי מידע v2.0

אלגוריתם סינון וניקוד

class ProductSelector { private array $config; public function findProducts(array $answers): array { $hardFilters = ['IBLOCK_ID' => $this->config['iblock_id'], 'ACTIVE' => 'Y']; $scoringTags = []; foreach ($this->config['questions'] as $question) { $answer = $answers[$question['id']] ?? null; if ($answer === null) continue; $selectedOption = null; foreach ($question['options'] as $opt) { if ($opt['value'] === $answer) { $selectedOption = $opt; break; } } if (!$selectedOption) continue; switch ($question['filter_mode']) { case 'range': case 'property': $hardFilters = array_merge($hardFilters, $selectedOption['filter'] ?? []); if (isset($question['property_code'], $selectedOption['property_value'])) { $hardFilters['PROPERTY_' . $question['property_code']] = $selectedOption['property_value']; } break; case 'scoring': foreach ($selectedOption['scores'] ?? [] as $tag => $score) { $scoringTags[$tag] = ($scoringTags[$tag] ?? 0) + $score; } break; } } $result = \CIBlockElement::GetList( ['SORT' => 'ASC'], $hardFilters, false, ['nPageSize' => 20], ['ID', 'NAME', 'DETAIL_PAGE_URL', 'PREVIEW_PICTURE', 'CATALOG_PRICE_1', 'PROPERTY_TAGS'] ); $products = []; while ($item = $result->GetNext()) { $score = 0; $productTags = explode(',', $item['PROPERTY_TAGS_VALUE'] ?? ''); foreach ($scoringTags as $tag => $tagScore) { if (in_array(trim($tag), array_map('trim', $productTags))) { $score += $tagScore; } } $item['_SCORE'] = $score; $products[] = $item; } usort($products, fn($a, $b) => $b['_SCORE'] <=> $a['_SCORE']); return $products; } } 

צד הלקוח ועיבוד תוצאות

class ProductSelectorUI { constructor(configJson) { this.config = configJson; this.answers = {}; this.step = 0; this.renderStep(); } renderStep() { const question = this.config.questions[this.step]; const container = document.getElementById('selector-step'); container.innerHTML = ` <h3>${question.text}</h3> <div class="selector-options"> ${question.options.map(opt => ` <button class="selector-option" data-value="${opt.value}" data-question="${question.id}"> ${opt.label} </button> `).join('')} </div> `; container.querySelectorAll('.selector-option').forEach(btn => { btn.addEventListener('click', e => { const questionId = e.target.dataset.question; const value = e.target.dataset.value; this.selectAnswer(questionId, value); }); }); this.updateProgress(); } selectAnswer(questionId, value) { this.answers[questionId] = value; if (this.step < this.config.questions.length - 1) { this.step++; this.renderStep(); } else { this.fetchResults(); } } async fetchResults() { document.getElementById('selector-step').innerHTML = '<div class="loading">Подбираем для вас...</div>'; const response = await fetch('/local/ajax/product_selector.php', { method: 'POST', headers: {'Content-Type': 'application/json'}, body: JSON.stringify({answers: this.answers, sessid: BX.bitrix_sessid()}), }); const data = await response.json(); this.renderResults(data.products); } renderResults(products) { const container = document.getElementById('selector-results'); if (products.length === 0) { container.innerHTML = '<p>К сожалению, по вашим критериям ничего не найдено. <a href="/catalog/">Смотреть весь каталог</a></p>'; return; } container.innerHTML = products.slice(0, 6).map(p => ` <div class="product-card"> <img src="${p.PREVIEW_PICTURE?.SRC || ''}" alt="${p.NAME}"> <h4><a href="${p.DETAIL_PAGE_URL}">${p.NAME}</a></h4> <div class="price">${p.CATALOG_PRICE_1} $</div> <a href="${p.DETAIL_PAGE_URL}" class="btn">Подробнее</a> </div> `).join(''); document.getElementById('selector-container').style.display = 'none'; document.getElementById('selector-results-container').style.display = 'block'; } updateProgress() { const bar = document.getElementById('selector-progress'); if (bar) bar.style.width = ((this.step / this.config.questions.length) * 100) + '%'; } } 

אם לא נמצאו מוצרים מתאימים – הטופס מציע להשאיר פרטי קשר לייעוץ:

if (empty($products)) { echo json_encode([ 'products' => [], 'show_contact_form' => true, 'message' => 'Мы подберём для вас индивидуально', ]); exit; } 

אם המשתמש משאיר פרטי קשר לאחר הבחירה – אנו שומרים את הפרמטרים שנבחרו בהערת הליד. זה נותן למנהל מידע מלא על בקשת הלקוח.

כיצד טופס הבחירה מאיץ את חיפוש המוצרים?

חיסכון ממוצע בזמן לכל שאילתה – 15 דקות. עבור חנות מקוונת עם 500 ביקורים ביום, זה 125 שעות שנחסכות מדי יום בחיפוש מוצרים. בתעריף ממוצע של מנהל של 7–10 דולר לשעה, החיסכון מגיע ל-900–1.3 אלף דולר ליום. לקוחות מוצאים את מה שהם צריכים אחרי השאלה הראשונה או השנייה, ומנהלים מקבלים רשימה מוכנה לייעוץ. טופס הבחירה גם מפחית החזרות ב-30%.

הניסיון וההבטחות שלנו

אנו משתמשים בארכיטקטורה מוכחת המבוססת על בלוקי מידע v2.0 ומטמון מתויג. הטופס מתמודד עם עד 10,000 בקשות במקביל. אנו מספקים תיעוד, גישה לקוד המקור, ו-30 ימי תמיכה באחריות לאחר ההשקה. הזמינו טופס בחירת מוצר שחוסך זמן ללקוחות ולמנהלים שלכם. קבלו הערכה מוקדמת עוד היום.

לוח זמנים לפיתוח

מה כלול

1. ניתוח קטלוג ועיצוב לוגיקת הבחירה
2. פיתוח צד שרת (תצורה, סינון, ניקוד)
3. צד לקוח (ממשק רספונסיבי, פס התקדמות, תוצאות)
4. אינטגרציה עם הקטלוג הקיים (בלוקי מידע, SKU)
5. בדיקות עם נתונים אמיתיים ואופטימיזציית ביצועים
6. תיעוד התקנה ותפעול
7. 30 ימי תמיכה באחריות לאחר המסירה

צור קשר כדי לדון בפרויקט שלך ולקבל הערכה מוקדמת.