Knowledgebase
-
Lagom orderform Integration
Lagom orderform Integration
File configureproduct.tpl. Replace condition from {if $addons} to closing {/if} with code below to support grouped addons.
{if $addons} <style> .panel-grouped-addons .panel-heading a:after { font-family: 'Font Awesome 5 Pro'; content: '\f078'; float: right; color: grey; font-size: 14px; } .panel-grouped-addons a { color: grey; } .panel-grouped-addons .panel-heading a[aria-expanded=false]:after { content: '\f077'; } .panel-grouped-addons ul.list-group { margin-bottom: 0; } .panel-grouped-addons ul.list-group li:nth-of-type(even) { background-color: #f6f7f8; } .panel-grouped-addons .list-group-item { text-align: left !important; border-width: 0; padding: 15px 30px; } .panel-grouped-addons a:focus, .panel-grouped-addons a:hover { text-decoration: none; } .panel-grouped-addons.panel-sidebar, #order-standard_cart .panel-grouped-addons label { font-size: 15px; } .panel-grouped-addons .icheckbox_square-blue { margin-right: 7px; } .panel-grouped-addons .addon-pricing { font-size: 15px; color: #666; } </style> <div class="section m-t-48"> <h3>{$rslang->trans('order.additional_services')}</h3> <div class="m-b-neg-24"> {foreach $grouped_addons as $group} <div class="panel {$group.panel_color} panel-grouped-addons {mag_clean_css_identifier($group.name)}"> <div class="panel-heading"> <a role="button" data-toggle="collapse" href="#collapse_{$group.uuid}" aria-expanded="{if $group.is_collapsed}false{else}true{/if}" aria-controls="collapse_{$group.uuid}"> {$group.name} </a> </div> <div id="collapse_{$group.uuid}" class="collapse {if !$group.is_collapsed}in{/if}"> <ul class="list-group"> {foreach $group.addons as $addon} <li class="list-group-item panel-addon {mag_clean_css_identifier($addon.name)}"> <div class="check"> <label> <input class="icheck-control" type="checkbox" name="addons[{$addon.id}]"{if $addon.status} checked{/if} /> <div class="check-content"> <h6 class="check-title">{$addon.name}</h6> <p class="check-subtitle">{$addon.pricing}</p> <p>{$addon.description}</p> </div> </label> </div> </li> {/foreach} </ul> </div> </div> {/foreach} </div> </div> {/if}