{% extends 'pageTemplateProducts.html.twig' %}{% block content %} {% set productName = product.getName() %}<div class="section"> <div class="main-content flex-col"> <div class="col xs-12 m-5"> {% set galleryItems = product.getGallery() ? product.getGallery().getItems() : null %} {% if(galleryItems|length > 0) %} <div class="product-item-image-wrapper slider slick-slider has-slider"> {% else %} <div class="slider slick-slider"> {% endif %} <div class="product-image-item"> {% set productDetailImage = product.getDetailViewRepresentationNew() |objectFallbackImage %} {% if productDetailImage != null %} {{ productDetailImage.getThumbnail("productImageDetail" ~bundleName).getHtml() |raw }} {% endif %} </div> {% if(product.getGallery) %} {% for gallery in product.getGallery %} {% if gallery != null %} <div class="product-image-item"> {{ gallery.getImage().getThumbnail("productGalleryDetail" ~bundleName).getHtml() |raw }} </div> {% endif %} {% endfor %} {% endif %} </div> </div> <div class="col xs-12 m-7"> <div class="product-info-container text-only"> <div class="product-title-container"> <h1>{{ productName |trademark }}</h1> </div> {% if variants %} <div class="product-variation-container"> <ul class="product-variants"> {% for variant in variants %} <li {% if variant.getId() == product.getId() %} class="active" {% endif %}> {% set detailViewUri = pimcore_url( { "name": variant.getUrlTitle(), "articlenumber": variant.getArticleNumber() }, "shopHandlerProductDetail" ) %} <a href="{{ detailViewUri }}"> <span class="product-variation-size"> {{ variant.getVariantQualifier() }} </span> <span class="product-variation-thumbnail"> {% if variant.getProductImage() is not empty %} <img src="{{ variant.getProductImage().getThumbnail("productDetailImageVariants" ~bundleName) }}" alt="{% if variant.getProductImage().getMetadata() is not empty %}{{ variant.getProductImage().getMetadata().0.data }}{% else %}{{ productName }}{% endif %}"/> {% endif %} </span> </a> </li> {% endfor %} </ul> </div> {% endif %} <div class="product-short-description-container"> <span class="no-padding">{{ product.getTextContentByType("shortTextRepresentation", document) | raw }}</span> </div> <div class="product-price-container"> {% set priceInfo = product.getOSPriceInfo() %} {% set price = product.getOSPrice() %} {% set oldPrice = product.getPriceOld() %} {% set currency = price.getCurrency() %} {% if oldPrice!=0 %} <div class="product-price old"> {{ currency.toCurrency(oldPrice) }} </div> {% endif %} <div class="product-price{% if oldPrice!=0 %} has-old{% endif %}"> {{ price }} </div> </div> {% if product.getDeliverability() == 'unavailable' %} {% else %} <div class="product-action-wrapper"> {% set jsSubmitClass = '' %} {% if enabledWebsiteFeatures is defined and enabledWebsiteFeatures['sidebarCart'] is defined and enabledWebsiteFeatures['sidebarCart'] == true %} {% set jsSubmitClass = 'js-submit-ajax' %} {% endif %} <form method="post" class="{{ jsSubmitClass }}" action="{{ pimcore_url({"action": "add"}, "shopHandlerCart") }}"> <div class="product-action-container"> <div class="product-quantity"> <input type="number" name="quantity" min="1" value="1"/> <input type="hidden" name="article" value="{{ product.getArticleNumber() }}"> </div> <div class="product-action-button"> <button class="button btn-default"> {{ 'Add to Cart'|trans }} </button> </div> </div> {% for message in app.flashes('error') %} {% if message.message %} {% if message.id == product.id %} <div class="error-message inline"> {{ message.message }} </div> {% endif %} {% else %} <div class="error-message inline"> {{ message }} </div> {% endif %} {% endfor %} {% if enabledWebsiteFeatures is defined and enabledWebsiteFeatures['sidebarCart'] is defined and enabledWebsiteFeatures['sidebarCart'] == true %} <div class="error-messages-container error-message" style="display: none;"></div> {% endif %} </form> {% if oldPrice and minimumPrice30DaysAllCountries[country] is defined and minimumPrice30DaysAllCountries[country] %} <div style="margin-bottom: 10px;"> {{ 'minPriceLast30Days' | trans }} {{ currency.toCurrency(minimumPrice30DaysAllCountries[country]) }} </div> {% endif %} </div> {% endif %} <div class="product-additional-information-container"> <div class="product-additional-information-row"> {% if product.getDeliverability() != 'unavailable' %} <div class="product-ability"> {{ product.getDeliverability() |trans }} </div> <div class="delivery-time"> {{ 'Delivery Time' |trans }} {{ product.getDeliverytime() |trans }} </div> {% else %} <div class="product-ability"> {{ product.getDeliverability() |trans }} </div> {% endif %} </div> <div class="product-additional-information-row"> <div> {% set ammount = product.getAmmount() %} {{ 'Capacity:'|trans }} {{ ammount.getValue() }} {{ ammount.getUnit().getAbbreviation() |trans }} {% if showReferencePrice and ammount.getUnit().getAbbreviation() != 'stk' %} {% set pricereference = product.getPriceReferenceNew() %} {% if(pricereference>0) %} ({{ currency.toCurrency(pricereference) }} {% if(pricereference) %} / {% set value = product.getAmmount().getUnit().abbreviation | lower %} {% if value == 'mg' or value == 'g' or value == 'kg' %} kg {% endif %} {% if value == 'ml' or value == 'l' %} l {% endif %} {% if value == 'stk' %} Stk {% endif %} {% endif %}) {% endif %} {% endif %} </div> <div> {% if product.getDeliveryCostHint() != '' %} <a href="{{ 'Shipping link' |trans }}" target="_blank">{{ product.getDeliveryCostHint() }}</a> {% else %} {{ 'incl. VAT,' |trans }} <a href="{{ 'Shipping link' |trans }}" target="_blank">{{ ' plus shipping' |trans }}</a> {% endif %} </div> </div> {% if product.getDeliverability() == 'unavailable' %} <div class="product-additional-information-row"> {% include 'Partials/productStockInformCustomer.html.twig' %} </div> {% endif %} </div> </div> </div> </div> </div> {% if(isProductFood) %} {% include 'Partials/FitsPerfectly.html.twig' %} {% endif %} <div class="section"> <div class="main-content flex-col"> <div class="col xs-12 m-6 l-8"> <div class="text-only"> <div class="text long-description-wrapper"> <h3>{{ 'Produkt' |trans }}</h3> <span class="no-padding">{{ product.getTextContentByType("longTextRepresentation", document) | raw | trademark }}</span> <div class="product-additional-information"> <div class="information-item"> <div> <p>{{ 'SKU:' |trans }}</p> </div> <div> <p>{{ product.getArticleNumber() }}</p> </div> </div> {% if product.getWeight() %} <div class="information-item"> <div>{{ 'Gewicht:' |trans }} </div> <div> <p>{{ product.getWeight()|localizednumber }} kg</p> </div> </div> {% endif %} {% if product.getWidth() and product.getHeight() and product.getDepth() %} <div class="information-item"> <div>{{ 'Maße in cm (B/H/L):' |trans }} </div> <div> <p>{{ product.width|localizednumber }} / {{ product.height|localizednumber }} / {{ product.depth|localizednumber }} </p> </div> </div> {% endif %} </div> </div> </div> </div> <div class="xs-12 m-6 l-4"> {% if isProductFood %} <div class="product-information-wrapper"> <div class="sales-description-wrapper"> {{ product.getSalesDescription() }} </div> <div id="tabber-xyz" class="tabber" data-tab-type="default"> <ul class="tabs resp-tabs-list tab-id"> <li>{{ 'Nährwerte' |trans }}</li> <li>{{ 'Zutaten' |trans }}</li> </ul> <div class="resp-tabs-container tab-id"> <div class="tab-content"> {% include 'Partials/NutritionFactsDefault.html.twig' %} </div> <div class="tab-content"> {% include 'Partials/IngredientsDefault.html.twig' %} </div> </div> </div> </div> {% endif %} </div> </div> </div> {% include 'Partials/ScovilleScale.html.twig' %} {% set relatedProducts = product.getrelatedProducts %} {% if relatedProducts %} {% if relatedProducts|length > 3 %} <div class="section panel has-slider"> {% else %} <div class="section panel"> {% endif %} <div class="main-content flex-col box-align-center related-products-wrapper"> {% include 'Partials/relatedProducts.html.twig' %} </div> </div> {% endif %}{% endblock %}