products.tpl 83 KB

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