Nowy sposób prezentacji rabatów w profilu klienta w szablonie Szafir

Nowy sposób prezentacji rabatów w profilu klienta w szablonie Szafir

W tym artykule dowiesz się, jak zmodyfikować szablon Szafir, aby obsługiwał nowy sposób prezentacji rabatów w profilu klienta.

Wskazówka

Do poprawnego działania potrzebujesz sklepu w wersji 2020.2 lub nowszej!

Wskazówka

Kopiowanie fraz, które należy wyszukać w kodzie, może powodować problemy. Frazy do wyszukania najlepiej przepisać ręcznie, lub skopiować, ale po skopiowaniu podmienić znaki typu – _ ’ „ itp. W przeciwnym wypadku, fraza może nie zostać odnaleziona w kodzie!

Wskazówka

W tym artykule trzeba będzie wprowadzać zmiany w plikach js i css. Z tego artykułu dowiesz się jak je minifikować

1. Otwórz plik common -> navigation-bars -> main-navigation-bar-partial.html. W pliku tym wyszukaj frazę {% if usr.Authenticated == true -%}. Trzy linie poniżej, powinna znajdować się linia zaczynająca się od <a href. Podmień tę linię na następującą:

2. Otwórz plik common -> pagination.html. Wyszukaj linię {% assign tab = 'loyalty’ -%}. Tuż pod nią wklej następujący kod:
   {% elseif page.QueryString contains 'tab=discounts' -%} {% assign pageQueryName = customer-profile.DiscountsERP.PageQueryGET -%} {% assign paginationPageCount = customer-profile.DiscountsERP.PageCount -%} {% assign paginationPageNo = customer-profile.DiscountsERP.PageNo -%} {% assign template = 'customer-profile/discounts/discounts-list.html' -%} {% assign templateContainer = '.discounts-list-lq' -%} {% assign tab = 'discounts' -%} {% elseif page.QueryString contains 'tab=discount-details' -%} {% assign pageQueryName = customer-profile.DiscountDetPageQueryGET -%} {% assign paginationPageCount = customer-profile.DiscountERPDetails.PageCount -%} {% assign paginationPageNo = customer-profile.DiscountERPDetails.PageNo -%} {% assign template = 'customer-profile/discounts/discount-elements.html' -%} {% assign templateContainer = '.discount-elements-lq' -%} {% assign tab = 'discount-details' -%} {% assign id = customer-profile.DiscountERPDetails.Id -%} {% assign discountString = customer-profile.DiscountQueryGET -%}

3. Otwórz katalog customer-profile -> discounts. W nim otwórz plik discounts.html. Usuń jego treść, i wklej następujący kod:

• {{ translations.BackToShopping }}
• {{translations.Promotions}}

{% include 'customer-profile/menu.html' -%}

{{translations.DiscountsInfo}}

{% include 'customer-profile/discounts/discounts-list.html' -%}

4. W tym samym katalogu utwórz plik discount-details.html. Wklej do niego następujący kod:
   {% include 'common/date-format.html' -%} {% assign discount = customer-profile.DiscountERPDetails -%} {% assign pageQueryName = customer-profile.DiscountsERP.PageQueryGET -%} {% assign queries = page.QueryString | Split: '&' -%} {% for query in queries -%} {% if query contains 'page=' -%} {% assign pageQueryNo = query | Split: '=' | Last -%} {% break -%} {% else -%} {% assign pageQueryNo = 1 -%} {% endif -%} {% endfor -%}

• {{ translations.Back }}
• {{ discount.Name }}

{% if discount.Description != '' and discount.Description != null -%}

{{discount.Description}}

{% endif -%}

{% if discount.Thresholds -%}
{% for threshold in discount.Thresholds -%}

{{translations.Threshold}}:
{% if threshold.ThresholdType == 1 -%}
{{threshold.Threshold | ToPrice}} {{threshold.ThresholdSymbol}}
{% else -%}
{{threshold.Threshold}}
{% endif -%}

{{translations.QuantityThreshold}}: {{threshold.ThresholdMinPositionsCount}}

{% include 'customer-profile/discounts/discount-elements.html' with threshold -%}

{% endfor -%}
{% else -%}

{% include 'customer-profile/discounts/discount-elements.html' with discount -%}

{% endif -%}

5. W tym samym katalogu utwórz plik discount-elements.html i wklej do niego następujący kod:
   {% assign discount = customer-profile.DiscountERPDetails -%} {% if include -%} {% assign elementsParent = include -%} {% else -%} {% assign elementsParent = discount -%} {% endif -%}

{% assign anyGroup = false -%}
{% assign anyProduct = false -%}
{% assign anyThreshold = false -%}
{% assign anyBundleThreshold = false -%}
{% assign anyTotalPrice = false -%}
{% assign anySubtotalPrice = false -%}
{% for element in elementsParent.Elements -%}
{% if element.Group != null -%}
{% assign anyGroup = true -%}
{% endif -%}
{% if element.Product != null -%}
{% assign anyProduct = true -%}
{% endif -%}
{% if element.Threshold != null and element.Threshold > 0 -%}
{% assign anyThreshold = true -%}
{% endif -%}
{% if element.BundleThreshold != null and element.BundleThreshold > 0 -%}
{% assign anyBundleThreshold = true -%}
{% endif -%}
{% if element.FixedPrice -%}
{% if element.TotalPrice != null and element.TotalPrice > 0 -%}
{% assign anyTotalPrice = true -%}
{% endif -%}
{% if element.SubtotalPrice != null and element.SubtotalPrice > 0 -%}
{% assign anySubtotalPrice = true -%}
{% endif -%}
{% endif -%}
{% endfor -%}

{% if anyGroup and anyProduct -%}
{{translations.Product}}/{{translations.Category}}
{% elseif anyGroup -%}
{{translations.Category}}
{% else -%}
{{translations.Product}}
{% endif -%}

{% unless element.FixedPrice and anySubtotalPrice == false -%}

{% if element.FixedPrice and anySubtotalPrice -%}
{{translations.Price}} {{translations.Netto | Downcase }}
{% else -%}
{{translations.Discount}}
{% endif -%}

{% endunless -%}
{% if anyThreshold or anyBundleThreshold or anyTotalPrice -%}

{% if element.FixedPrice and anyTotalPrice -%}
{{translations.Price}} {{translations.Brutto | Downcase}}
{% elseif anyBundleThreshold -%}
{{translations.BundleThreshold}}
{% else -%}
{{translations.Threshold}}
{% endif -%}

{% endif -%}

{% for element in elementsParent.Elements -%}

{{ forloop.index }}

{% if element.Group != null -%}
{% if element.Group.Url -%}
{% endif -%}
{{ element.Group.Name }}
{% if element.Group.Url -%}
{% endif -%}
{% else -%}
{% if element.Product.Url -%}
{% endif -%}
{{ element.Product.NameNoHtml }}
{% if element.Product.Url -%}
{% endif -%}
{% endif -%}

{% unless element.FixedPrice and anySubtotalPrice == false -%}

{% if element.FixedPrice -%}
{% if element.SubtotalPrice > 0 -%}
{{ translations.Price | Downcase }} {{ translations.Netto | Downcase }}
{% endif -%}
{% else -%}
{{ translations.Discount | Downcase }}
{% endif -%}

{% if element.FixedPrice -%}
{% if element.SubtotalPrice > 0 -%}
{{ element.SubtotalPrice | ToPrice }}
{% endif -%}
{% else -%}
{% if element.Type == 1 or element.Type == 3 or element.Type == 9 -%}
{{ element.Value | ToPrice }}
{% else -%}
{{ element.Value | Normalize }}
{% endif -%}
{% endif -%}
{{ element.ValueSymbol }}

{% endunless -%}
{% if anyThreshold or anyBundleThreshold or anyTotalPrice -%}

{% if element.FixedPrice -%}
{% if element.TotalPrice > 0 -%}
{{ translations.Price | Downcase }} {{ translations.Brutto | Downcase }}
{% endif -%}
{% elseif element.BundleThreshold > 0 -%}
{{ translations.BundleThreshold | Downcase }}
{% elseif element.Threshold > 0 -%}
{{ translations.Threshold | Downcase }}
{% endif -%}

{% if element.FixedPrice -%}
{% if element.TotalPrice > 0 -%}
{{ element.TotalPrice | ToPrice }}
{% endif -%}
{{ element.ValueSymbol }}
{% elseif element.BundleThreshold > 0 -%}
{% if element.Type == 1 or element.Type == 3 or element.Type == 9 -%}
{{ element.BundleThreshold | ToPrice }}
{% else -%}
{{ element.BundleThreshold | Normalize }}
{% endif -%}
{{ element.BundleThresholdSymbol }}
{% elseif element.Threshold > 0 -%}
{% if element.Type == 1 or element.Type == 3 or element.Type == 9 -%}
{{ element.Threshold | ToPrice }}
{% else -%}
{{ element.Threshold | Normalize }}
{% endif -%}
{{ element.ThresholdSymbol }}
{% endif -%}

{% endif -%}

{% endfor -%}

{% assign paginationPageCount = discount.PageCount -%}
{% if paginationPageCount > 1 -%}

{% include 'common/pagination.html' -%}

{% endif -%}

6. W tym samym katalogu utwórz plik discounts-list.html i wklej do niego następujący kod:
   {% include 'common/date-format.html' -%}

{% assign discountsERP = customer-profile.DiscountsERP -%}
{% assign discountString = customer-profile.DiscountQueryGET | H -%}
{% assign paginationPageNo = discountsERP.PageNo -%}

{% if paginationPageNo == 1 -%}
{% assign orderValuesSize = customer-profile.DiscountsEshop.OrderValue | Size -%}
{% if orderValuesSize > 0 -%}
{% assign anyDiscount = true -%}
{% for orderValue in customer-profile.DiscountsEshop.OrderValue -%}

{{ orderValue.Discount | Normalize }} %

{{ orderValue.ValueFrom }} {{ customer.Currency }} - {{ orderValue.ValueTo }} {{ customer.Currency }}

{% if orderValue.DateTill -%}
{{ translations.ValidTo | Downcase }}: {{ orderValue.DateTill | Date:dateFormat }}
{% else -%}
{{ translations.ValidLifetime | Downcase }}
{% endif -%}

{% endfor -%}
{% endif -%}
{% if customer-profile.DiscountsEshop.Regular -%}
{% assign anyDiscount = true -%}
{% assign regular = customer-profile.DiscountsEshop.Regular -%}

{{ regular.Discount | Normalize }} %

{{ translations.ForRegularCustomer }}

{% if regular.DateTill -%}
{{ translations.ValidTo | Downcase }}: {{ regular.DateTill | Date:dateFormat }}
{% else -%}
{{ translations.ValidLifetime | Downcase }}
{% endif -%}

{% endif -%}
{% if customer-profile.DiscountsEshop.FirstOrder -%}
{% assign anyDiscount = true -%}
{% assign firstOrder = customer-profile.DiscountsEshop.FirstOrder -%}

{{ firstOrder.Discount | Normalize }} %

{{ translations.ForNewCustomer }}

{% if firstOrder.DateTill -%}
{{ translations.ValidTo | Downcase }}: {{ firstOrder.DateTill | Date:dateFormat }}
{% else -%}
{{ translations.ValidLifetime | Downcase }}
{% endif -%}

{% endif -%}
{% endif -%}
{% if discountsERP.TotalItems > 0 -%}
{% assign anyDiscount = true -%}
{% for discount in discountsERP.Discounts -%}

{{ translations.Details }}

{{ discount.Name }}

{% if discount.DateTill -%}
{% if discount.DateFrom -%}

{{ translations.ValidFrom | Downcase }}: {{ discount.DateTill | Date:dateFormat }}

{% endif -%}
{{ translations.ValidTo | Downcase }}: {{ discount.DateTill | Date:dateFormat }}
{% else -%}
{{ translations.ValidLifetime | Downcase }}
{% endif -%}

{% endfor -%}
{% include 'common/pagination.html' -%}
{% endif -%}
{% unless anyDiscount -%}
{{ translations.NoDicountsInfo }}
{% endunless -%}

7. Następnie przejdź do katalogu customer-profile. Otwórz plik menu.html. Wyszukaj linię
   . Linia pod spodem zaczyna się od <li class=”load-erp-data-lq. Podmień ją na następującą:

• W tym samym pliku wyszukaj frazę {% if settings.discountsPresentationInCustomerProfileInPromotionsTab == 'yes’ %}. Linia pod spodem zaczyna się od <li class=”discounts-menu-button-lq”. Podmień ją na następującą:
• 8. Otwórz katalog js a w nim plik init-ui2.js. Wyszukaj linię function setProductNameMaxWidthInTable() {. Należy podmienić całą funkcję (od znalezionej linii włącznie, do linii o treści }; znajdującej się ok. 70 linii poniżej – 2 linie przed tą znajduje się linia $(’.products-table-header-container-lq .name-and-code-lq’).css(’width’, nameWidth);):
     function setProductNameMaxWidthInTable() { if($(window).width() > 1279) { function calculateProductNameMaxWidthInTable(parent) { if(parent){ var header = parent.find('.products-table-header-container-lq'); } else { var header = $('.products-table-header-container-lq'); }

var headerWidth = header.width();
var nameWidth = headerWidth;

function calculateNameWidth(className) {
var elements = header.find(className);
var size = elements.length;
if (size == 1) {
nameWidth -= elements.outerWidth();
} else if (size > 1) {
elements.each(function () {
nameWidth -= $(this).outerWidth();
});
}
}

calculateNameWidth('.remove-product-lq');
calculateNameWidth('.open-complaint-form-container-lq');
calculateNameWidth('.price-like-column-lq');
calculateNameWidth('.percent-column-lq');
calculateNameWidth('.amount-stepper-column-lq');
calculateNameWidth('.currency-column-lq');
calculateNameWidth('.options-column-lq');
calculateNameWidth('.number-column-lq');

if ($('.attributes-view-lq').index() != -1) {
var freeSpaceWidth = headerWidth;

function calculateFreeSpaceWidth(className) {
var elements = header.find(className);
var size = elements.length;
if(className == '.attributes-view-lq' && size > 5){
size = 5;
}
if (size == 1) {
freeSpaceWidth -= elements.outerWidth();
} else if (size > 1) {
elements.each(function (i) {
if(i < size){ freeSpaceWidth -= $(this).outerWidth(); } else { return false; } }); } } calculateFreeSpaceWidth('.remove-product-lq'); calculateFreeSpaceWidth('.open-complaint-form-container-lq'); calculateFreeSpaceWidth('.attributes-view-lq'); calculateFreeSpaceWidth('.arrow-lq'); calculateFreeSpaceWidth('.options-column-lq'); calculateFreeSpaceWidth('.name-column-lq'); if (nameWidth > freeSpaceWidth) {
var difference = nameWidth - freeSpaceWidth;
var amountStepperWidth = $('.amount-stepper-column-lq').outerWidth() + difference;
$('.amount-stepper-column-ui').css('width', amountStepperWidth);
nameWidth = freeSpaceWidth;
}
}

if(parent){
parent.find('.name-and-code-lq').css('width', nameWidth);
} else {
$('.name-and-code-lq').css('width', nameWidth);
}

if ($('.choose-cart-table-view-lq').index() != -1) {
nameWidth -= $('.choose-cart-table-view-lq').width();
}

if(parent){
parent.find('.products-table-header-container-lq .name-and-code-lq').css('width', nameWidth);
} else {
$('.products-table-header-container-lq .name-and-code-lq').css('width', nameWidth);
}
};

if($('.discount-elements-table-lq').index() != -1){
$('.discount-elements-table-lq').each(function(){
calculateProductNameMaxWidthInTable($(this));
});
} else {
calculateProductNameMaxWidthInTable()
}
}
};

9. Otwórz plik scss -> globals -> _globals-m.scss. Wyszukaj frazę .position-attributes-set-form-lq{. Poniżej znajdują się dwie linie o treści }. Tuż pod nimi wklej poniższy kod:
   &.discount-element-ui{ height: 100px; .name-and-code-lq{ margin-top: 4px; } .price-like-column-ui{ left: 60px; text-align: left; .prices-ui{ left: 0; } } .value-ui{ position: absolute; left: 40px; font-size: 10px; top: 2px; } }

W tym samym katalogu otwórz plik _globals2.scss. Wyszukaj linię // Discounts in customer-profile. Poniżej znajduje się linia .discount-item-ui{. Tuż pod nią wklej poniższą linijkę:
height: 72px;

Poniżej znajduje się linia .discount-value-ui{. Klika linii poniżej znajdziesz linię o treści vertical-align: middle;. Słowo middle zamień na top.

Kolejne kilka linii poniżej znajduje się linia o treści .currency-ui{. Tuż nad nią wklej ten kod:
&.clickable-ui{ cursor: pointer; }

10. Otwórz Panel administracyjny, a w nim zakładkę Wygląd sklepu -> Ustawienia -> Tłumaczenia. Nowe tłumaczenia dodaj poprzez kliknięcie przycisku Dodaj, wprowadzenie Id, Tekstu i zatwierdzenie przyciskiem Dodaj. Należy dodać następujące tłumaczenia (Id – Tekst):
11. Threshold – Próg
12. QuantityThreshold – Próg ilościowy
13. BundleThreshold – Próg pakietowy

Wskazówka

Kopiując Id tłumaczeń upewnij się, że przed lub za danym Id nie znajduje się żadna spacja, inaczej tłumaczenie może nie zadziałać w sposób poprawny!

Wskazówka

Pamiętaj, aby po wprowadzeniu zmian w plikach scss i js, wykonać odpowiednie komendy opisane w artykule o minifikacji, do którego link znajduje się na samej górze niniejszego artykułu. Przed wykonaniem odpowiedniej komendy dla plików js, usuń z katalogu js pliki: init-ui1.min.js, collection-points.min.js, init-ui2.min.js, init.min.js, sw.min.js. Po wykonaniu komendy możesz usunąć plik slick.min.min.js.

### Czy ten artykuł był pomocny?

( 0 )

( 1 )

Wyślij opinie

## Inne w kategorii

• Wyszukiwarka zaawansowana w szablonie Topaz

  • -1
  • 2099

  • Ustawienia paska nawigacji w szablonie Szafir

  • 1

  • 2273

  • Aktualizacja filtrów i wyszukiwarki w szablonach

  • -1

  • 2669

  • Dodanie nowego widoku filtrów

  • -26

  • 1636

  • Zmiana nagłówka sekcji polecanych towarów na przykładzie szablonu Topaz

  • 0

  • 2880

  • Szablon i treści wiadomości e-mail

  • 0

  • 3135

Społeczność Comarch

Dzięki społeczności Comarch ERP rozwiązujemy problemy, dzielimy się pomysłami oraz informujemy o nowościach.

Dołącz do Społeczności Comarch

Oferta e-Commerce

Demo Comarch e-Sklep
Zamów Comarch e-Sklep
Cennik Comarch e-Sklep
Comarch e-Sale
Comarch B2B
Czym się różni Comarch
e-Sklep B2B od Comarch B2B?

Przydatne linki

Spis treści
Stwórz darmowy szablon
Konfigurator produktu
Więcej o Comarch ERP
Pomoc Comarch Betterfly
Pomoc Comarch ERP Optima
Pomoc Comarch ERP XL
Pomoc Comarch ERP Altum
Oprogramowanie e-commerce
Sztuczna Inteligencja (AI)

Kontakt

Skontaktuj się z nami
Partnerzy Comarch wdrażający e-Sklep