templates/default/components/organisms/econda-slider/econda-slider.html.twig line 1

Open in your IDE?
  1. {% set categoryId = app.request.get('category').id|default %}
  2. <div class="econda-slider econda-slider--hide {{ class|default }}" data-econda-identifer="{{ econdaContentIdentifier|default(_uid|default) }}">
  3. {% set product = {
  4. 'name': '[[record.name]]',
  5. 'master': {
  6. 'displaySku': '[[record.id]]',
  7. 'links': {
  8. 'webshop': '#[[record.deeplink]]'
  9. }
  10. }
  11. } %}
  12. {% set sliderProducts = [product] %}
  13. {% embed 'components/organisms/product-slider/product-slider.html.twig' with {
  14. 'attributes': {'data-is-econda': 'true'},
  15. }%}
  16. {% block sliderSlides %}
  17. <div class="product-slider__wrapper swiper-wrapper">
  18. <div class="product-slider__slider swiper-slide econda-template" data-imageservice-base-url="{{ imageservice }}">
  19. {% embed 'components/molecules/product-box/product-box.html.twig' with {
  20. 'class': ' product-box--slider',
  21. } %}
  23. {% block productBoxBadges %}
  24. <div class="product-box__badges ">
  25. {% include 'components/atoms/badge/badge.html.twig' with {
  26. 'class': 'badge--new badge--with-background econda-slider__new--hide',
  27. 'content': 'product_badge_new' | trans
  28. } %}
  30. {% include 'components/atoms/badge/badge.html.twig' with {
  31. 'class': 'badge--sale badge--with-background econda-slider__sale--hide',
  32. 'content': 'SALE'
  33. } %}
  34. </div>
  35. {% endblock %}
  37. {% block productBoxImage %}
  38. <div class="product-box__image-box">
  39. {% include 'components/atoms/image/image.html.twig' with {
  40. 'class': 'product-box__image product_ssss',
  41. 'strict': true,
  42. 'lazyload': true
  43. } %}
  44. </div>
  45. {% endblock %}
  46. {% block productBoxTextBadge %}
  47. <div class="product-box__text-badge">
  48. {% include 'components/atoms/badge/badge.html.twig' with {
  49. 'class': 'badge--text econda-slider__bestseller--hide',
  50. 'content': 'bestseller'|trans
  51. } %}
  52. </div>
  53. {% endblock %}
  54. {% block productBoxTitle %}
  55. <div class="product-box__title">
  56. <span>[[record.name]]</span>
  57. </div>
  58. {% endblock %}
  59. {% block productBoxPrices %}
  60. <div class="product-box__price">
  62. <div class="econda-slider__price econda-slider__price--hide">
  64. <span class="econda-slider__action-price--hide econda-slider__action-price" data-layer-price="[[record.price]]" data-layer-currency="{{ 0|currencyCode }}">
  65. [[record.actionPrice]]
  66. </span>
  68. <span class="econda-slider__price--old econda-slider__action-price--hide">
  69. [[record.price]]
  70. </span>
  72. <span class="econda-slider__normal-price--hide">
  73. [[record.price]]
  74. </span>
  76. <span class="econda-slider__price-tax">
  77. {{ app.request.attributes.getBoolean('exclude_vat') ? 'header_vat_excluding'|trans : 'header_vat_including'|trans }}
  78. </span>
  80. </div>
  81. <span class="product-box__price-on-request econda-slider__price-on-request--hide" >{{'price_on_request'|trans}}</span>
  83. {% block productBoxAction %}
  84. <div class="econda-slider__shopping-list-icon--hide">
  85. <a class="js-add-to-shopping-list"
  86. href="#"
  87. aria-label="{{ 'shopping_list_add'|trans }}"
  88. data-product-id="[[record.productId]]"
  89. data-variant-id="[[record.variantId]]"
  90. data-shopping-list-icon=""
  91. data-shopping-list-success-icon="icon--pin-fill" >
  92. <i class="icon icon--pin"></i>
  93. </a>
  94. </div>
  95. {% endblock%}
  96. </div>
  98. {% endblock %}
  100. {% endembed %}
  101. </div>
  102. </div>
  103. {% endblock %}
  104. {% endembed %}
  105. </div>
  108. <script data-cookie-type="econda-slider" type="application/javascript">
  109. window.econda.ready(() => {
  110. if (typeof econdaConfig !== 'undefined') {
  111. econdaConfig.crosssellAccountId = "{{ 'econda_account_id'|trans }}";
  113. let econdaElement = document.querySelector('[data-econda-identifer="{{ econdaContentIdentifier|default(_uid|default) }}"]');
  115. if (econdaElement != null) {
  116. let econdaSlider = econdaElement.querySelector('.product-slider__wrapper');
  117. const widget = new econda.recengine.Widget({
  119. element: econdaSlider,
  120. renderer: {
  121. type: 'function',
  122. rendererFn: window.dataStore.econdaTemplate
  123. },
  124. afterRender: window.dataStore.econdaAfterRender,
  125. id : {{ widgetId|default(1) }},
  126. removeIfEmpty: true,
  127. emptyThreshold: 1,
  128. context: {
  129. {% if econdaProductId is defined %}
  130. {% if econdaProductId is iterable %}
  131. products: [
  132. {% for product in econdaProductId %}
  133. {id: '{{ product.sku }}'+'W' },
  134. {% endfor %}
  135. ],
  136. {% else %}
  137. products: [{id: "{{ econdaProductId }}" }],
  138. {% endif %}
  139. {% endif %}
  140. {% if categoryId is defined and categoryId is not empty %}
  141. categories:{
  142. type: 'productcategory',
  143. id: '{{ categoryId }}'
  144. }
  145. {% endif %}
  146. },
  147. });
  148. widget.econdaElement = econdaElement;
  149. widget.render();
  150. econdaElement.removeAttribute('data-econda-identifer');
  151. }
  152. };
  153. });
  154. </script>