products.tpl 75 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531
  1. <!-- modules/addons/adminpanel/core/front/products.tpl -->
  2. {debug}
  3. {assign billingcycle "monthly"}
  4. {if $block.sechidden neq "true"}
  5. {if $block.ptstyle == ''}
  6. <div id="sec-{$blockkey}" class="sec products{if $block.bgcolor != ""} {$block.bgcolor}{/if}{if $block.borders != ""} {$block.borders}{/if}{if $block.toppadding == "1"} inner-t-60{elseif $block.toppadding == "2"} inner-t-30{elseif $block.toppadding == "3"} no-padding-top{/if}{if $block.bottompadding == "1"} inner-b-60{elseif $block.bottompadding == "2"} inner-b-30{elseif $block.bottompadding == "3"} no-padding-bottom{/if}">
  7. <div class="container">
  8. {if $block.caption || $block.sectitle || $block.subtitle}
  9. <div class="sec-description">
  10. {if $block.caption}
  11. <div class="sec-caption">
  12. <span class="rounded">{$block.caption}</span>
  13. </div>
  14. {/if}
  15. {if $block.sectitle}
  16. <h2 class="sec-title">{$block.sectitle}</h2>
  17. {/if}
  18. {if $block.subtitle}
  19. <div class="sec-subtitle">{$block.subtitle}</div>
  20. {/if}
  21. </div>
  22. {/if}
  23. <div class="cros-pricing-container{if $block.itemcounts < "3"} mw-768 mx-auto{/if}">
  24. {if $block.SbSwitcher && !$block.DisableSwitcher}
  25. {if $block.switcherCycles !== null && $block.switcherCycles|@count > 1}
  26. {assign var="cycles" value=$block.switcherCycles}
  27. {else}
  28. {assign var="cycles" value=$allCycles}
  29. {/if}
  30. {if !$block.bsco}
  31. {assign var="cycles" value=$cycles|@array_reverse}
  32. {/if}
  33. <div class="product-billing-switcher-{$blockkey}">
  34. <div class="btn-group white border d-none d-sm-inline-block" role="group">
  35. {foreach $cycles as $cycle}
  36. <button type="button" class="btn cycle-change" data-cycle="{$cycle}">
  37. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  38. </button>
  39. {/foreach}
  40. </div>
  41. <div class="btn-group white border d-inline-block d-sm-none">
  42. <span class="px-3 py-1 small text-muted border-right">{$WLANG.orderbillingcycle}</span>
  43. <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
  44. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycles[0]}}</span>
  45. </button>
  46. <ul class="dropdown-menu">
  47. {foreach $cycles as $cycle}
  48. <li class="dropdown-item cycle-change" data-cycle="{$cycle}">
  49. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  50. </li>
  51. {/foreach}
  52. </ul>
  53. </div>
  54. </div>
  55. {/if}
  56. <!-- div class pricing_style_2 -->
  57. <div class="pricing_style_2">
  58. <div class="swiper" id="pricing-tables-{$blockkey}">
  59. <div class="row row-eq-height{if !$block.DisplayInGrid} flex-nowrap{/if} pricing-slider pricing-{$blockkey} swiper-wrapper{if count($block.table) < 3} justify-content-md-center{/if}">
  60. {if count($block.table) > 0}
  61. {foreach from=$block.table item=$ditem key=$kk}
  62. <div class="col-12{if $block.itemcounts == "2"} col-md-6{elseif $block.itemcounts == "3"} col-md-6 col-lg-4 col-xl-4{elseif $block.itemcounts == "4"} col-md-6 col-lg-4 col-xl-3{/if} products-slide">
  63. <div class="cros-pricing-table overflow-hidden mt-0 mb-4{if $block.ststyle} {$block.ststyle}{/if}{if $block.noshadow} no-shadow{/if}{if $block.tablebg == "light"} light{elseif $block.tablebg == "primary"} bg-primary{elseif $block.tablebg == "dark"} dark{else} white{/if}{if $ditem['Featured']} active{/if}{if $block.centered} centered{/if}">
  64. {if $ditem['Graphic']}
  65. <div class="graphics mb-3" style="min-height: 105px;">
  66. {if !$ditem['Graphic']|strstr:"fa-"}
  67. <img src="{$WEB_ROOT}/{$ditem['Graphic']}" alt="{$ditem.title}" class="img-fluid" style="max-height: 100px">
  68. {else}
  69. <span class="icon">
  70. <i class="{$ditem['Graphic']}"></i>
  71. </span>
  72. {/if}
  73. </div>
  74. {/if}
  75. <div class="h4">{$ditem['productdetails']['name']}</div>
  76. {if $ditem['Featured']}
  77. {if $block.ststyle}
  78. <div class="feature-sticker">
  79. <span class="st-sm">
  80. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  81. </span>
  82. </div>
  83. {else}
  84. <div class="sticker-wrapper">
  85. <div class="sticker">
  86. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  87. </div>
  88. </div>
  89. {/if}
  90. {/if}
  91. {if $block.descp == ""}
  92. {if count($ditem['productdetails']['description']['features']) > 0}
  93. {if $ditem['productdetails']['description']['featuresdesc']}
  94. <div class="desc" style="min-height: 80px;height:80px; overflow:hidden;">{$ditem['productdetails']['description']['featuresdesc']}</div>
  95. {/if}
  96. {/if}
  97. {/if}
  98. <div class="product_pricing_single">
  99. {if $block.DisableBrekdown}
  100. {if isset($ditem.dropdown) && is_array($ditem.dropdown)}
  101. {foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
  102. {assign var="firstCycle" value=$dropdown|@end}
  103. {if $firstCycle.hasconfigoptions}
  104. <!--
  105. <div class="regular_pricing">
  106. <span class="small text-muted">ab</span>
  107. </div>
  108. -->
  109. {/if}
  110. <div class="price">
  111. <span class="cost" style="color:#1B5F8F">
  112. {$firstCycle.prefix}{$firstCycle.price}
  113. </span>
  114. <span class="suffix">
  115. {$firstCycle.suffix}
  116. </spn>
  117. </div>
  118. <div class="cycle small text-muted">
  119. {$firstCycle.cycle|capitalize}
  120. </div>
  121. {/foreach}
  122. {/if}
  123. {else}
  124. {if $ditem["price"] == 'FREE'}
  125. <span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>
  126. {else}
  127. {if $ditem["productdetails"]['hasconfigoptions']}
  128. <div class="regular_pricing">
  129. <span class="small text-muted">ab</span>
  130. </div>
  131. {/if}
  132. <div class="price">
  133. {assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
  134. <span class="cost">{$ditem["productdetails"]["price"]['simple']}</span>
  135. {if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
  136. </div>
  137. {if $ditem["billingcycle"] != ""}
  138. <div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
  139. {elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
  140. <div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
  141. {/if}
  142. {if $ditem["productdetails"]["price"]["setupFee"]}
  143. <div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
  144. {/if}
  145. {/if}
  146. {/if}
  147. </div>
  148. {if $block.descp == "below" || $block.descp == "1"}
  149. {if count($ditem['productdetails']['description']['features']) > 0}
  150. {if $ditem['productdetails']['description']['featuresdesc']}
  151. <div class="desc mt-2">{$ditem['productdetails']['description']['featuresdesc']}</div>
  152. {/if}
  153. {/if}
  154. {/if}
  155. {*
  156. {if !$block.orderLinkinLast}
  157. <div class="product-actions w-100">
  158. <a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}&billingcycle={$defaultbilling}{/if}{/if}" class="btn btn-primary{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
  159. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  160. </a>
  161. </div>
  162. {/if}
  163. *}
  164. {if $block.descp == "2"}
  165. {if count($ditem['productdetails']['description']['features']) > 0}
  166. {if $ditem['productdetails']['description']['featuresdesc']}
  167. <div class="desc_small mt-3 mb-1">{$ditem['productdetails']['description']['featuresdesc']}</div>
  168. {/if}
  169. {/if}
  170. {/if}
  171. <!-- Features / Eigenschaften -->
  172. {if $block.featurescollapsed}
  173. <!-- Features / Collapsed -->
  174. {if $ditem['productdetails']['description']}
  175. {if count($ditem['productdetails']['description']['features']) > 0}
  176. <ul class="plan-features">
  177. {foreach $ditem['productdetails']['description']['features'] as $feature => $value}
  178. <li><b>{$feature}</b>{$value}</li>
  179. {/foreach}
  180. </ul>
  181. {else}
  182. <div class="plan-features">
  183. {$ditem['productdetails']['description']['original']}
  184. </div>
  185. {/if}
  186. {/if}
  187. {else}
  188. <!-- Features / NOT Collapsed -->
  189. <p class="PriceList-toggle collapsed" data-toggle="collapse" data-target="#PlanLists{$kk + 1}">
  190. <span>{$WLANG.clientareaviewdetails}</span>
  191. </p>
  192. {if $ditem['productdetails']['description']}
  193. {if count($ditem['productdetails']['description']['features']) > 0}
  194. <ul class="plan-features collapse" id="PlanLists{$kk + 1}">
  195. <table border="0" style="display: inline-table; table-layout:fixed; width:100%; visibility:visible;" cellpadding="0" cellspacing="5">
  196. {foreach $ditem['productdetails']['description']['features'] as $feature => $value}
  197. <tr>
  198. <td><b>{$feature}</b></td>
  199. <td>
  200. {if $value == "Ja"}
  201. <i class="far fa-check-square" class="td-product-feature-icon"></i>
  202. {elseif $value == "Nein"}
  203. <i class="far fa-square" class="td-product-feature-icon"></i>
  204. {elseif $value == "Optional"}
  205. <i class="fas fa-plus" class="td-product-feature-icon"></i>
  206. {else}
  207. {$value}
  208. {/if}
  209. </td>
  210. </tr>
  211. {/foreach}
  212. </table>
  213. {*
  214. {foreach $ditem['productdetails']['description']['features'] as $feature => $value}
  215. <li><b>{$feature}: </b>{$value}</li>
  216. {/foreach}
  217. *}
  218. </ul>
  219. {else}
  220. <div class="plan-features collapse" id="PlanLists{$kk + 1}">
  221. {$ditem['productdetails']['description']['original']}
  222. </div>
  223. {/if}
  224. {/if}
  225. {/if}
  226. {if !$block.orderLinkinLast}
  227. <div class="product-actions w-100">
  228. <a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}&billingcycle={$defaultbilling}{/if}{/if}" class="btn btn-primary{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
  229. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  230. </a>
  231. </div>
  232. {/if}
  233. {if $block.orderLinkinLast}
  234. <div class="product-actions mt-auto">
  235. <a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}&billingcycle={$defaultbilling}{/if}{/if}" class="btn btn-primary my-3 w-auto{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
  236. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  237. </a>
  238. </div>
  239. {/if}
  240. </div>
  241. </div>
  242. {/foreach}
  243. {/if}
  244. </div>
  245. </div>
  246. </div>
  247. <!-- TD DisplayInGrid -->
  248. {if !$block.DisplayInGrid}
  249. {if !$block.slidertype}
  250. <div class="swiper-pagination pricing-tables_{$blockkey}"></div>
  251. {else}
  252. <div class="swiper-button-prev pricing-tables_{$blockkey}_prev">
  253. <span class="btn_icon_large"><i class="far fa-long-arrow-left"></i></span>
  254. </div>
  255. <div class="swiper-button-next pricing-tables_{$blockkey}_next">
  256. <span class="btn_icon_large"><i class="far fa-long-arrow-right"></i></span>
  257. </div>
  258. {/if}
  259. {/if}
  260. </div>
  261. </div>
  262. </div>
  263. <script>
  264. jQuery(document).ready(function () {
  265. {if !$block.DisplayInGrid}
  266. var swiper = new Swiper('#pricing-tables-{$blockkey}', {
  267. slidesPerView: 1,
  268. preventClicks: true,
  269. slideClass: 'products-slide',
  270. {if !$block.slidertype}
  271. pagination: {
  272. el: '.swiper-pagination.pricing-tables_{$blockkey}',
  273. clickable: true,
  274. },
  275. {else}
  276. navigation: {
  277. nextEl: '.pricing-tables_{$blockkey}_next',
  278. prevEl: '.pricing-tables_{$blockkey}_prev',
  279. },
  280. {/if}
  281. breakpoints: {
  282. 0: {
  283. slidesPerView: 1
  284. },
  285. 768: {
  286. slidesPerView: 2
  287. },
  288. 992: {
  289. slidesPerView:{if $block.itemcounts == "2"} 2{else} 3{/if}
  290. },
  291. 1200: {
  292. slidesPerView:{if $block.itemcounts == ""} 3{else} {$block.itemcounts}{/if}
  293. },
  294. }
  295. });
  296. {/if}
  297. {if $block.SbSwitcher && !$block.DisableSwitcher}
  298. jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
  299. var selText = jQuery(this).html();
  300. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
  301. });
  302. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
  303. var newCycle = jQuery(this).data('cycle');
  304. var disBtnBilCycle = jQuery(this).data('cycle');
  305. jQuery('.pricing-{$blockkey} .product_pricing .pricing_main').hide();
  306. jQuery('.pricing-{$blockkey} .' + newCycle).show();
  307. jQuery(this).addClass('active').siblings().removeClass('active');
  308. jQuery('.pricing-{$blockkey} .cros-pricing-table').each(function(index) {
  309. var disBtnUrlFetch = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href');
  310. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  311. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  312. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  313. jQuery(this).find('.btn-primary').attr('href',disBtnUrlFinal);
  314. if (jQuery(this).find('.' + newCycle).length <= 0) {
  315. jQuery(this).find('.pricing_main_default').show();
  316. jQuery(this).find('.btn-primary').addClass('disabled');
  317. } else {
  318. jQuery(this).find('.pricing_main_default').hide();
  319. jQuery(this).find('.btn-primary').removeClass('disabled');
  320. }
  321. });
  322. });
  323. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');
  324. {else}
  325. {if !$block.DisableSwitcher}
  326. jQuery(".pricing-{$blockkey} .dropdown-menu li").click(function(){
  327. var selText = jQuery(this).html();
  328. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
  329. });
  330. jQuery('.pricing-{$blockkey} .billinging_wrapr').click(function(){
  331. var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  332. var disBtnUrlFetch = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href');
  333. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  334. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  335. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  336. jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href',disBtnUrlFinal);
  337. var crosPricingTable = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table');
  338. crosPricingTable.find('.pricing_main').each(function() {
  339. var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  340. if (currentBilCycle === disBtnBilCycle) {
  341. jQuery(this).removeClass('w-hidden');
  342. } else {
  343. jQuery(this).addClass('w-hidden');
  344. }
  345. });
  346. });
  347. {/if}
  348. {/if}
  349. });
  350. </script>
  351. {elseif $block.ptstyle == 'pts_1'}
  352. <!-- TD pts_1 -->
  353. <div id="sec-{$blockkey}" class="sec products{if $block.bgcolor != ""} {$block.bgcolor}{/if}{if $block.borders != ""} {$block.borders}{/if}{if $block.toppadding == "1"} inner-t-60{elseif $block.toppadding == "2"} inner-t-30{elseif $block.toppadding == "3"} no-padding-top{/if}{if $block.bottompadding == "1"} inner-b-60{elseif $block.bottompadding == "2"} inner-b-30{elseif $block.bottompadding == "3"} no-padding-bottom{/if}">
  354. <div class="container">
  355. {if $block.caption || $block.sectitle || $block.subtitle}
  356. <div class="sec-description">
  357. {if $block.caption}
  358. <div class="sec-caption">
  359. <span class="rounded">{$block.caption}</span>
  360. </div>
  361. {/if}
  362. {if $block.sectitle}
  363. <h2 class="sec-title">{$block.sectitle}</h2>
  364. {/if}
  365. {if $block.subtitle}
  366. <div class="sec-subtitle">{$block.subtitle}</div>
  367. {/if}
  368. </div>
  369. {/if}
  370. <!-- Cross Pricing Container -->
  371. <div class="cros-pricing-container">
  372. {if $block.SbSwitcher && !$block.DisableSwitcher}
  373. {if $block.switcherCycles !== null && $block.switcherCycles|@count > 1}
  374. {assign var="cycles" value=$block.switcherCycles}
  375. {else}
  376. {assign var="cycles" value=$allCycles}
  377. {/if}
  378. {if !$block.bsco}
  379. {assign var="cycles" value=$cycles|@array_reverse}
  380. {/if}
  381. <div class="product-billing-switcher-{$blockkey}">
  382. <div class="btn-group white border d-none d-sm-inline-block" role="group">
  383. {foreach $cycles as $cycle}
  384. <button type="button" class="btn cycle-change" data-cycle="{$cycle}">
  385. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  386. </button>
  387. {/foreach}
  388. </div>
  389. <div class="btn-group white border d-inline-block d-sm-none">
  390. <span class="px-3 py-1 small text-muted border-right">{$WLANG.orderbillingcycle}</span>
  391. <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
  392. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycles[0]}}</span>
  393. </button>
  394. <ul class="dropdown-menu">
  395. {foreach $cycles as $cycle}
  396. <li class="dropdown-item cycle-change" data-cycle="{$cycle}">
  397. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  398. </li>
  399. {/foreach}
  400. </ul>
  401. </div>
  402. </div>
  403. {/if}
  404. <!-- TD:Pricing style 2 -->
  405. <div class="pricing_style_2 pricing-{$blockkey}" id="pricing-tables-{$blockkey}">
  406. {if count($block.table) > 0}
  407. {foreach from=$block.table item=$ditem key=$kk}
  408. <div class="cros-pricing-table{if $block.SbSwitcher} overflow-hidden{/if}{if $block.ststyle} {$block.ststyle}{/if}{if $block.noshadow} no-shadow{/if}{if $block.tablebg == "light"} light{elseif $block.tablebg == "primary"} bg-primary{elseif $block.tablebg == "dark"} dark{else} white{/if} pt_st_5{if $ditem['Featured']} active{/if}">
  409. <div class="row no-gutters">
  410. <div class="col-lg-8 col-xl-9">
  411. <div class="content align-items-lg-center">
  412. {if $ditem['Graphic']}
  413. {if !$ditem['Graphic']|strstr:"fa-"}
  414. <div class="graphics fix-width">
  415. <img src="{$WEB_ROOT}/{$ditem['Graphic']}" alt="{$ditem.title}" class="img-fluid">
  416. </div>
  417. {else}
  418. <div class="graphics">
  419. <span class="icon">
  420. <i class="{$ditem['Graphic']}"></i>
  421. </span>
  422. </div>
  423. {/if}
  424. {/if}
  425. <div class="plan-details">
  426. <div class="h4 plan-name">
  427. {$ditem['productdetails']['name']}
  428. {if $ditem['Featured']}
  429. {if $block.ststyle}
  430. <span class="st-sm ml-2 fw-400">
  431. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  432. </span>
  433. {/if}
  434. {/if}
  435. </div>
  436. {if count($ditem['productdetails']['description']['features']) > 0}
  437. {if strpos($ditem['productdetails']['description']['featuresdesc'], '<p>') !== false}
  438. {$ditem['productdetails']['description']['featuresdesc']}
  439. {else}
  440. <p>{$ditem['productdetails']['description']['featuresdesc']}</p>
  441. {/if}
  442. {/if}
  443. <!-- Eigenschaften 1 -->
  444. {if $ditem['productdetails']['description']}
  445. <!-- Eigenschaften 2 -->
  446. {if count($ditem['productdetails']['description']['features']) > 0}
  447. <!-- Eigenschaften 3 -->
  448. <ul class="plan-features">
  449. {foreach $ditem['productdetails']['description']['features'] as $feature => $value}
  450. <li><b>{$feature}</b>{$value}</li>
  451. {/foreach}
  452. </ul>
  453. {else}
  454. {$ditem['productdetails']['description']['original']}
  455. {/if}
  456. {/if}
  457. </div>
  458. </div>
  459. </div>
  460. <div class="col-lg-4 col-xl-3">
  461. <div class="content{if $block.SbSwitcher && $ditem['Featured'] && !$block.ststyle} mr-0 mr-lg-4{/if}">
  462. {if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
  463. {if $block.bsco}
  464. {foreach $ditem["dropdown"] as $dropdownkey=>$dropdownprice}
  465. {$ditem["dropdown"][$dropdownkey] = $dropdownprice|@array_reverse}
  466. {/foreach}
  467. {/if}
  468. {assign var="dropdownprice" value=$ditem["dropdown"][$ditem['Plan']][0] nocache}
  469. {assign var="defaultbilling" value=$dropdownprice['cycle'] nocache}
  470. {assign var="taxtype" value=$dropdownprice['taxtype'] nocache}
  471. {assign var="hasconfigoptions" value=$dropdownprice['hasconfigoptions'] nocache}
  472. <div class="billing-cycle-pricing float{if $block.descp == "below"} desc_belwo{/if}">
  473. {if !$block.SbSwitcher}
  474. <div class="btn-group mb-2 mb-lg-0">
  475. <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
  476. <div class="pricing_wrapr">
  477. {$dropdownprice['billingcycle']}
  478. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  479. </div>
  480. <span class="fal fa-angle-down"></span>
  481. </a>
  482. <ul class="dropdown-menu">
  483. {if $ditem["dropdown"][$ditem['Plan']]}
  484. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  485. <li class="billinging_wrapr" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  486. <div class="pricing_wrapr">
  487. {$dropdownprice['billingcycle']}
  488. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  489. </div>
  490. </li>
  491. {/foreach}
  492. {/if}
  493. </ul>
  494. </div>
  495. {/if}
  496. {if $ditem["dropdown"][$ditem['Plan']]}
  497. <div class="product_pricing">
  498. {if $block.SbSwitcher}
  499. <div class="pricing_main_default{if $defaultbilling eq "{$dropdownprice['cycle']}"} w-hidden{/if}">
  500. <div class="price">
  501. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  502. <span class="regular_pricing">
  503. {if $dropdownprice['hasconfigoptions']}
  504. <span class="small text-muted">ab</span>
  505. {/if}
  506. {if $dropdownprice['save']}
  507. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  508. <span class="savecut text-muted">
  509. {$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}
  510. </span>
  511. {/if}
  512. {* {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if} *}
  513. {/if}
  514. </span>
  515. {/if}
  516. <span class="cost">
  517. {$dropdownprice['prefix']}
  518. {if $block.DisableBrekdown}
  519. {$dropdownprice['price']}
  520. {else}
  521. {$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}
  522. {/if}
  523. </span>
  524. {if $dropdownprice['suffix']}
  525. <span class="suffix">
  526. {$dropdownprice['suffix']}
  527. </span>
  528. {/if}
  529. </div>
  530. <span class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</span>
  531. {if $dropdownprice['setup'] > 0}
  532. <div class="small text-muted">
  533. <span><i class="fal fa-plus"></i></span>
  534. <span>{$dropdownprice['prefix']}</span>
  535. {$dropdownprice['setup']}
  536. <span>{$dropdownprice['suffix']}</span>
  537. {$WLANG.ordersetupfee}
  538. </div>
  539. {/if}
  540. </div>
  541. {/if}
  542. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  543. <div class="pricing_main {$dropdownprice['cycle']}{if $defaultbilling neq "{$dropdownprice['cycle']}"} w-hidden{/if}" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  544. <div class="price">
  545. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  546. <span class="regular_pricing">
  547. {if $dropdownprice['hasconfigoptions']}
  548. <span class="small text-muted">ab</span>
  549. {/if}
  550. {if $dropdownprice['save']}
  551. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  552. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  553. {/if}
  554. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  555. {/if}
  556. </span>
  557. {/if}
  558. <span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  559. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  560. </div>
  561. <span class="cycle small text-muted">
  562. {if $block.DisableBrekdown}
  563. {$dropdownprice.cycle|capitalize}
  564. {else}
  565. {if $dropdownprice['monthlycycle']}
  566. {$dropdownprice['monthlycycle']}
  567. {else}
  568. {$dropdownprice['cycleTerm']}
  569. {/if}
  570. {/if}
  571. </span>
  572. {if $dropdownprice['setup'] > 0}
  573. <div class="small text-muted">
  574. <span><i class="fal fa-plus"></i></span>
  575. <span>{$dropdownprice['prefix']}</span>
  576. {$dropdownprice['setup']}
  577. <span>{$dropdownprice['suffix']}</span>
  578. {$WLANG.ordersetupfee}
  579. </div>
  580. {/if}
  581. </div>
  582. {/foreach}
  583. </div>
  584. {/if}
  585. </div>
  586. {else}
  587. <div class="product_pricing_single">
  588. {if $block.DisableBrekdown}
  589. {if isset($ditem.dropdown) && is_array($ditem.dropdown)}
  590. {foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
  591. {assign var="firstCycle" value=$dropdown|@end}
  592. <div class="price">
  593. {if $firstCycle.hasconfigoptions}
  594. <span class="regular_pricing">
  595. <span class="small text-muted">ab</span>
  596. </span>
  597. {/if}
  598. <span class="cost">
  599. {$firstCycle.prefix}{$firstCycle.price}
  600. </span>
  601. <span class="suffix">
  602. {$firstCycle.suffix}
  603. </spn>
  604. </div>
  605. <div class="cycle small text-muted">
  606. {$firstCycle.cycle|capitalize}
  607. </div>
  608. {/foreach}
  609. {/if}
  610. {else}
  611. {if $ditem["price"] == 'FREE'}
  612. <div class="d-flex align-items-center justify-content-end">
  613. <span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>
  614. </div>
  615. {else}
  616. <div class="price">
  617. {if $ditem["productdetails"]['hasconfigoptions']}
  618. <span class="regular_pricing">
  619. <span class="small text-muted">ab</span>
  620. </span>
  621. {/if}
  622. {assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
  623. <span class="cost">{$ditem["productdetails"]["price"]['simple']}</span>
  624. {if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
  625. </div>
  626. {if $ditem["billingcycle"] != ""}
  627. <div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
  628. {elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
  629. <div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
  630. {/if}
  631. {if $ditem["productdetails"]["price"]["setupFee"]}
  632. <div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
  633. {/if}
  634. {/if}
  635. {/if}
  636. </div>
  637. {/if}
  638. <div class="plan-action mt-auto">
  639. <a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}&billingcycle={$defaultbilling}{/if}{/if}" class="btn btn-sm btn-primary mt-2{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
  640. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  641. </a>
  642. </div>
  643. </div>
  644. </div>
  645. </div>
  646. {if $ditem['Featured']}
  647. {if $block.ststyle == ""}
  648. <div class="sticker-wrapper{if !$block.SbSwitcher} se{/if}">
  649. <div class="sticker">
  650. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  651. </div>
  652. </div>
  653. {/if}
  654. {/if}
  655. </div>
  656. {/foreach}
  657. {/if}
  658. </div>
  659. </div>
  660. </div>
  661. </div>
  662. <script>
  663. jQuery(document).ready(function () {
  664. {if $block.SbSwitcher && !$block.DisableSwitcher}
  665. jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
  666. var selText = jQuery(this).html();
  667. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
  668. });
  669. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
  670. var newCycle = jQuery(this).data('cycle');
  671. var disBtnBilCycle = jQuery(this).data('cycle');
  672. jQuery('.pricing-{$blockkey} .product_pricing .pricing_main').hide();
  673. jQuery('.pricing-{$blockkey} .' + newCycle).show();
  674. jQuery(this).addClass('active').siblings().removeClass('active');
  675. jQuery('.pricing-{$blockkey} .cros-pricing-table').each(function(index) {
  676. var disBtnUrlFetch = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href');
  677. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  678. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  679. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  680. jQuery(this).find('.btn-primary').attr('href',disBtnUrlFinal);
  681. if (jQuery(this).find('.' + newCycle).length <= 0) {
  682. jQuery(this).find('.pricing_main_default').show();
  683. jQuery(this).find('.btn-primary').addClass('disabled');
  684. } else {
  685. jQuery(this).find('.pricing_main_default').hide();
  686. jQuery(this).find('.btn-primary').removeClass('disabled');
  687. }
  688. });
  689. });
  690. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');
  691. {else}
  692. {if !$block.DisableSwitcher}
  693. jQuery(".pricing-{$blockkey} .dropdown-menu li").click(function(){
  694. var selText = jQuery(this).html();
  695. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
  696. });
  697. jQuery('.pricing-{$blockkey} .billinging_wrapr').click(function(){
  698. var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  699. var disBtnUrlFetch = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href');
  700. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  701. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  702. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  703. jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href',disBtnUrlFinal);
  704. var crosPricingTable = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table');
  705. crosPricingTable.find('.pricing_main').each(function() {
  706. var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  707. if (currentBilCycle === disBtnBilCycle) {
  708. jQuery(this).removeClass('w-hidden');
  709. } else {
  710. jQuery(this).addClass('w-hidden');
  711. }
  712. });
  713. });
  714. {/if}
  715. {/if}
  716. });
  717. </script>
  718. {elseif $block.ptstyle == 'pts_2'}
  719. <div id="sec-{$blockkey}" class="sec products{if $block.bgcolor != ""} {$block.bgcolor}{/if}{if $block.borders != ""} {$block.borders}{/if}{if $block.toppadding == "1"} inner-t-60{elseif $block.toppadding == "2"} inner-t-30{elseif $block.toppadding == "3"} no-padding-top{/if}{if $block.bottompadding == "1"} inner-b-60{elseif $block.bottompadding == "2"} inner-b-30{elseif $block.bottompadding == "3"} no-padding-bottom{/if}">
  720. <div class="section__plan_comparison">
  721. <div class="container">
  722. {if $block.caption || $block.sectitle || $block.subtitle}
  723. <div class="sec-description">
  724. {if $block.caption}
  725. <div class="sec-caption">
  726. <span class="rounded">{$block.caption}</span>
  727. </div>
  728. {/if}
  729. {if $block.sectitle}
  730. <h2 class="sec-title">{$block.sectitle}</h2>
  731. {/if}
  732. {if $block.subtitle}
  733. <div class="sec-subtitle">{$block.subtitle}</div>
  734. {/if}
  735. </div>
  736. {/if}
  737. <div class="cros-pricing-container">
  738. {if $block.SbSwitcher && !$block.DisableSwitcher}
  739. {if $block.switcherCycles !== null && $block.switcherCycles|@count > 1}
  740. {assign var="cycles" value=$block.switcherCycles}
  741. {else}
  742. {assign var="cycles" value=$allCycles}
  743. {/if}
  744. {if !$block.bsco}
  745. {assign var="cycles" value=$cycles|@array_reverse}
  746. {/if}
  747. <div class="product-billing-switcher-{$blockkey}">
  748. <div class="btn-group white border d-none d-sm-inline-block" role="group">
  749. {foreach $cycles as $cycle}
  750. <button type="button" class="btn cycle-change" data-cycle="{$cycle}">
  751. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  752. </button>
  753. {/foreach}
  754. </div>
  755. <div class="btn-group white border d-inline-block d-sm-none">
  756. <span class="px-3 py-1 small text-muted border-right">{$WLANG.orderbillingcycle}</span>
  757. <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
  758. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycles[0]}}</span>
  759. </button>
  760. <ul class="dropdown-menu">
  761. {foreach $cycles as $cycle}
  762. <li class="dropdown-item cycle-change" data-cycle="{$cycle}">
  763. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  764. </li>
  765. {/foreach}
  766. </ul>
  767. </div>
  768. </div>
  769. {/if}
  770. <div class="cros-pricing-table tables_{$blockkey} no-animation{if $block.noshadow} no-shadow{/if}{if $block.tablebg == "light"} light{elseif $block.tablebg == "primary"} bg-primary{elseif $block.tablebg == "dark"} dark{else} white{/if}">
  771. <div class="plans_slider__nav border-bottom">
  772. <div class="swiper-button-next tables_{$blockkey}_next">
  773. <span class="btn__text text-muted">{$WLANG.tablepagesnext}</span>
  774. <span class="btn__icon"><i class="far fa-long-arrow-right"></i></span>
  775. </div>
  776. <div class="swiper-button-prev tables_{$blockkey}_prev">
  777. <span class="btn__icon"><i class="far fa-long-arrow-left"></i></span>
  778. <span class="btn__text text-muted">{$WLANG.tablepagesprevious}</span>
  779. </div>
  780. </div>
  781. <div class="plan plan-{$blockkey}{if $block.centered} centered{/if}">
  782. <div class="plan__column plan__column--empty">
  783. <div class="plan__header d-flex align-items-center{if $block.table[0].Graphic|trim != ""} hg{/if}">
  784. <span class="h4">{$WLANG['store']['ox']['featuresHeadline']}</span>
  785. </div>
  786. <div class="plan__body plan__body--right">
  787. {foreach from=$block.table|@array_column:'featurelist'|@array_count_values item=count key=featurelist}
  788. {$featurelist}
  789. {/foreach}
  790. <div class="plan__cell plan__cell-last{if $block.SbSwitcher || $block.DisableSwitcher} sb{/if}"></div>
  791. </div>
  792. </div>
  793. <div class="swiper-container" id="plans-slider-{$blockkey}">
  794. <div class="swiper-wrapper">
  795. {if count($block.table) > 0}
  796. {foreach from=$block.table item=$ditem key=$kk}
  797. <div class="swiper-slide">
  798. <div class="plan__column">
  799. <div class="plan__header{if $ditem['Graphic']} hg{/if}">
  800. {if $ditem['Graphic']}
  801. <div class="graphics">
  802. {if !$ditem['Graphic']|strstr:"fa-"}
  803. <img src="{$WEB_ROOT}/{$ditem['Graphic']}" alt="{$ditem.title}" class="img-fluid">
  804. {else}
  805. <span class="icon">
  806. <i class="{$ditem['Graphic']}"></i>
  807. </span>
  808. {/if}
  809. </div>
  810. {/if}
  811. <span class="h4">{$ditem['productdetails']['name']}</span>
  812. </div>
  813. <div class="plan__body">
  814. {$ditem['featuresvalues']}
  815. <div class="plan__cell plan__cell-last{if $block.SbSwitcher || $block.DisableSwitcher} sb{/if}">
  816. {if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
  817. {if $block.bsco}
  818. {foreach $ditem["dropdown"] as $dropdownkey=>$dropdownprice}
  819. {$ditem["dropdown"][$dropdownkey] = $dropdownprice|@array_reverse}
  820. {/foreach}
  821. {/if}
  822. {assign var="dropdownprice" value=$ditem["dropdown"][$ditem['Plan']][0] nocache}
  823. {assign var="defaultbilling" value=$dropdownprice['cycle'] nocache}
  824. {assign var="taxtype" value=$dropdownprice['taxtype'] nocache}
  825. {assign var="hasconfigoptions" value=$dropdownprice['hasconfigoptions'] nocache}
  826. <div class="billing-cycle-pricing float{if $block.descp == "below"} desc_belwo{/if}">
  827. {if !$block.SbSwitcher}
  828. <div class="btn-group mb-2 dropup">
  829. <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
  830. <div class="pricing_wrapr">
  831. {$dropdownprice['billingcycle']}
  832. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  833. </div>
  834. <span class="fal fa-angle-down"></span>
  835. </a>
  836. <ul class="dropdown-menu">
  837. {if $ditem["dropdown"][$ditem['Plan']]}
  838. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  839. <li class="billinging_wrapr" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  840. <div class="pricing_wrapr">
  841. {$dropdownprice['billingcycle']}
  842. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  843. </div>
  844. </li>
  845. {/foreach}
  846. {/if}
  847. </ul>
  848. </div>
  849. {/if}
  850. {if $ditem["dropdown"][$ditem['Plan']]}
  851. <div class="product_pricing">
  852. {if $block.SbSwitcher}
  853. <div class="pricing_main_default{if $defaultbilling eq "{$dropdownprice['cycle']}"} w-hidden{/if}">
  854. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  855. <div class="regular_pricing">
  856. {if $dropdownprice['hasconfigoptions']}
  857. <span class="small text-muted">ab</span>
  858. {/if}
  859. {if $dropdownprice['save']}
  860. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  861. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  862. {/if}
  863. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  864. {/if}
  865. </div>
  866. {/if}
  867. <div class="price">
  868. <span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  869. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  870. </div>
  871. <div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
  872. {if $dropdownprice['setup'] > 0}
  873. <div class="small text-muted">
  874. <span><i class="fal fa-plus"></i></span>
  875. <span>{$dropdownprice['prefix']}</span>
  876. {$dropdownprice['setup']}
  877. <span>{$dropdownprice['suffix']}</span>
  878. {$WLANG.ordersetupfee}
  879. </div>
  880. {/if}
  881. </div>
  882. {/if}
  883. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  884. <div class="pricing_main {$dropdownprice['cycle']}{if $defaultbilling neq "{$dropdownprice['cycle']}"} w-hidden{/if}" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  885. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  886. <div class="regular_pricing">
  887. {if $dropdownprice['hasconfigoptions']}
  888. <span class="small text-muted">ab</span>
  889. {/if}
  890. {if $dropdownprice['save']}
  891. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  892. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  893. {/if}
  894. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  895. {/if}
  896. </div>
  897. {/if}
  898. <div class="price">
  899. <span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  900. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  901. </div>
  902. <div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
  903. {if $dropdownprice['setup'] > 0}
  904. <div class="small text-muted">
  905. <span><i class="fal fa-plus"></i></span>
  906. <span>{$dropdownprice['prefix']}</span>
  907. {$dropdownprice['setup']}
  908. <span>{$dropdownprice['suffix']}</span>
  909. {$WLANG.ordersetupfee}
  910. </div>
  911. {/if}
  912. </div>
  913. {/foreach}
  914. </div>
  915. {/if}
  916. </div>
  917. <a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}{if $ditem["billingcycle"] != ""}&billingcycle={$defaultbilling}{/if}{/if}{/if}" class="btn btn-block btn-primary{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
  918. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  919. </a>
  920. {else}
  921. <div class="product_pricing_single d-flex flex-column justify-content-center h-100">
  922. {if $block.DisableBrekdown}
  923. {if isset($ditem.dropdown) && is_array($ditem.dropdown)}
  924. {foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
  925. {assign var="firstCycle" value=$dropdown|@end}
  926. {if $firstCycle.hasconfigoptions}
  927. <div class="regular_pricing">
  928. <span class="small text-muted">ab</span>
  929. </div>
  930. {/if}
  931. <div class="price">
  932. <span class="cost">
  933. {$firstCycle.prefix}{$firstCycle.price}
  934. </span>
  935. <span class="suffix">
  936. {$firstCycle.suffix}
  937. </spn>
  938. </div>
  939. <div class="cycle small text-muted">
  940. {$firstCycle.cycle|capitalize}
  941. </div>
  942. {/foreach}
  943. {/if}
  944. {else}
  945. {if $ditem["price"] == 'FREE'}
  946. <span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>
  947. {else}
  948. {if $ditem["productdetails"]['hasconfigoptions']}
  949. <div class="regular_pricing">
  950. <span class="small text-muted">ab</span>
  951. </div>
  952. {/if}
  953. <div class="price">
  954. {assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
  955. <span class="cost">{$ditem["productdetails"]["price"]['simple']}</span>
  956. {if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
  957. </div>
  958. {if $ditem["billingcycle"] != ""}
  959. <div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
  960. {elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
  961. <div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
  962. {/if}
  963. {if $ditem["productdetails"]["price"]["setupFee"]}
  964. <div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
  965. {/if}
  966. {/if}
  967. {/if}
  968. <a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}{if $ditem["billingcycle"] != ""}&billingcycle={$defaultbilling}{/if}{/if}{/if}" class="btn btn-block btn-primary mt-2{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
  969. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  970. </a>
  971. </div>
  972. {/if}
  973. </div>
  974. </div>
  975. {if $ditem['Featured']}
  976. <div class="sticker-wrapper">
  977. <div class="sticker">
  978. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  979. </div>
  980. </div>
  981. {/if}
  982. </div>
  983. </div>
  984. {/foreach}
  985. {/if}
  986. </div>
  987. </div>
  988. </div>
  989. </div>
  990. </div>
  991. </div>
  992. </div>
  993. </div>
  994. <script>
  995. jQuery(document).ready(function () {
  996. var swiper = new Swiper('#plans-slider-{$blockkey}', {
  997. slidesPerView: 1,
  998. navigation: {
  999. nextEl: '.tables_{$blockkey}_next',
  1000. prevEl: '.tables_{$blockkey}_prev',
  1001. },
  1002. breakpoints: {
  1003. 0: {
  1004. slidesPerView: 1,
  1005. },
  1006. 768: {
  1007. slidesPerView: 2,
  1008. },
  1009. 992: {
  1010. slidesPerView: {if $block.itemcounts == "2"} 2{else} 3{/if},
  1011. },
  1012. 1200: {
  1013. slidesPerView: {if $block.itemcounts == ""} 3{else} {$block.itemcounts}{/if},
  1014. },
  1015. },
  1016. on: {
  1017. init: function (swiper) {
  1018. toggleSliderNav(swiper);
  1019. },
  1020. slideChange: function (swiper) {
  1021. toggleSliderNav(swiper);
  1022. },
  1023. reachEnd: function (swiper) {
  1024. toggleSliderNav(swiper);
  1025. },
  1026. reachBeginning: function (swiper) {
  1027. toggleSliderNav(swiper);
  1028. },
  1029. resize: function (swiper) {
  1030. toggleSliderNav(swiper);
  1031. }
  1032. }
  1033. });
  1034. function toggleSliderNav(swiper) {
  1035. var nav = document.querySelector('.tables_{$blockkey} .plans_slider__nav');
  1036. if (swiper.isBeginning && swiper.isEnd) {
  1037. nav.style.display = 'none';
  1038. } else {
  1039. nav.style.display = 'flex';
  1040. }
  1041. }
  1042. {if $block.SbSwitcher && !$block.DisableSwitcher}
  1043. jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
  1044. var selText = jQuery(this).html();
  1045. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
  1046. });
  1047. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
  1048. var newCycle = jQuery(this).data('cycle');
  1049. var disBtnBilCycle = jQuery(this).data('cycle');
  1050. jQuery('.plan-{$blockkey} .pricing_main').hide();
  1051. jQuery('.plan-{$blockkey} .' + newCycle).show();
  1052. jQuery(this).addClass('active').siblings().removeClass('active');
  1053. jQuery('.plan-{$blockkey} .plan__body').each(function(index) {
  1054. var disBtnUrlFetch = jQuery(this).closest('.plan-{$blockkey}').find('.btn-primary').attr('href');
  1055. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  1056. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  1057. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  1058. jQuery(this).find('.btn-primary').attr('href',disBtnUrlFinal);
  1059. if (jQuery(this).find('.' + newCycle).length <= 0) {
  1060. jQuery(this).find('.pricing_main_default').show();
  1061. jQuery(this).find('.btn-primary').addClass('disabled');
  1062. } else {
  1063. jQuery(this).find('.pricing_main_default').hide();
  1064. jQuery(this).find('.btn-primary').removeClass('disabled');
  1065. }
  1066. });
  1067. });
  1068. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');
  1069. {else}
  1070. {if !$block.DisableSwitcher}
  1071. jQuery(".plan-{$blockkey} .dropdown-menu li").click(function(){
  1072. var selText = jQuery(this).html();
  1073. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
  1074. });
  1075. jQuery('.plan-{$blockkey} .billinging_wrapr').click(function(){
  1076. var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  1077. var disBtnUrlFetch = jQuery(this).closest('.plan-{$blockkey} .plan__body').find('.btn-primary').attr('href');
  1078. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  1079. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  1080. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  1081. jQuery(this).closest('.plan-{$blockkey} .plan__body').find('.btn-primary').attr('href',disBtnUrlFinal);
  1082. var crosPricingTable = jQuery(this).closest('.plan-{$blockkey} .plan__body');
  1083. crosPricingTable.find('.pricing_main').each(function() {
  1084. var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  1085. if (currentBilCycle === disBtnBilCycle) {
  1086. jQuery(this).removeClass('w-hidden');
  1087. } else {
  1088. jQuery(this).addClass('w-hidden');
  1089. }
  1090. });
  1091. });
  1092. {/if}
  1093. {/if}
  1094. });
  1095. </script>
  1096. {elseif $block.ptstyle == 'pts_3'}
  1097. <div id="sec-{$blockkey}" class="sec products{if $block.bgcolor != ""} {$block.bgcolor}{/if}{if $block.borders != ""} {$block.borders}{/if}{if $block.toppadding == "1"} inner-t-60{elseif $block.toppadding == "2"} inner-t-30{elseif $block.toppadding == "3"} no-padding-top{/if}{if $block.bottompadding == "1"} inner-b-60{elseif $block.bottompadding == "2"} inner-b-30{elseif $block.bottompadding == "3"} no-padding-bottom{/if}">
  1098. <div class="container">
  1099. {if $block.caption || $block.sectitle || $block.subtitle}
  1100. <div class="sec-description">
  1101. {if $block.caption}
  1102. <div class="sec-caption">
  1103. <span class="rounded">{$block.caption}</span>
  1104. </div>
  1105. {/if}
  1106. {if $block.sectitle}
  1107. <h2 class="sec-title">{$block.sectitle}</h2>
  1108. {/if}
  1109. {if $block.subtitle}
  1110. <div class="sec-subtitle">{$block.subtitle}</div>
  1111. {/if}
  1112. </div>
  1113. {/if}
  1114. <div class="cros-pricing-container">
  1115. {if $block.SbSwitcher && !$block.DisableSwitcher}
  1116. {if $block.switcherCycles !== null && $block.switcherCycles|@count > 1}
  1117. {assign var="cycles" value=$block.switcherCycles}
  1118. {else}
  1119. {assign var="cycles" value=$allCycles}
  1120. {/if}
  1121. {if !$block.bsco}
  1122. {assign var="cycles" value=$cycles|@array_reverse}
  1123. {/if}
  1124. <div class="product-billing-switcher-{$blockkey}">
  1125. <div class="btn-group white border d-none d-sm-inline-block" role="group">
  1126. {foreach $cycles as $cycle}
  1127. <button type="button" class="btn cycle-change" data-cycle="{$cycle}">
  1128. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  1129. </button>
  1130. {/foreach}
  1131. </div>
  1132. <div class="btn-group white border d-inline-block d-sm-none">
  1133. <span class="px-3 py-1 small text-muted border-right">{$WLANG.orderbillingcycle}</span>
  1134. <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
  1135. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycles[0]}}</span>
  1136. </button>
  1137. <ul class="dropdown-menu">
  1138. {foreach $cycles as $cycle}
  1139. <li class="dropdown-item cycle-change" data-cycle="{$cycle}">
  1140. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  1141. </li>
  1142. {/foreach}
  1143. </ul>
  1144. </div>
  1145. </div>
  1146. {/if}
  1147. <div class="pricing_style_2">
  1148. <div class="swiper" id="pricing-tables-{$blockkey}">
  1149. <div class="row row-eq-height{if !$block.DisplayInGrid} flex-nowrap{/if} pricing-slider swiper-wrapper pricing-{$blockkey}">
  1150. {if count($block.table) > 0}
  1151. {foreach from=$block.table item=$ditem key=$kk}
  1152. <div class="col-12{if $block.itemcounts == "2"} col-md-6{elseif $block.itemcounts == "3"} col-md-6 col-lg-4 col-xl-4{elseif $block.itemcounts == "4"} col-md-6 col-lg-4 col-xl-3{/if} products-slide">
  1153. <div class="cros-pricing-table overflow-hidden mt-0 mb-4 border-0 p-0{if $block.ststyle} {$block.ststyle}{/if}{if $block.noshadow} no-shadow{/if}{if $block.tablebg == "light"} light{elseif $block.tablebg == "primary"} bg-primary{elseif $block.tablebg == "dark"} dark{else} white{/if}{if $ditem['Featured']} active{/if}">
  1154. {if $ditem['Graphic']}
  1155. <div class="graphics">
  1156. {if !$ditem['Graphic']|strstr:"fa-"}
  1157. <img src="{$WEB_ROOT}/{$ditem['Graphic']}" alt="{$ditem.title}" class="h-rounded img-fluid">
  1158. {/if}
  1159. <div class="d-flex flex-column p-3{if $block.centered} align-items-center{/if}">
  1160. <div class="h4 mb-2">{$ditem['productdetails']['name']}</div>
  1161. {if $ditem['Featured']}
  1162. {if $block.ststyle}
  1163. <div class="feature-sticker mb-2">
  1164. <span class="st-sm">
  1165. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  1166. </span>
  1167. </div>
  1168. {else}
  1169. <div class="sticker-wrapper">
  1170. <div class="sticker">
  1171. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  1172. </div>
  1173. </div>
  1174. {/if}
  1175. {/if}
  1176. {if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
  1177. {if $block.bsco}
  1178. {foreach $ditem["dropdown"] as $dropdownkey=>$dropdownprice}
  1179. {$ditem["dropdown"][$dropdownkey] = $dropdownprice|@array_reverse}
  1180. {/foreach}
  1181. {/if}
  1182. {assign var="dropdownprice" value=$ditem["dropdown"][$ditem['Plan']][0] nocache}
  1183. {assign var="defaultbilling" value=$dropdownprice['cycle'] nocache}
  1184. {assign var="taxtype" value=$dropdownprice['taxtype'] nocache}
  1185. {assign var="hasconfigoptions" value=$dropdownprice['hasconfigoptions'] nocache}
  1186. <div class="billing-cycle-pricing mt-0 mb-2 float{if $block.descp == "below"} desc_belwo{/if}">
  1187. {if !$block.SbSwitcher}
  1188. <div class="btn-group dropup">
  1189. <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
  1190. <div class="pricing_wrapr">
  1191. {$dropdownprice['billingcycle']}
  1192. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  1193. </div>
  1194. <span class="fal fa-angle-down"></span>
  1195. </a>
  1196. <ul class="dropdown-menu">
  1197. {if $ditem["dropdown"][$ditem['Plan']]}
  1198. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  1199. <li class="billinging_wrapr" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  1200. <div class="pricing_wrapr">
  1201. {$dropdownprice['billingcycle']}
  1202. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  1203. </div>
  1204. </li>
  1205. {/foreach}
  1206. {/if}
  1207. </ul>
  1208. </div>
  1209. {/if}
  1210. </div>
  1211. {/if}
  1212. <div class="d-flex align-items-center mt-auto">
  1213. <div class="mr-auto">
  1214. {if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
  1215. <div class="billing-cycle-pricing m-0 float{if $block.descp == "below"} desc_belwo{/if}">
  1216. {if $ditem["dropdown"][$ditem['Plan']]}
  1217. <div class="product_pricing">
  1218. {if $block.SbSwitcher}
  1219. <div class="pricing_main_default{if $defaultbilling eq "{$dropdownprice['cycle']}"} w-hidden{/if}">
  1220. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  1221. <div class="regular_pricing">
  1222. {if $dropdownprice['hasconfigoptions']}
  1223. <span class="small text-muted">ab</span>
  1224. {/if}
  1225. {if $dropdownprice['save']}
  1226. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  1227. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  1228. {/if}
  1229. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  1230. {/if}
  1231. </div>
  1232. {/if}
  1233. <div class="price">
  1234. <span class="cost cost-small">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  1235. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  1236. </div>
  1237. <div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
  1238. {if $dropdownprice['setup'] > 0}
  1239. <div class="small text-muted">
  1240. <span><i class="fal fa-plus"></i></span>
  1241. <span>{$dropdownprice['prefix']}</span>
  1242. {$dropdownprice['setup']}
  1243. <span>{$dropdownprice['suffix']}</span>
  1244. {$WLANG.ordersetupfee}
  1245. </div>
  1246. {/if}
  1247. </div>
  1248. {/if}
  1249. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  1250. <div class="pricing_main {$dropdownprice['cycle']}{if $defaultbilling neq "{$dropdownprice['cycle']}"} w-hidden{/if}" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  1251. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  1252. <div class="regular_pricing">
  1253. {if $dropdownprice['hasconfigoptions']}
  1254. <span class="small text-muted">ab</span>
  1255. {/if}
  1256. {if $dropdownprice['save']}
  1257. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  1258. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  1259. {/if}
  1260. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  1261. {/if}
  1262. </div>
  1263. {/if}
  1264. <div class="price">
  1265. <span class="cost cost-small">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  1266. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  1267. </div>
  1268. <div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
  1269. {if $dropdownprice['setup'] > 0}
  1270. <div class="small text-muted">
  1271. <span><i class="fal fa-plus"></i></span>
  1272. <span>{$dropdownprice['prefix']}</span>
  1273. {$dropdownprice['setup']}
  1274. <span>{$dropdownprice['suffix']}</span>
  1275. {$WLANG.ordersetupfee}
  1276. </div>
  1277. {/if}
  1278. </div>
  1279. {/foreach}
  1280. </div>
  1281. {/if}
  1282. </div>
  1283. {else}
  1284. <div class="product_pricing_single m-0">
  1285. {if $block.DisableBrekdown}
  1286. {if isset($ditem.dropdown) && is_array($ditem.dropdown)}
  1287. {foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
  1288. {assign var="firstCycle" value=$dropdown|@end}
  1289. {if $firstCycle.hasconfigoptions}
  1290. <div class="regular_pricing">
  1291. <span class="small text-muted">ab</span>
  1292. </div>
  1293. {/if}
  1294. <div class="price">
  1295. <span class="cost cost-small">
  1296. {$firstCycle.prefix}{$firstCycle.price}
  1297. </span>
  1298. <span class="suffix">
  1299. {$firstCycle.suffix}
  1300. </spn>
  1301. </div>
  1302. <div class="cycle small text-muted">
  1303. {$firstCycle.cycle|capitalize}
  1304. </div>
  1305. {/foreach}
  1306. {/if}
  1307. {else}
  1308. {if $ditem["price"] == 'FREE'}
  1309. <span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>
  1310. {else}
  1311. {if $ditem["productdetails"]['hasconfigoptions']}
  1312. <div class="regular_pricing">
  1313. <span class="small text-muted">ab</span>
  1314. </div>
  1315. {/if}
  1316. <div class="price">
  1317. {assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
  1318. <span class="cost cost-small">{$ditem["productdetails"]["price"]['simple']}</span>
  1319. {if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
  1320. </div>
  1321. {if $ditem["billingcycle"] != ""}
  1322. <div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
  1323. {elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
  1324. <div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
  1325. {/if}
  1326. {if $ditem["productdetails"]["price"]["setupFee"]}
  1327. <div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
  1328. {/if}
  1329. {/if}
  1330. {/if}
  1331. </div>
  1332. {/if}
  1333. </div>
  1334. {if $ditem['ProductLink']}
  1335. <a href="{if $ditem['link'] == 'domainregister'}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&domain=register{elseif $ditem['link'] == 'domaintransfer'}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&domain=transfer{else}{$WEB_ROOT}/{$ditem['link']}{/if}" class="btn btn-sm w-auto mt-0 btn-primary">
  1336. {if $ditem['ProductbtnText']}{$ditem['ProductbtnText']}{else}{$WLANG.learnmore}{/if}
  1337. </a>
  1338. {else}
  1339. <a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}&billingcycle={$defaultbilling}{/if}{/if}" class="btn btn-sm w-auto mt-0 btn-order-link btn-primary{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
  1340. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  1341. </a>
  1342. {/if}
  1343. </div>
  1344. </div>
  1345. </div>
  1346. {else}
  1347. <div class="d-flex align-items-center justify-content-center p-3 h-100">
  1348. <div class="alert alert-danger text-center">
  1349. Must required graphic for this type of product section.
  1350. </div>
  1351. </div>
  1352. {/if}
  1353. </div>
  1354. </div>
  1355. {/foreach}
  1356. {/if}
  1357. </div>
  1358. </div>
  1359. {if !$block.DisplayInGrid}
  1360. {if !$block.slidertype}
  1361. <div class="swiper-pagination pricing-tables_{$blockkey}"></div>
  1362. {else}
  1363. <div class="swiper-button-prev pricing-tables_{$blockkey}_prev">
  1364. <span class="btn_icon_large"><i class="far fa-long-arrow-left"></i></span>
  1365. </div>
  1366. <div class="swiper-button-next pricing-tables_{$blockkey}_next">
  1367. <span class="btn_icon_large"><i class="far fa-long-arrow-right"></i></span>
  1368. </div>
  1369. {/if}
  1370. {/if}
  1371. </div>
  1372. </div>
  1373. </div>
  1374. </div>
  1375. <script>
  1376. jQuery(document).ready(function () {
  1377. {if !$block.DisplayInGrid}
  1378. var swiper = new Swiper('#pricing-tables-{$blockkey}', {
  1379. slidesPerView: 1,
  1380. preventClicks: true,
  1381. slideClass: 'products-slide',
  1382. {if !$block.slidertype}
  1383. pagination: {
  1384. el: '.swiper-pagination.pricing-tables_{$blockkey}',
  1385. clickable: true,
  1386. },
  1387. {else}
  1388. navigation: {
  1389. nextEl: '.pricing-tables_{$blockkey}_next',
  1390. prevEl: '.pricing-tables_{$blockkey}_prev',
  1391. },
  1392. {/if}
  1393. breakpoints: {
  1394. 0: {
  1395. slidesPerView: 1
  1396. },
  1397. 768: {
  1398. slidesPerView: 2
  1399. },
  1400. 992: {
  1401. slidesPerView:{if $block.itemcounts == "2"} 2{else} 3{/if}
  1402. },
  1403. 1200: {
  1404. slidesPerView:{if $block.itemcounts == ""} 3{else} {$block.itemcounts}{/if}
  1405. },
  1406. }
  1407. });
  1408. {/if}
  1409. {if $block.SbSwitcher && !$block.DisableSwitcher}
  1410. jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
  1411. var selText = jQuery(this).html();
  1412. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
  1413. });
  1414. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
  1415. var newCycle = jQuery(this).data('cycle');
  1416. var disBtnBilCycle = jQuery(this).data('cycle');
  1417. jQuery('.pricing-{$blockkey} .product_pricing .pricing_main').hide();
  1418. jQuery('.pricing-{$blockkey} .' + newCycle).show();
  1419. jQuery(this).addClass('active').siblings().removeClass('active');
  1420. jQuery('.pricing-{$blockkey} .cros-pricing-table').each(function(index) {
  1421. var btnOrder = jQuery(this).find('.btn-order-link');
  1422. if (btnOrder.length) {
  1423. var disBtnUrlFetch = btnOrder.attr('href');
  1424. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  1425. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv) + '&billingcycle=' + disBtnBilCycle;
  1426. btnOrder.attr('href', disBtnUrlFinal);
  1427. }
  1428. if (jQuery(this).find('.' + newCycle).length <= 0) {
  1429. jQuery(this).find('.pricing_main_default').show();
  1430. btnOrder.addClass('disabled');
  1431. } else {
  1432. jQuery(this).find('.pricing_main_default').hide();
  1433. btnOrder.removeClass('disabled');
  1434. }
  1435. });
  1436. });
  1437. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');
  1438. {else}
  1439. {if !$block.DisableSwitcher}
  1440. jQuery(".pricing-{$blockkey} .dropdown-menu li").click(function(){
  1441. var selText = jQuery(this).html();
  1442. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
  1443. });
  1444. jQuery('.pricing-{$blockkey} .billinging_wrapr').click(function(){
  1445. var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  1446. var btnOrder = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-order-link');
  1447. if (btnOrder.length) {
  1448. var disBtnUrlFetch = btnOrder.attr('href');
  1449. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  1450. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv) + '&billingcycle=' + disBtnBilCycle;
  1451. btnOrder.attr('href', disBtnUrlFinal);
  1452. }
  1453. var crosPricingTable = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table');
  1454. crosPricingTable.find('.pricing_main').each(function() {
  1455. var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  1456. if (currentBilCycle === disBtnBilCycle) {
  1457. jQuery(this).removeClass('w-hidden');
  1458. } else {
  1459. jQuery(this).addClass('w-hidden');
  1460. }
  1461. });
  1462. });
  1463. {/if}
  1464. {/if}
  1465. });
  1466. </script>
  1467. {/if}
  1468. {/if}