Доброго времени суток уважаемый посетитель.
Все мы знаем что в opencart опции в карточке товара, по умолчанию не выбранные и когда покупатель делает покупку в вашем магазине то ему требуется вручную указать нужный параметр опции, то есть выбрать нужную опцию, ( при условии что эта опция присутствует в карточке товара и у нее указан обязательный выбор).
Но что же делать если вы хотите сделать так что бы клиент зашел в карточку товара и первые опции были уже автоматически отмечены.
В принципе сложного здесь ничего нету, и в данной статье мы сегодня научимся делать так что бы опции в товаре были сразу отмечены автоматически.
Для выполнения данной задачи все что нам потребуется так это изменить несколько участков кода в шаблоне вашего магазина, а именно в файле:
|
1 |
catalog/view/theme/default/template/product/product.tpl |
Все манипуляции я буду делать на шаблоне по умолчанию, по этому если у вас шаблон сильно отличается от шаблона по умолчанию, то может быть вам придется делать немного все по другому, но главный принцип всегда остается тот же самый!
Итак давайте уже приступим к нашей задаче и настроим нашу карточку товара сразу с отмеченными опциями.
В магазине используются несколько вариантов опций, но мы будем изменять самые популярные варианты опций из раздела выбор, а именно список, переключатель, флажок и изображение.
Но давайте все по порядку.
1. Выпадающий список
Ну тут все просто, найдите в файле строку:
|
1 |
<option value=""><?php echo $text_select; ?></option> |
И закомментируйте ее или просто удалите, тем самым вы уберете первый параметр из списка (--- Выберите ---) , и на первом месте будет отображаться именно первая опция из списка с меньшим порядком сортировки.
2. Переключатель (Радиокнопка)
Ну тут немного все сложнее, для того что бы отметить именно первую опцию нам нужно сделать так что бы система могла высчитать эту самую первую опцию.
Опции radio button формируются циклом foreach, нам же нужно высчитать именно первый элемент в массиве и дописать ему checked в input.
И так находим код:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<?php if ($option['type'] == 'radio') { ?> <div id="option-<?php echo $option['product_option_id']; ?>" class="option"> <?php if ($option['required']) { ?> <span class="required">*</span> <?php } ?> <b><?php echo $option['name']; ?>:</b><br /> <?php foreach ($option['option_value'] as $option_value) { ?> <input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" /> <label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?> <?php if ($option_value['price']) { ?> (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>) <?php } ?> </label> <br /> <?php } ?> </div> <br /> <?php } ?> |
И заменяем его на :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
<?php if ($option['type'] == 'radio') { ?> <div id="option-<?php echo $option['product_option_id']; ?>" class="option"> <?php if ($option['required']) { ?> <span class="required">*</span> <?php } ?> <b><?php echo $option['name']; ?>:</b><br /> <?php $i = 0; $len = count($option['option_value']); foreach ($option['option_value'] as $option_value) { if ($i == 0) {?> <input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" checked/> <label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?> <?php if ($option_value['price']) { ?> (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>) <?php } ?> </label> <br /> <?php } else { ?> <input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" /> <label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?> <?php if ($option_value['price']) { ?> (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>) <?php } ?> </label> <br /> <?php } $i++; }?> </div> <br /> <?php } ?> |
Таким образом мы сделали отмеченной первую опцию Radio Buttons
3. Флажок (checkbox)
Если вы хотите отметить сразу все флажки данной опции, то просто добавляете "checked" в коде вывода данного типа опции, что бы получилось так:
|
1 |
<input type="checkbox" name="option[<?php echo $option['product_option_id']; ?>][]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" checked /> |
Если же вам нужно отметить только первый чебокс, в первой опции поставить галочку, то вам потребуется проделать тоже самое что и с опцией переключатель а именно:
Находим код:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<?php if ($option['type'] == 'checkbox') { ?> <div id="option-<?php echo $option['product_option_id']; ?>" class="option"> <?php if ($option['required']) { ?> <span class="required">*</span> <?php } ?> <b><?php echo $option['name']; ?>:</b><br /> <?php foreach ($option['option_value'] as $option_value) { ?> <input type="checkbox" name="option[<?php echo $option['product_option_id']; ?>][]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" /> <label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?> <?php if ($option_value['price']) { ?> (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>) <?php } ?> </label> <br /> <?php } ?> </div> <br /> <?php } ?> |
и заменяем его на следующий:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
<?php if ($option['type'] == 'checkbox') { ?> <div id="option-<?php echo $option['product_option_id']; ?>" class="option"> <?php if ($option['required']) { ?> <span class="required">*</span> <?php } ?> <b><?php echo $option['name']; ?>:</b><br /> <?php $i = 0; $len = count($option['option_value']); foreach ($option['option_value'] as $option_value) { if ($i == 0) {?> <input type="checkbox" name="option[<?php echo $option['product_option_id']; ?>][]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" checked /> <label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?> <?php if ($option_value['price']) { ?> (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>) <?php } ?> </label> <br /> <?php } else { ?> <input type="checkbox" name="option[<?php echo $option['product_option_id']; ?>][]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" /> <label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?> <?php if ($option_value['price']) { ?> (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>) <?php } ?> </label> <br /> <?php } $i++; }?> </div> <br /> <?php } ?> |
Теперь вы уже знаете как сделать отмеченной опцию чебокс, теперь давайте проделаем еще вариант с изображениями.
4. Изображение
Здесь нам нужно проделать в принцыпе тоже самое что и в опциях флажок и переключатель, только код будет выглядеть чуточку по другому так как сдесь еще выводятся фото опций.
И так опять же находим код:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<?php if ($option['type'] == 'image') { ?> <div id="option-<?php echo $option['product_option_id']; ?>" class="option"> <?php if ($option['required']) { ?> <span class="required">*</span> <?php } ?> <b><?php echo $option['name']; ?>:</b><br /> <table class="option-image"> <?php foreach ($option['option_value'] as $option_value) { ?> <tr> <td style="width: 1px;"><input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" /></td> <td><label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><img src="<?php echo $option_value['image']; ?>" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" /></label></td> <td><label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?> <?php if ($option_value['price']) { ?> (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>) <?php } ?> </label></td> </tr> <?php } ?> </table> </div> <br /> <?php } ?> |
и заменяем его на код ниже:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 |
<?php if ($option['type'] == 'image') { ?> <div id="option-<?php echo $option['product_option_id']; ?>" class="option"> <?php if ($option['required']) { ?> <span class="required">*</span> <?php } ?> <b><?php echo $option['name']; ?>:</b><br /> <table class="option-image"> <?php $i = 0; $len = count($option['option_value']); foreach ($option['option_value'] as $option_value) { if ($i == 0) {?> <tr> <td style="width: 1px;"><input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" checked /></td> <td><label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><img src="<?php echo $option_value['image']; ?>" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" /></label></td> <td><label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?> <?php if ($option_value['price']) { ?> (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>) <?php } ?> </label></td> </tr> <?php } else { ?> <tr> <td style="width: 1px;"><input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" /></td> <td><label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><img src="<?php echo $option_value['image']; ?>" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" /></label></td> <td><label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?> <?php if ($option_value['price']) { ?> (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>) <?php } ?> </label></td> </tr> <?php } $i++; }?> </table> </div> <br /> <?php } ?> |
Ну вот в принципе и все что нам требовалось сделать, данный метод работает на всех версиях opencart версий 1.5.... для второй версии в принцыпе тоже вариант подходит но там нужно будет чуточку другой код, общим пробуйте , тестируйте, задавайте вопросы по возможности ответим.
2 комментария
Как такое проделать на версии 2.3.0.2 (rs.6) ?
В общей сложности все так же само, только у вас немного другой код, нужно смотреть и сравнивать Ваша ветка кардинально отличается от предыдущих.
Готовой инструкции для вашей версии под рукой нету. Могу только предложить индивидуальную доработку.