products.tpl 83 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709
  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">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  647. {/if}
  648. {* {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if} *}
  649. {/if}
  650. </span>
  651. {/if}
  652. <span class="cost">
  653. {$dropdownprice['prefix']}
  654. {if $block.DisableBrekdown}
  655. {$dropdownprice['price']}
  656. {else}
  657. {$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}
  658. {/if}
  659. ^ </span>
  660. {if $dropdownprice['suffix']}
  661. <span class="suffix">
  662. {$dropdownprice['suffix']}
  663. </span>
  664. {/if}
  665. </div>
  666. <span class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</span>
  667. {if $dropdownprice['setup'] > 0}
  668. <div class="small text-muted">
  669. <span><i class="fal fa-plus"></i></span>
  670. <span>{$dropdownprice['prefix']}</span>
  671. {$dropdownprice['setup']}
  672. <span>{$dropdownprice['suffix']}</span>
  673. {$WLANG.ordersetupfee}
  674. </div>
  675. {/if}
  676. </div>
  677. {/if}
  678. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  679. <div class="pricing_main {$dropdownprice['cycle']}{if $defaultbilling neq "{$dropdownprice['cycle']}"} w-hidden{/if}" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  680. <div class="price">
  681. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  682. <span class="regular_pricing">
  683. {if $dropdownprice['hasconfigoptions']}
  684. <span class="small text-muted">{$WLANG.from}</span>
  685. {/if}
  686. {if $dropdownprice['save']}
  687. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  688. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  689. {/if}
  690. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  691. {/if}
  692. </span>
  693. {/if}
  694. <span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  695. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  696. </div>
  697. <span class="cycle small text-muted">
  698. {if $block.DisableBrekdown}
  699. {$dropdownprice.cycle|capitalize}
  700. {else}
  701. {if $dropdownprice['monthlycycle']}
  702. {$dropdownprice['monthlycycle']}
  703. {else}
  704. {$dropdownprice['cycleTerm']}
  705. {/if}
  706. {/if}
  707. </span>
  708. {if $dropdownprice['setup'] > 0}
  709. <div class="small text-muted">
  710. <span><i class="fal fa-plus"></i></span>
  711. <span>{$dropdownprice['prefix']}</span>
  712. {$dropdownprice['setup']}
  713. <span>{$dropdownprice['suffix']}</span>
  714. {$WLANG.ordersetupfee}
  715. </div>
  716. {/if}
  717. </div>
  718. {/foreach}
  719. </div>
  720. {/if}
  721. </div>
  722. {else}
  723. <div class="product_pricing_single">
  724. {if $block.DisableBrekdown}
  725. {if isset($ditem.dropdown) && is_array($ditem.dropdown)}
  726. {foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
  727. {assign var="firstCycle" value=$dropdown|@end}
  728. <div class="price">
  729. {if $firstCycle.hasconfigoptions}
  730. <span class="regular_pricing">
  731. <span class="small text-muted">{$WLANG.from}</span>
  732. </span>
  733. {/if}
  734. <span class="cost">
  735. {$firstCycle.prefix}{$firstCycle.price}
  736. </span>
  737. <span class="suffix">
  738. {$firstCycle.suffix}
  739. </spn>
  740. </div>
  741. <div class="cycle small text-muted">
  742. {$firstCycle.cycle|capitalize}
  743. </div>
  744. {/foreach}
  745. {/if}
  746. {else}
  747. {if $ditem["price"] == 'FREE'}
  748. <div class="d-flex align-items-center justify-content-end">
  749. <span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>
  750. </div>
  751. {else}
  752. <div class="price">
  753. {if $ditem["productdetails"]['hasconfigoptions']}
  754. <span class="regular_pricing">
  755. <span class="small text-muted">{$WLANG.from}</span>
  756. </span>
  757. {/if}
  758. {assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
  759. <span class="cost">{$ditem["productdetails"]["price"]['simple']}</span>
  760. {if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
  761. </div>
  762. {if $ditem["billingcycle"] != ""}
  763. <div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
  764. {elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
  765. <div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
  766. {/if}
  767. {if $ditem["productdetails"]["price"]["setupFee"]}
  768. <div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
  769. {/if}
  770. {/if}
  771. {/if}
  772. </div>
  773. {/if}
  774. <div class="plan-action mt-auto">
  775. <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}">
  776. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  777. </a>
  778. </div>
  779. </div>
  780. </div>
  781. </div>
  782. {if $ditem['Featured']}
  783. {if $block.ststyle == ""}
  784. <div class="sticker-wrapper{if !$block.SbSwitcher} se{/if}">
  785. <div class="sticker">
  786. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  787. </div>
  788. </div>
  789. {/if}
  790. {/if}
  791. </div>
  792. {/foreach}
  793. {/if}
  794. </div>
  795. </div>
  796. </div>
  797. </div>
  798. <script>
  799. jQuery(document).ready(function () {
  800. {if $block.SbSwitcher && !$block.DisableSwitcher}
  801. jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
  802. var selText = jQuery(this).html();
  803. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
  804. });
  805. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
  806. var newCycle = jQuery(this).data('cycle');
  807. var disBtnBilCycle = jQuery(this).data('cycle');
  808. jQuery('.pricing-{$blockkey} .product_pricing .pricing_main').hide();
  809. jQuery('.pricing-{$blockkey} .' + newCycle).show();
  810. jQuery(this).addClass('active').siblings().removeClass('active');
  811. jQuery('.pricing-{$blockkey} .cros-pricing-table').each(function(index) {
  812. var disBtnUrlFetch = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href');
  813. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  814. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  815. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  816. jQuery(this).find('.btn-primary').attr('href',disBtnUrlFinal);
  817. if (jQuery(this).find('.' + newCycle).length <= 0) {
  818. jQuery(this).find('.pricing_main_default').show();
  819. jQuery(this).find('.btn-primary').addClass('disabled');
  820. } else {
  821. jQuery(this).find('.pricing_main_default').hide();
  822. jQuery(this).find('.btn-primary').removeClass('disabled');
  823. }
  824. });
  825. });
  826. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');
  827. {else}
  828. {if !$block.DisableSwitcher}
  829. jQuery(".pricing-{$blockkey} .dropdown-menu li").click(function(){
  830. var selText = jQuery(this).html();
  831. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
  832. });
  833. jQuery('.pricing-{$blockkey} .billinging_wrapr').click(function(){
  834. var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  835. var disBtnUrlFetch = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href');
  836. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  837. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  838. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  839. jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href',disBtnUrlFinal);
  840. var crosPricingTable = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table');
  841. crosPricingTable.find('.pricing_main').each(function() {
  842. var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  843. if (currentBilCycle === disBtnBilCycle) {
  844. jQuery(this).removeClass('w-hidden');
  845. } else {
  846. jQuery(this).addClass('w-hidden');
  847. }
  848. });
  849. });
  850. {/if}
  851. {/if}
  852. });
  853. </script>
  854. {elseif $block.ptstyle == 'pts_2'}
  855. <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}">
  856. <div class="section__plan_comparison">
  857. <div class="container">
  858. {if $block.caption || $block.sectitle || $block.subtitle}
  859. <div class="sec-description">
  860. {if $block.caption}
  861. <div class="sec-caption">
  862. <span class="rounded">{$block.caption}</span>
  863. </div>
  864. {/if}
  865. {if $block.sectitle}
  866. <h2 class="sec-title">{$block.sectitle}</h2>
  867. {/if}
  868. {if $block.subtitle}
  869. <div class="sec-subtitle">{$block.subtitle}</div>
  870. {/if}
  871. </div>
  872. {/if}
  873. <div class="cros-pricing-container">
  874. {if $block.SbSwitcher && !$block.DisableSwitcher}
  875. {if $block.switcherCycles !== null && $block.switcherCycles|@count > 1}
  876. {assign var="cycles" value=$block.switcherCycles}
  877. {else}
  878. {assign var="cycles" value=$allCycles}
  879. {/if}
  880. {if !$block.bsco}
  881. {assign var="cycles" value=$cycles|@array_reverse}
  882. {/if}
  883. <div class="product-billing-switcher-{$blockkey}">
  884. <div class="btn-group white border d-none d-sm-inline-block" role="group">
  885. {foreach $cycles as $cycle}
  886. <button type="button" class="btn cycle-change" data-cycle="{$cycle}">
  887. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  888. </button>
  889. {/foreach}
  890. </div>
  891. <div class="btn-group white border d-inline-block d-sm-none">
  892. <span class="px-3 py-1 small text-muted border-right">{$WLANG.orderbillingcycle}</span>
  893. <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
  894. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycles[0]}}</span>
  895. </button>
  896. <ul class="dropdown-menu">
  897. {foreach $cycles as $cycle}
  898. <li class="dropdown-item cycle-change" data-cycle="{$cycle}">
  899. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  900. </li>
  901. {/foreach}
  902. </ul>
  903. </div>
  904. </div>
  905. {/if}
  906. <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}">
  907. <div class="plans_slider__nav border-bottom">
  908. <div class="swiper-button-next tables_{$blockkey}_next">
  909. <span class="btn__text text-muted">{$WLANG.tablepagesnext}</span>
  910. <span class="btn__icon"><i class="far fa-long-arrow-right"></i></span>
  911. </div>
  912. <div class="swiper-button-prev tables_{$blockkey}_prev">
  913. <span class="btn__icon"><i class="far fa-long-arrow-left"></i></span>
  914. <span class="btn__text text-muted">{$WLANG.tablepagesprevious}</span>
  915. </div>
  916. </div>
  917. <div class="plan plan-{$blockkey}{if $block.centered} centered{/if}">
  918. <div class="plan__column plan__column--empty">
  919. <div class="plan__header d-flex align-items-center{if $block.table[0].Graphic|trim != ""} hg{/if}">
  920. <span class="h4">{$WLANG['store']['ox']['featuresHeadline']}</span>
  921. </div>
  922. <div class="plan__body plan__body--right">
  923. {foreach from=$block.table|@array_column:'featurelist'|@array_count_values item=count key=featurelist}
  924. {$featurelist}
  925. {/foreach}
  926. <div class="plan__cell plan__cell-last{if $block.SbSwitcher || $block.DisableSwitcher} sb{/if}"></div>
  927. </div>
  928. </div>
  929. <div class="swiper-container" id="plans-slider-{$blockkey}">
  930. <div class="swiper-wrapper">
  931. {if count($block.table) > 0}
  932. {foreach from=$block.table item=$ditem key=$kk}
  933. <div class="swiper-slide">
  934. <div class="plan__column">
  935. <div class="plan__header{if $ditem['Graphic']} hg{/if}">
  936. {if $ditem['Graphic']}
  937. <div class="graphics">
  938. {if !$ditem['Graphic']|strstr:"fa-"}
  939. <img src="{$WEB_ROOT}/{$ditem['Graphic']}" alt="{$ditem.title}" class="img-fluid">
  940. {else}
  941. <span class="icon">
  942. <i class="{$ditem['Graphic']}"></i>
  943. </span>
  944. {/if}
  945. </div>
  946. {/if}
  947. <span class="h4">{$ditem['productdetails']['name']}</span>
  948. </div>
  949. <div class="plan__body">
  950. {$ditem['featuresvalues']}
  951. <div class="plan__cell plan__cell-last{if $block.SbSwitcher || $block.DisableSwitcher} sb{/if}">
  952. {if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
  953. {if $block.bsco}
  954. {foreach $ditem["dropdown"] as $dropdownkey=>$dropdownprice}
  955. {$ditem["dropdown"][$dropdownkey] = $dropdownprice|@array_reverse}
  956. {/foreach}
  957. {/if}
  958. {assign var="dropdownprice" value=$ditem["dropdown"][$ditem['Plan']][0] nocache}
  959. {assign var="defaultbilling" value=$dropdownprice['cycle'] nocache}
  960. {assign var="taxtype" value=$dropdownprice['taxtype'] nocache}
  961. {assign var="hasconfigoptions" value=$dropdownprice['hasconfigoptions'] nocache}
  962. <div class="billing-cycle-pricing float{if $block.descp == "below"} desc_belwo{/if}">
  963. {if !$block.SbSwitcher}
  964. <div class="btn-group mb-2 dropup">
  965. <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
  966. <div class="pricing_wrapr">
  967. {$dropdownprice['billingcycle']}
  968. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  969. </div>
  970. <span class="fal fa-angle-down"></span>
  971. </a>
  972. <ul class="dropdown-menu">
  973. {if $ditem["dropdown"][$ditem['Plan']]}
  974. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  975. <li class="billinging_wrapr" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  976. <div class="pricing_wrapr">
  977. {$dropdownprice['billingcycle']}
  978. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  979. </div>
  980. </li>
  981. {/foreach}
  982. {/if}
  983. </ul>
  984. </div>
  985. {/if}
  986. {if $ditem["dropdown"][$ditem['Plan']]}
  987. <div class="product_pricing">
  988. {if $block.SbSwitcher}
  989. <div class="pricing_main_default{if $defaultbilling eq "{$dropdownprice['cycle']}"} w-hidden{/if}">
  990. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  991. <div class="regular_pricing">
  992. {if $dropdownprice['hasconfigoptions']}
  993. <span class="small text-muted">{$WLANG.from}</span>
  994. {/if}
  995. {if $dropdownprice['save']}
  996. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  997. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  998. {/if}
  999. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  1000. {/if}
  1001. </div>
  1002. {/if}
  1003. <div class="price">
  1004. <span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  1005. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  1006. </div>
  1007. <div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
  1008. {if $dropdownprice['setup'] > 0}
  1009. <div class="small text-muted">
  1010. <span><i class="fal fa-plus"></i></span>
  1011. <span>{$dropdownprice['prefix']}</span>
  1012. {$dropdownprice['setup']}
  1013. <span>{$dropdownprice['suffix']}</span>
  1014. {$WLANG.ordersetupfee}
  1015. </div>
  1016. {/if}
  1017. </div>
  1018. {/if}
  1019. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  1020. <div class="pricing_main {$dropdownprice['cycle']}{if $defaultbilling neq "{$dropdownprice['cycle']}"} w-hidden{/if}" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  1021. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  1022. <div class="regular_pricing">
  1023. {if $dropdownprice['hasconfigoptions']}
  1024. <span class="small text-muted">{$WLANG.from}</span>
  1025. {/if}
  1026. {if $dropdownprice['save']}
  1027. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  1028. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  1029. {/if}
  1030. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  1031. {/if}
  1032. </div>
  1033. {/if}
  1034. <div class="price">
  1035. <span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  1036. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  1037. </div>
  1038. <div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
  1039. {if $dropdownprice['setup'] > 0}
  1040. <div class="small text-muted">
  1041. <span><i class="fal fa-plus"></i></span>
  1042. <span>{$dropdownprice['prefix']}</span>
  1043. {$dropdownprice['setup']}
  1044. <span>{$dropdownprice['suffix']}</span>
  1045. {$WLANG.ordersetupfee}
  1046. </div>
  1047. {/if}
  1048. </div>
  1049. {/foreach}
  1050. </div>
  1051. {/if}
  1052. </div>
  1053. <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}">
  1054. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  1055. </a>
  1056. {else}
  1057. <div class="product_pricing_single d-flex flex-column justify-content-center h-100">
  1058. {if $block.DisableBrekdown}
  1059. {if isset($ditem.dropdown) && is_array($ditem.dropdown)}
  1060. {foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
  1061. {assign var="firstCycle" value=$dropdown|@end}
  1062. {if $firstCycle.hasconfigoptions}
  1063. <div class="regular_pricing">
  1064. <span class="small text-muted">{$WLANG.from}</span>
  1065. </div>
  1066. {/if}
  1067. <div class="price">
  1068. <span class="cost">
  1069. {$firstCycle.prefix}{$firstCycle.price}
  1070. </span>
  1071. <span class="suffix">
  1072. {$firstCycle.suffix}
  1073. </spn>
  1074. </div>
  1075. <div class="cycle small text-muted">
  1076. {$firstCycle.cycle|capitalize}
  1077. </div>
  1078. {/foreach}
  1079. {/if}
  1080. {else}
  1081. {if $ditem["price"] == 'FREE'}
  1082. <span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>
  1083. {else}
  1084. {if $ditem["productdetails"]['hasconfigoptions']}
  1085. <div class="regular_pricing">
  1086. <span class="small text-muted">{$WLANG.from}</span>
  1087. </div>
  1088. {/if}
  1089. <div class="price">
  1090. {assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
  1091. <span class="cost">{$ditem["productdetails"]["price"]['simple']}</span>
  1092. {if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
  1093. </div>
  1094. {if $ditem["billingcycle"] != ""}
  1095. <div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
  1096. {elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
  1097. <div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
  1098. {/if}
  1099. {if $ditem["productdetails"]["price"]["setupFee"]}
  1100. <div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
  1101. {/if}
  1102. {/if}
  1103. {/if}
  1104. <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}">
  1105. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  1106. </a>
  1107. </div>
  1108. {/if}
  1109. </div>
  1110. </div>
  1111. {if $ditem['Featured']}
  1112. <div class="sticker-wrapper">
  1113. <div class="sticker">
  1114. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  1115. </div>
  1116. </div>
  1117. {/if}
  1118. </div>
  1119. </div>
  1120. {/foreach}
  1121. {/if}
  1122. </div>
  1123. </div>
  1124. </div>
  1125. </div>
  1126. </div>
  1127. </div>
  1128. </div>
  1129. </div>
  1130. <script>
  1131. jQuery(document).ready(function () {
  1132. var swiper = new Swiper('#plans-slider-{$blockkey}', {
  1133. slidesPerView: 1,
  1134. navigation: {
  1135. nextEl: '.tables_{$blockkey}_next',
  1136. prevEl: '.tables_{$blockkey}_prev',
  1137. },
  1138. breakpoints: {
  1139. 0: {
  1140. slidesPerView: 1,
  1141. },
  1142. 768: {
  1143. slidesPerView: 2,
  1144. },
  1145. 992: {
  1146. slidesPerView: {if $block.itemcounts == "2"} 2{else} 3{/if},
  1147. },
  1148. 1200: {
  1149. slidesPerView: {if $block.itemcounts == ""} 3{else} {$block.itemcounts}{/if},
  1150. },
  1151. },
  1152. on: {
  1153. init: function (swiper) {
  1154. toggleSliderNav(swiper);
  1155. },
  1156. slideChange: function (swiper) {
  1157. toggleSliderNav(swiper);
  1158. },
  1159. reachEnd: function (swiper) {
  1160. toggleSliderNav(swiper);
  1161. },
  1162. reachBeginning: function (swiper) {
  1163. toggleSliderNav(swiper);
  1164. },
  1165. resize: function (swiper) {
  1166. toggleSliderNav(swiper);
  1167. }
  1168. }
  1169. });
  1170. function toggleSliderNav(swiper) {
  1171. var nav = document.querySelector('.tables_{$blockkey} .plans_slider__nav');
  1172. if (swiper.isBeginning && swiper.isEnd) {
  1173. nav.style.display = 'none';
  1174. } else {
  1175. nav.style.display = 'flex';
  1176. }
  1177. }
  1178. {if $block.SbSwitcher && !$block.DisableSwitcher}
  1179. jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
  1180. var selText = jQuery(this).html();
  1181. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
  1182. });
  1183. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
  1184. var newCycle = jQuery(this).data('cycle');
  1185. var disBtnBilCycle = jQuery(this).data('cycle');
  1186. jQuery('.plan-{$blockkey} .pricing_main').hide();
  1187. jQuery('.plan-{$blockkey} .' + newCycle).show();
  1188. jQuery(this).addClass('active').siblings().removeClass('active');
  1189. jQuery('.plan-{$blockkey} .plan__body').each(function(index) {
  1190. var disBtnUrlFetch = jQuery(this).closest('.plan-{$blockkey}').find('.btn-primary').attr('href');
  1191. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  1192. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  1193. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  1194. jQuery(this).find('.btn-primary').attr('href',disBtnUrlFinal);
  1195. if (jQuery(this).find('.' + newCycle).length <= 0) {
  1196. jQuery(this).find('.pricing_main_default').show();
  1197. jQuery(this).find('.btn-primary').addClass('disabled');
  1198. } else {
  1199. jQuery(this).find('.pricing_main_default').hide();
  1200. jQuery(this).find('.btn-primary').removeClass('disabled');
  1201. }
  1202. });
  1203. });
  1204. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');
  1205. {else}
  1206. {if !$block.DisableSwitcher}
  1207. jQuery(".plan-{$blockkey} .dropdown-menu li").click(function(){
  1208. var selText = jQuery(this).html();
  1209. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
  1210. });
  1211. jQuery('.plan-{$blockkey} .billinging_wrapr').click(function(){
  1212. var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  1213. var disBtnUrlFetch = jQuery(this).closest('.plan-{$blockkey} .plan__body').find('.btn-primary').attr('href');
  1214. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  1215. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  1216. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  1217. jQuery(this).closest('.plan-{$blockkey} .plan__body').find('.btn-primary').attr('href',disBtnUrlFinal);
  1218. var crosPricingTable = jQuery(this).closest('.plan-{$blockkey} .plan__body');
  1219. crosPricingTable.find('.pricing_main').each(function() {
  1220. var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  1221. if (currentBilCycle === disBtnBilCycle) {
  1222. jQuery(this).removeClass('w-hidden');
  1223. } else {
  1224. jQuery(this).addClass('w-hidden');
  1225. }
  1226. });
  1227. });
  1228. {/if}
  1229. {/if}
  1230. });
  1231. </script>
  1232. {elseif $block.ptstyle == 'pts_3'}
  1233. <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}">
  1234. <div class="container">
  1235. {if $block.caption || $block.sectitle || $block.subtitle}
  1236. <div class="sec-description">
  1237. {if $block.caption}
  1238. <div class="sec-caption">
  1239. <span class="rounded">{$block.caption}</span>
  1240. </div>
  1241. {/if}
  1242. {if $block.sectitle}
  1243. <h2 class="sec-title">{$block.sectitle}</h2>
  1244. {/if}
  1245. {if $block.subtitle}
  1246. <div class="sec-subtitle">{$block.subtitle}</div>
  1247. {/if}
  1248. </div>
  1249. {/if}
  1250. <div class="cros-pricing-container">
  1251. {if $block.SbSwitcher && !$block.DisableSwitcher}
  1252. {if $block.switcherCycles !== null && $block.switcherCycles|@count > 1}
  1253. {assign var="cycles" value=$block.switcherCycles}
  1254. {else}
  1255. {assign var="cycles" value=$allCycles}
  1256. {/if}
  1257. {if !$block.bsco}
  1258. {assign var="cycles" value=$cycles|@array_reverse}
  1259. {/if}
  1260. <div class="product-billing-switcher-{$blockkey}">
  1261. <div class="btn-group white border d-none d-sm-inline-block" role="group">
  1262. {foreach $cycles as $cycle}
  1263. <button type="button" class="btn cycle-change" data-cycle="{$cycle}">
  1264. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  1265. </button>
  1266. {/foreach}
  1267. </div>
  1268. <div class="btn-group white border d-inline-block d-sm-none">
  1269. <span class="px-3 py-1 small text-muted border-right">{$WLANG.orderbillingcycle}</span>
  1270. <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
  1271. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycles[0]}}</span>
  1272. </button>
  1273. <ul class="dropdown-menu">
  1274. {foreach $cycles as $cycle}
  1275. <li class="dropdown-item cycle-change" data-cycle="{$cycle}">
  1276. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  1277. </li>
  1278. {/foreach}
  1279. </ul>
  1280. </div>
  1281. </div>
  1282. {/if}
  1283. <div class="pricing_style_2">
  1284. <div class="swiper" id="pricing-tables-{$blockkey}">
  1285. <div class="row row-eq-height{if !$block.DisplayInGrid} flex-nowrap{/if} pricing-slider swiper-wrapper pricing-{$blockkey}">
  1286. {if count($block.table) > 0}
  1287. {foreach from=$block.table item=$ditem key=$kk}
  1288. <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">
  1289. <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}">
  1290. {if $ditem['Graphic']}
  1291. <div class="graphics">
  1292. {if !$ditem['Graphic']|strstr:"fa-"}
  1293. <img src="{$WEB_ROOT}/{$ditem['Graphic']}" alt="{$ditem.title}" class="h-rounded img-fluid">
  1294. {/if}
  1295. <div class="d-flex flex-column p-3{if $block.centered} align-items-center{/if}">
  1296. <div class="h4 mb-2">{$ditem['productdetails']['name']}</div>
  1297. {if $ditem['Featured']}
  1298. {if $block.ststyle}
  1299. <div class="feature-sticker mb-2">
  1300. <span class="st-sm">
  1301. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  1302. </span>
  1303. </div>
  1304. {else}
  1305. <div class="sticker-wrapper">
  1306. <div class="sticker">
  1307. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  1308. </div>
  1309. </div>
  1310. {/if}
  1311. {/if}
  1312. {if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
  1313. {if $block.bsco}
  1314. {foreach $ditem["dropdown"] as $dropdownkey=>$dropdownprice}
  1315. {$ditem["dropdown"][$dropdownkey] = $dropdownprice|@array_reverse}
  1316. {/foreach}
  1317. {/if}
  1318. {assign var="dropdownprice" value=$ditem["dropdown"][$ditem['Plan']][0] nocache}
  1319. {assign var="defaultbilling" value=$dropdownprice['cycle'] nocache}
  1320. {assign var="taxtype" value=$dropdownprice['taxtype'] nocache}
  1321. {assign var="hasconfigoptions" value=$dropdownprice['hasconfigoptions'] nocache}
  1322. <div class="billing-cycle-pricing mt-0 mb-2 float{if $block.descp == "below"} desc_belwo{/if}">
  1323. {if !$block.SbSwitcher}
  1324. <div class="btn-group dropup">
  1325. <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
  1326. <div class="pricing_wrapr">
  1327. {$dropdownprice['billingcycle']}
  1328. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  1329. </div>
  1330. <span class="fal fa-angle-down"></span>
  1331. </a>
  1332. <ul class="dropdown-menu">
  1333. {if $ditem["dropdown"][$ditem['Plan']]}
  1334. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  1335. <li class="billinging_wrapr" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  1336. <div class="pricing_wrapr">
  1337. {$dropdownprice['billingcycle']}
  1338. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  1339. </div>
  1340. </li>
  1341. {/foreach}
  1342. {/if}
  1343. </ul>
  1344. </div>
  1345. {/if}
  1346. </div>
  1347. {/if}
  1348. <div class="d-flex align-items-center mt-auto">
  1349. <div class="mr-auto">
  1350. {if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
  1351. <div class="billing-cycle-pricing m-0 float{if $block.descp == "below"} desc_belwo{/if}">
  1352. {if $ditem["dropdown"][$ditem['Plan']]}
  1353. <div class="product_pricing">
  1354. {if $block.SbSwitcher}
  1355. <div class="pricing_main_default{if $defaultbilling eq "{$dropdownprice['cycle']}"} w-hidden{/if}">
  1356. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  1357. <div class="regular_pricing">
  1358. {if $dropdownprice['hasconfigoptions']}
  1359. <span class="small text-muted">{$WLANG.from}</span>
  1360. {/if}
  1361. {if $dropdownprice['save']}
  1362. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  1363. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  1364. {/if}
  1365. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  1366. {/if}
  1367. </div>
  1368. {/if}
  1369. <div class="price">
  1370. <span class="cost cost-small">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  1371. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  1372. </div>
  1373. <div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
  1374. {if $dropdownprice['setup'] > 0}
  1375. <div class="small text-muted">
  1376. <span><i class="fal fa-plus"></i></span>
  1377. <span>{$dropdownprice['prefix']}</span>
  1378. {$dropdownprice['setup']}
  1379. <span>{$dropdownprice['suffix']}</span>
  1380. {$WLANG.ordersetupfee}
  1381. </div>
  1382. {/if}
  1383. </div>
  1384. {/if}
  1385. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  1386. <div class="pricing_main {$dropdownprice['cycle']}{if $defaultbilling neq "{$dropdownprice['cycle']}"} w-hidden{/if}" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  1387. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  1388. <div class="regular_pricing">
  1389. {if $dropdownprice['hasconfigoptions']}
  1390. <span class="small text-muted">{$WLANG.from}</span>
  1391. {/if}
  1392. {if $dropdownprice['save']}
  1393. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  1394. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  1395. {/if}
  1396. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  1397. {/if}
  1398. </div>
  1399. {/if}
  1400. <div class="price">
  1401. <span class="cost cost-small">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  1402. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  1403. </div>
  1404. <div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
  1405. {if $dropdownprice['setup'] > 0}
  1406. <div class="small text-muted">
  1407. <span><i class="fal fa-plus"></i></span>
  1408. <span>{$dropdownprice['prefix']}</span>
  1409. {$dropdownprice['setup']}
  1410. <span>{$dropdownprice['suffix']}</span>
  1411. {$WLANG.ordersetupfee}
  1412. </div>
  1413. {/if}
  1414. </div>
  1415. {/foreach}
  1416. </div>
  1417. {/if}
  1418. </div>
  1419. {else}
  1420. <div class="product_pricing_single m-0">
  1421. {if $block.DisableBrekdown}
  1422. {if isset($ditem.dropdown) && is_array($ditem.dropdown)}
  1423. {foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
  1424. {assign var="firstCycle" value=$dropdown|@end}
  1425. {if $firstCycle.hasconfigoptions}
  1426. <div class="regular_pricing">
  1427. <span class="small text-muted">{$WLANG.from}</span>
  1428. </div>
  1429. {/if}
  1430. <div class="price">
  1431. <span class="cost cost-small">
  1432. {$firstCycle.prefix}{$firstCycle.price}
  1433. </span>
  1434. <span class="suffix">
  1435. {$firstCycle.suffix}
  1436. </spn>
  1437. </div>
  1438. <div class="cycle small text-muted">
  1439. {$firstCycle.cycle|capitalize}
  1440. </div>
  1441. {/foreach}
  1442. {/if}
  1443. {else}
  1444. {if $ditem["price"] == 'FREE'}
  1445. <span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>
  1446. {else}
  1447. {if $ditem["productdetails"]['hasconfigoptions']}
  1448. <div class="regular_pricing">
  1449. <span class="small text-muted">{$WLANG.from}</span>
  1450. </div>
  1451. {/if}
  1452. <div class="price">
  1453. {assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
  1454. <span class="cost cost-small">{$ditem["productdetails"]["price"]['simple']}</span>
  1455. {if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
  1456. </div>
  1457. {if $ditem["billingcycle"] != ""}
  1458. <div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
  1459. {elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
  1460. <div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
  1461. {/if}
  1462. {if $ditem["productdetails"]["price"]["setupFee"]}
  1463. <div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
  1464. {/if}
  1465. {/if}
  1466. {/if}
  1467. </div>
  1468. {/if}
  1469. </div>
  1470. {if $ditem['ProductLink']}
  1471. <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">
  1472. {if $ditem['ProductbtnText']}{$ditem['ProductbtnText']}{else}{$WLANG.learnmore}{/if}
  1473. </a>
  1474. {else}
  1475. <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}">
  1476. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  1477. </a>
  1478. {/if}
  1479. </div>
  1480. </div>
  1481. </div>
  1482. {else}
  1483. <div class="d-flex align-items-center justify-content-center p-3 h-100">
  1484. <div class="alert alert-danger text-center">
  1485. Must required graphic for this type of product section.
  1486. </div>
  1487. </div>
  1488. {/if}
  1489. </div>
  1490. </div>
  1491. {/foreach}
  1492. {/if}
  1493. </div>
  1494. </div>
  1495. {if !$block.DisplayInGrid}
  1496. {if !$block.slidertype}
  1497. <div class="swiper-pagination pricing-tables_{$blockkey}"></div>
  1498. {else}
  1499. <div class="swiper-button-prev pricing-tables_{$blockkey}_prev">
  1500. <span class="btn_icon_large"><i class="far fa-long-arrow-left"></i></span>
  1501. </div>
  1502. <div class="swiper-button-next pricing-tables_{$blockkey}_next">
  1503. <span class="btn_icon_large"><i class="far fa-long-arrow-right"></i></span>
  1504. </div>
  1505. {/if}
  1506. {/if}
  1507. </div>
  1508. </div>
  1509. </div>
  1510. </div>
  1511. <script>
  1512. jQuery(document).ready(function () {
  1513. {if !$block.DisplayInGrid}
  1514. var swiper = new Swiper('#pricing-tables-{$blockkey}', {
  1515. slidesPerView: 1,
  1516. preventClicks: true,
  1517. slideClass: 'products-slide',
  1518. {if !$block.slidertype}
  1519. pagination: {
  1520. el: '.swiper-pagination.pricing-tables_{$blockkey}',
  1521. clickable: true,
  1522. },
  1523. {else}
  1524. navigation: {
  1525. nextEl: '.pricing-tables_{$blockkey}_next',
  1526. prevEl: '.pricing-tables_{$blockkey}_prev',
  1527. },
  1528. {/if}
  1529. breakpoints: {
  1530. 0: {
  1531. slidesPerView: 1
  1532. },
  1533. 768: {
  1534. slidesPerView: 2
  1535. },
  1536. 992: {
  1537. slidesPerView:{if $block.itemcounts == "2"} 2{else} 3{/if}
  1538. },
  1539. 1200: {
  1540. slidesPerView:{if $block.itemcounts == ""} 3{else} {$block.itemcounts}{/if}
  1541. },
  1542. }
  1543. });
  1544. {/if}
  1545. {if $block.SbSwitcher && !$block.DisableSwitcher}
  1546. jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
  1547. var selText = jQuery(this).html();
  1548. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
  1549. });
  1550. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
  1551. var newCycle = jQuery(this).data('cycle');
  1552. var disBtnBilCycle = jQuery(this).data('cycle');
  1553. jQuery('.pricing-{$blockkey} .product_pricing .pricing_main').hide();
  1554. jQuery('.pricing-{$blockkey} .' + newCycle).show();
  1555. jQuery(this).addClass('active').siblings().removeClass('active');
  1556. jQuery('.pricing-{$blockkey} .cros-pricing-table').each(function(index) {
  1557. var btnOrder = jQuery(this).find('.btn-order-link');
  1558. if (btnOrder.length) {
  1559. var disBtnUrlFetch = btnOrder.attr('href');
  1560. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  1561. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv) + '&billingcycle=' + disBtnBilCycle;
  1562. btnOrder.attr('href', disBtnUrlFinal);
  1563. }
  1564. if (jQuery(this).find('.' + newCycle).length <= 0) {
  1565. jQuery(this).find('.pricing_main_default').show();
  1566. btnOrder.addClass('disabled');
  1567. } else {
  1568. jQuery(this).find('.pricing_main_default').hide();
  1569. btnOrder.removeClass('disabled');
  1570. }
  1571. });
  1572. });
  1573. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');
  1574. {else}
  1575. {if !$block.DisableSwitcher}
  1576. jQuery(".pricing-{$blockkey} .dropdown-menu li").click(function(){
  1577. var selText = jQuery(this).html();
  1578. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
  1579. });
  1580. jQuery('.pricing-{$blockkey} .billinging_wrapr').click(function(){
  1581. var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  1582. var btnOrder = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-order-link');
  1583. if (btnOrder.length) {
  1584. var disBtnUrlFetch = btnOrder.attr('href');
  1585. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  1586. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv) + '&billingcycle=' + disBtnBilCycle;
  1587. btnOrder.attr('href', disBtnUrlFinal);
  1588. }
  1589. var crosPricingTable = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table');
  1590. crosPricingTable.find('.pricing_main').each(function() {
  1591. var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  1592. if (currentBilCycle === disBtnBilCycle) {
  1593. jQuery(this).removeClass('w-hidden');
  1594. } else {
  1595. jQuery(this).addClass('w-hidden');
  1596. }
  1597. });
  1598. });
  1599. {/if}
  1600. {/if}
  1601. });
  1602. </script>
  1603. {/if}
  1604. {/if}