products.tpl 83 KB

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