1<#if damFondoDesktop?has_content || damFondoMobile?has_content>
2 <#assign
3 desktop = damFondoDesktop.getData()
4 mobile = damFondoMobile.getData()
5 />
6 <#if desktop != "" || mobile != "">
7 <#if desktop != "" && mobile != "">
8 <style>
9 #<@portlet.namespace/>.d3-header{
10 background-image: url(${mobile});
11 }
12 @media (min-width: 576px){
13 #<@portlet.namespace/>.d3-header{
14 background-image: url(${desktop});
15 }
16 }
17 </style>
18 <#elseif desktop == "" && mobile != "">
19 <style>
20 #<@portlet.namespace/>.d3-header{
21 background-image: url(${mobile});
22 }
23 </style>
24 <#elseif desktop != "" && mobile == "">
25 <style>
26 #<@portlet.namespace/>.d3-header{
27 background-image: url(${desktop});
28 }
29 </style>
30 </#if>
31 </#if>
32</#if>
33<#if MarginBreadcrumb?? && MarginBreadcrumb.getData() != "">
34 <style>
35 @media (min-width: 768px){
36 .d3-header .content{
37 margin-top: ${MarginBreadcrumb.getData()} !important;
38 }
39 }
40 </style>
41</#if>
42<div id="<@portlet.namespace />" class="d3-header container-fluid d-flex flex-column">
43
44
45<#if !OcultarBreadcrumb?? || !getterUtil.getBoolean(OcultarBreadcrumb.getData())>
46
47 <#assign
48 locale = themeDisplay.getLocale()
49 cur_layout = themeDisplay.getLayout()
50 layout_ancestors_reversed = cur_layout.getAncestors()?reverse
51 counter = 0
52 />
53
54 <script type="application/ld+json">
55 {
56 "@context": "https://schema.org",
57 "@type": "BreadcrumbList",
58 "itemListElement": [
59 <#list layout_ancestors_reversed as ancestor>
60 <#assign ancestorItem = ancestor.getFriendlyURL(locale)/>
61 <#if ancestorItem?? && ancestorItem == "/home">
62 <#assign ancestorItem = "/"/>
63 </#if>
64 <#assign counter = counter+1>
65 {
66 "@type": "ListItem",
67 "position": ${counter},
68 "name": "${ancestor.getName(locale)}",
69 "item": "${ancestorItem}"
70 },
71 </#list>
72 {
73 "@type": "ListItem",
74 "position": ${counter+1},
75 "name": "${cur_layout.getName(locale)}",
76 "item": "${cur_layout.getFriendlyURL(locale)}"
77 }
78 ]
79 }
80 </script>
81
82 <div class="breadcrumb-wrapper d-none d-lg-flex">
83 <ul>
84 <#assign idBreadcrumb=random.nextInt()>
85
86 <#list layout_ancestors_reversed as ancestor>
87 <#assign ancestorItem = ancestor.getFriendlyURL(locale)/>
88 <#if ancestorItem?? && ancestorItem == "/home">
89 <#assign ancestorItem = "/"/>
90 </#if>
91 <li><a class="bc_principal${idBreadcrumb}" href="${ancestorItem}">${ancestor.getName(locale)}</a></li><li class="bc_principal${idBreadcrumb}"> > </li>
92 </#list>
93 <#assign bcHex='#FFFFFF'/>
94 <#if color_breadcrumb?? && color_breadcrumb.getData()!="">
95 <#assign bcHex = color_breadcrumb.getData()/>
96 </#if>
97
98 <#if !bcHex?contains('#')>
99 <#assign bcHex = '#'+bcHex/>
100 </#if>
101
102 <li><a class="bc_secondary${idBreadcrumb}" href="${cur_layout.getFriendlyURL(locale)}">${cur_layout.getName(locale)}</a></li>
103 <style>
104 .bc_principal${idBreadcrumb}{
105 color: ${templateUtil.hexToNumber(bcHex,0.4)}!important;
106 }
107 .bc_secondary${idBreadcrumb}{
108 color: ${bcHex}!important;
109 }
110 </style>
111 </ul>
112 </div>
113</#if>
114 <div class="content d-flex flex-column">
115 <#if htmlPreTitulo.getData() != "">
116 <div class="pre-title">${htmlPreTitulo.getData()}</div>
117 </#if>
118
119 <#if htmlTitulo.getData() != "">
120 <div class="title">${htmlTitulo.getData()}</div>
121 </#if>
122
123 <#if htmlDescripcionPrincipal.getData() != "">
124 <div class="description">${htmlDescripcionPrincipal.getData()}</div>
125 </#if>
126
127 <#if CTA.txtEnlace.getData() != "">
128 <div class="cta">
129 <#assign itemId = 'tealium-id' + random.nextInt() >
130 <#assign
131 powlinkDinamicoClass = ""
132 />
133 <#if CTA.PowlinkDinamico?? && getterUtil.getBoolean(CTA.PowlinkDinamico.getData())>
134 <#assign powlinkDinamicoClass = "powlink-dinamico">
135 </#if>
136 <#if (CTA.PopupQR)?? && getterUtil.getBoolean(CTA.PopupQR.getData())>
137 <div class="openPopupQR">
138 <a class="${itemId} d-none d-lg-block alternative btn-${CTA.selTipoEnlace.getData()} btn-color-${CTA.selColor.getData()}">${CTA.txtTexto.getData()}</a>
139 <a id="${itemId}" class="${itemId} d-lg-none d-block alternative btn-${CTA.selTipoEnlace.getData()} btn-color-${CTA.selColor.getData()} ${powlinkDinamicoClass}" href="${CTA.txtEnlace.getData()}" target="${(CTA.chkNuevaVentana.getData() == 'true')?string('_blank', '')}">${CTA.txtTexto.getData()}</a>
140 </div>
141 <#else>
142 <div>
143 <a id="${itemId}" class="${itemId} alternative btn-${CTA.selTipoEnlace.getData()} btn-color-${CTA.selColor.getData()} ${powlinkDinamicoClass}" href="${CTA.txtEnlace.getData()}" target="${(CTA.chkNuevaVentana.getData() == 'true')?string('_blank', '')}">${CTA.txtTexto.getData()}</a>
144 </div>
145 </#if>
146 <#if CTA.txtTealium.getData() != ""><script>$(".${itemId}").on('click', function() {${CTA.txtTealium.getData()}});</script></#if>
147 </div>
148 </#if>
149
150 <#list sepMobileStores.getSiblings()>
151
152 <div class="stores-links d-sm-none">
153
154 <#items as store>
155
156 <div class="store">
157 <#assign itemId = 'tealium-id' + random.nextInt() >
158 <#assign
159 powlinkDinamicoStoreClass = ""
160 />
161 <#if store.PowlinkDinamicoStore?? && getterUtil.getBoolean(store.PowlinkDinamicoStore.getData())>
162 <#assign powlinkDinamicoStoreClass = "powlink-dinamico">
163 </#if>
164 <a id="${itemId}" class="${powlinkDinamicoStoreClass}" href="${store.mobStoreLink.getData()}" target="${(store.mobStoreChkNewWindow.getData() == 'true')?string('_blank', '')}"><img alt="${store.mobStoreImage.getAttribute('alt')!''}" src="${store.mobStoreImage.getData()}"></a>
165 <#if store.mobStoreTealium.getData() != ""><script>$("#${itemId}").on('click', function() {${store.mobStoreTealium.getData()}});</script></#if>
166 </div>
167 </#items>
168
169
170 </div>
171
172 </#list>
173 </div>
174</div>
