W tym artykule dowiesz się jak zmodyfikować szablon Agat, aby przekształcić obsługę kanałów w zgodach marketingowych na bardziej czytelną. Wyrażanie zgody w przypadku istnienia wielu kanałów będzie wyglądało następująco:
W pierwszej kolejności dodaj odpowiednie tłumaczenia.
- Id: Consents_InTheFormOf, Tekst: w postaci
W katalogu js znajdź plik init.js. Narzędziem wyszukiwania wyszukaj frazę self.uicheckIfParentChecked. Znaleziona linia znajduje się w obszarze 6 linii kodu (widoczne poniżej), które należy usunąć.
0 1 2 3 4 5 6 7 |
$('body').on('click', '.channel-checkbox', function (e) { self.uicheckIfParentChecked(e); }); $('body').on('click', '.multiple-choice .input-group > label .switch-input[name=tos]', function (e) { self.uicheckIfTosChannelChecked(e); }); |
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
{% assign channelsSize = tos.Channels | Size -%} {% if channelsSize == 0 -%} <div class="input-group switches"> {% if tos.Statement %} <p class="multiple-switch">{% if tos.Required -%}* {% endif -%}{{ tos.Text }}</p> {% else %} {% assign clickableTOSExsits = true -%} <label class="switch"> <span class="switch-name summary-tos-switch-name">{% if tos.Required -%}* {% endif -%}{{ tos.Text }}</span> <input class="switch-input" type="checkbox" name="tos" value="{{ tos.Id }}" {% if tos.Required -%} data-required="req" {% endif -%} /> <span class="switch-label"></span> <span class="switch-handle"></span> </label> {% endif -%} </div> {% elsif channelsSize > 0 -%} <div class="input-group switches"> {% assign onlyEmail = false -%} {% if channelsSize == 1 and tos.Channels[0].Type == 1 -%} {% assign onlyEmail = true -%} {% endif -%} {% if onlyEmail == false -%} <span class="channel-warning tos-warning"><span class="fa fa-exclamation-triangle"></span>{{translations.ChannelWarning}}</span> {% endif -%} {% for chn in tos.Channels -%} <label class="switch channel-switch"> <span class="switch-name">{{tos.Text | Remove: '.'}} {{translations.Consents_InTheFormOf}} {{chn.Name}}</span> <input class="switch-input" type="checkbox" name="tos" value="{{ tos.Id }}" {% if tos.Required -%} data-required="req" {% endif -%} /> {% if onlyEmail == false -%} <input class="switch-input channel-checkbox" type="checkbox" name="channelKey" value="{{ chn.Key }}" {% if tos.Required -%} data-required="req" {% endif -%} /> {% else -%} <input type="hidden" name="channelKey" value="{{ chn.Key }}" checked /> <input class="switch-input" type="checkbox" checked /> {% endif -%} <span class="switch-label"></span> <span class="switch-handle"></span> </label> {% endfor -%} {% endif -%} </div> {% endfor -%} </div> {% if clickableTOSExists -%} |
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 |
{% assign channelsSize = tos.Channels | Size -%} {% if channelsSize == 0 -%} <li class="{% if tos.Required -%} required-consent{% endif -%}"> <div class="input-group switches"> {% if tos.Statement %} <p class="multiple-switch">{% if tos.Required -%}* {% endif -%}{{ tos.Text }}</p> {% else %} <span class="main-consent-warning tos-warning"><span class="fa fa-exclamation-triangle"></span>{{translations.MainConsentWarning}}</span> <label class="switch"> <span class="switch-name summary-tos-switch-name">{% if tos.Required -%}* {% endif -%}{{ tos.Text }}</span> <input aria-label="tos" class="switch-input" type="checkbox" name="tos" value="{{ tos.Id }}" {% if tos.Required -%} data-required="req" {% endif -%} /> <span class="switch-label"></span> <span class="switch-handle"></span> </label> {% endif -%} </div> </li> {% elsif channelsSize > 0 -%} <li class="multiple-choice {% if tos.Required -%} required-consent{% endif -%}"> <div class="input-group switches"> {% assign onlyEmail = false -%} {% if channelsSize == 1 and tos.Channels[0].Type == 1 -%} {% assign onlyEmail = true -%} {% endif -%} {% if onlyEmail == false -%} <span class="channel-warning tos-warning"><span class="fa fa-exclamation-triangle"></span>{{translations.ChannelWarning}}</span> {% endif -%} {% for chn in tos.Channels -%} <label class="switch channel-switch "> <span class="switch-name">{{tos.Text | ToString | Remove: '.'}} {{translations.Consents_InTheFormOf}} {{chn.Name}}</span> <input aria-label="tos" class="switch-input" type="hidden" name="tos" value="{{ tos.Id }}" {% if tos.Required -%} data-required="req" {% endif -%} disabled /> {% if onlyEmail == false -%} <input aria-label="channelKey" class="switch-input channel-checkbox" type="checkbox" name="channelKey" value="{{ chn.Key }}" {% if tos.Required -%} data-required="req" {% endif -%} /> {% else -%} <input aria-label="channelKey" type="hidden" name="channelKey" value="{{ chn.Key }}" /> <input aria-label="channelKey" class="switch-input channel-checkbox" type="checkbox" /> {% endif -%} <span class="switch-label"></span> <span class="switch-handle"></span> </label> {% endfor -%} </div> </li> {% endif -%} {% endfor -%} </ul> <div class="input-group required-fields-info"> |
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 |
{% assign channelsSize = tos.Channels | Size -%} {% if channelsSize == 0 -%} <li class="{% if tos.Required -%} required-consent{% endif -%}"> <div class="input-group switches"> {% if tos.Statement %} <p class="multiple-switch">{% if tos.Required -%}* {% endif -%}{{ tos.Text }}</p> {% else %} <span class="main-consent-warning tos-warning"><span class="fa fa-exclamation-triangle"></span>{{translations.MainConsentWarning}}</span> <label class="switch"> <span class="switch-name summary-tos-switch-name">{% if tos.Required -%}* {% endif -%}{{ tos.Text }}</span> <input aria-label="tos" class="switch-input" type="checkbox" name="tos" value="{{ tos.Id }}" {% if tos.Required -%} data-required="req" {% endif -%} /> <span class="switch-label"></span> <span class="switch-handle"></span> </label> {% endif -%} </div> </li> {% elsif channelsSize > 0 -%} <li class="multiple-choice {% if tos.Required -%} required-consent{% endif -%}"> <div class="input-group switches"> {% if tos.Statement %} <p class="multiple-switch">{% if tos.Required -%}* {% endif -%}{{ tos.Text }}</p> {% endif -%} {% assign onlyEmail = false -%} {% if channelsSize == 1 and tos.Channels[0].Type == 1 -%} {% assign onlyEmail = true -%} {% endif -%} {% if onlyEmail == false -%} <span class="channel-warning tos-warning"><span class="fa fa-exclamation-triangle"></span>{{translations.ChannelWarning}}</span> {% endif -%} {% for chn in tos.Channels -%} <label class="switch channel-switch "> <span class="switch-name">{{tos.Text | ToString | Remove: '.'}} {{translations.Consents_InTheFormOf}} {{chn.Name}}</span> <input aria-label="tos" class="switch-input" type="hidden" name="tos" value="{{ tos.Id }}" {% if tos.Required -%} data-required="req" {% endif -%} disabled /> {% if onlyEmail == false -%} <input aria-label="cnannelKey" class="switch-input channel-checkbox" type="checkbox" name="channelKey" value="{{ chn.Key }}" {% if tos.Required -%} data-required="req" {% endif -%} /> {% else -%} <input aria-label="channelKey" type="hidden" name="channelKey" value="{{ chn.Key }}" /> <input aria-label="channelKey" class="switch-input channel-checkbox" type="checkbox" /> {% endif -%} <span class="switch-label"></span> <span class="switch-handle"></span> </label> {% endfor -%} </div> </li> {% endif -%} {% endfor -%} </ul> <div class="input-group required-fields-info"> |
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 |
<ul> {% for tos in config.TOS.Consents.Registration -%} {% assign channelsSize = tos.Channels | Size -%} {% if channelsSize == 0 -%} <li class="{% if tos.Required -%} required-consent{% endif -%}"> <div class="input-group switches"> {% if tos.Statement %} <p class="multiple-switch">{% if tos.Required -%}* {% endif -%}{{ tos.Text }}</p> {% else %} <span class="main-consent-warning tos-warning"><span class="fa fa-exclamation-triangle"></span>{{translations.MainConsentWarning}}</span> <label class="switch"> <span class="switch-name summary-tos-switch-name">{% if tos.Required -%}* {% endif -%}{{ tos.Text }}</span> <input aria-label="tos" class="switch-input" type="checkbox" name="tos" value="{{ tos.Id }}" {% if tos.Required -%} data-required="req" {% endif -%}/> <span class="switch-label"></span> <span class="switch-handle"></span> </label> {% endif -%} </div> </li> {% elsif channelsSize > 0 -%} <li class="multiple-choice {% if tos.Required -%} required-consent{% endif -%}"> <div class="input-group switches"> {% assign onlyEmail = false -%} {% if channelsSize == 1 and tos.Channels[0].Type == 1 -%} {% assign onlyEmail = true -%} {% endif -%} {% if onlyEmail == false -%} <span class="channel-warning tos-warning"><span class="fa fa-exclamation-triangle"></span>{{translations.ChannelWarning}}</span> {% endif -%} {% for chn in tos.Channels -%} <label class="switch channel-switch"> <span class="switch-name">{{tos.Text | ToString | Remove: '.'}} {{translations.Consents_InTheFormOf}} {{chn.Name}}</span> <input aria-label="tos" class="switch-input" type="hidden" name="tos" value="{{ tos.Id }}" {% if tos.Required -%} data-required="req" {% endif -%} disabled/> {% if onlyEmail == false -%} <input aria-label="channelKey" class="switch-input channel-checkbox" type="checkbox" name="channelKey" value="{{ chn.Key }}" {% if tos.Required -%} data-required="req" {% endif -%} /> {% else -%} <input aria-label="channelKey" type="hidden" name="channelKey" value="{{ chn.Key }}"/> <input aria-label="channelKey" class="switch-input channel-checkbox" type="checkbox"/> {% endif -%} <span class="switch-label"></span> <span class="switch-handle"></span> </label> {% endfor -%} </div> </li> {% endif -%} {% endfor -%} </ul> <div class="input-group required-fields-info"> * {{ translations.Com_RequiredFields }} </div> |
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 |
{% assign anythingToAccept = false -%} {% for tos in customerProfile.Consents -%} {% if tos.Checked == false or tos.Updated.Text %} {% assign anythingToAccept = true -%} {% endif -%} {% endfor %} {% include 'partials/common/date-format.html' -%} <div class="all-users-consents"> <h2 class="main-title">{{ translations.UserConsents }}</h2> {% if anythingToAccept == true %} <div class="consents-box"> <span class="box-heading">{{ translations.Com_ToAcceptation }}</span> <ul> {% for tos in customerProfile.Consents %} {% assign channelsSize = tos.Channels | Size -%} {% assign updatedChannelsSize = tos.Updated.Channels | Size -%} {% assign updatedContentsSize = tos.Updated.Contents | Size -%} {% if tos.Checked == false or tos.Updated.Text %} {% if channelsSize == 0 -%} <li class="{% if tos.Updated.Text %} updated-consent {% endif -%}"> {% if tos.Statement -%} <button aria-label="consentAccept" class="consent-accept" data-id="tos" data-key="{{ tos.Id }}">{{ translations.Com_Accept }}</button> <p class="statement-consent">{% if tos.Required -%}* {% endif -%}{{ tos.Text }}</p> {% else -%} {% if tos.Checked == false -%} <button aria-label="consentAccept" class="consent-accept" data-id="tos" data-key="{{ tos.Id }}">{{ translations.Com_Accept }}</button> {% elsif tos.Updated.Text and updatedChannelsSize == 0 -%} <button aria-label="consentAccept" class="consent-accept" data-id="tos" data-key="{{ tos.Id }}">{{ translations.Com_Accept }}</button> <span class="consent-small-heading">{{ translations.NewConsentContent }}:</span> <span class="switch-name">{% if tos.Required -%}* {% endif -%}{{ tos.Updated.Text }}</span> <span class="consent-small-heading old-consent">{{translations.OldConsentContent}}:</span> <span class="switch-name">{% if tos.Required -%}* {% endif -%}{{ tos.Text }}</span> {% endif -%} {% endif -%} </li> {% elsif channelsSize > 0 -%} {% for chn in tos.Channels -%} <li class="{% if tos.Updated.Text %} updated-consent {% endif -%}"> {% if tos.Updated.Text and updatedChannelsSize == 0 -%} <button aria-label="consentAccept" class="consent-accept" data-id="tos" data-key="{{ tos.Id }}">{{ translations.Com_Accept }}</button> <span class="consent-small-heading">{{ translations.NewConsentContent }}:</span> <span class="switch-name">{% if tos.Required -%}* {% endif -%}{{ tos.Updated.Text }}</span> <span class="consent-small-heading old-consent">{{translations.OldConsentContent}}:</span> {% endif -%} <span class="multiple-switch">{% if tos.Required -%}* {% endif -%}{{ tos.Text | Remove:'.' }} {{translations.Consents_InTheFormOf}} {{chn.Name}}</span> {% if chn.Checked %} <button aria-label="consentWithdraw" class="consent-withdraw" data-id="channelKey" data-key="{{ chn.Key }}">{{ translations.Withdraw }}</button> {% else %} <button aria-label="consentAccept" class="consent-accept" data-id="channelKey" data-key="{{ chn.Key }}">{{ translations.Com_Accept }}</button> {% endif -%} </li> {% endfor -%} {% endif -%} {% endif %} {% endfor %} </ul> </div> {% endif -%} <div class="consents-box"> <span class="box-heading">{{ translations.Com_Accepted }}</span> <ul> {% for tos in customerProfile.Consents -%} {% assign channelsSize = tos.Channels | Size -%} {% if tos.Checked %} {% if channelsSize == 0 -%} <li> {% if tos.Required -%} <span class="withdraw-warning"> <span class="fa fa-exclamation-triangle"></span> <span>{{ translations.WithdrawWarning }}</span> </span> {% endif -%} {% if tos.Statement-%} <span class="accept-date">{{translations.AcceptationDate}}: {{tos.Date | Date:dateFormat}}</span> <button aria-label="consentWithdraw" class="consent-withdraw" data-id="tos" data-key="{{ tos.Id }}">{{ translations.Withdraw }}</button> <p class="statement-consent">{% if tos.Required -%}* {% endif -%}{{ tos.Text }}</p> {% else %} {% if tos.Checked %} <span class="accept-date">{{translations.AcceptationDate}}: {{tos.Date | Date:dateFormat}}</span> <button aria-label="consentWithdraw" class="consent-withdraw" data-id="tos" data-key="{{ tos.Id }}">{{ translations.Withdraw }}</button> {% elsif tos.Checked == false %} <button aria-label="consentAccept" class="consent-accept" data-id="tos" data-key="{{ tos.Id }}">{{ translations.Com_Accept }}</button> {% endif -%} <span class="multiple-switch">{% if tos.Required -%}* {% endif -%}{{ tos.Text }}</span> {% endif -%} </li> {% elsif channelsSize > 0 -%} <li> {% for chn in tos.Channels -%} {% if tos.Required -%} <span class="withdraw-warning"> <span class="fa fa-exclamation-triangle"></span> <span>{{ translations.WithdrawWarning }}</span> </span> {% endif -%} <span class="multiple-switch">{% if tos.Required -%}* {% endif -%}{{ tos.Text | Remove:'.' }} {{translations.Consents_InTheFormOf}} {{chn.Name}}</span> {% if chn.Checked %} <span class="accept-date">{{translations.AcceptationDate}}: {{chn.Date | Date:dateFormat}}</span> <button aria-label="consentWithdraw" class="consent-withdraw" data-id="channelKey" data-key="{{ chn.Key }}">{{ translations.Withdraw }}</button> {% else %} <button aria-label="consentAccept" class="consent-accept" data-id="channelKey" data-key="{{ chn.Key }}">{{ translations.Com_Accept }}</button> {% endif -%} {% endfor -%} </li> {% endif -%} {% if updatedChannelsSize > 0 -%} <ul> {% for chn in tos.Updated.Channels -%} <li> {% if tos.Updated.Text -%} <span class="consent-small-heading">{{translations.NewConsentContent}}:</span> <span class="switch-name">{% if tos.Required -%}* {% endif -%}{{ tos.Updated.Text | Remove:'.' }} {{translations.Consents_InTheFormOf}} {{chn.Name}} }}</span> <span class="consent-small-heading old-consent">{{ translations.OldConsentContent }}:</span> {% endif -%} {% if chn.Checked %} <button aria-label="consentWithdraw" class="consent-withdraw" data-id="channelKey" data-key="{{ chn.Key }}">{{ translations.Withdraw }}</button> {% else %} <button aria-label="consentAccept" class="consent-accept" data-id="channelKey" data-key="{{ chn.Key }}">{{ translations.Com_Accept }}</button> {% endif -%} </li> {% endfor -%} </ul> {% endif -%} {% if updatedContentsSize > 0 -%} <ul> {% for contents in tos.Updated.Contents -%} <li> <span>{{ contents.Name }}</span> {{ contents.ContentHtml }} </li> {% endfor -%} </ul> {% endif -%} {% endif -%} {% endfor %} </ul> </div> </div> |