appscms-tools-theme 3.8.2 → 3.8.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,94 +1,42 @@
1
1
  {% assign file = page.fileName %} {% assign lang = page.lang %} {% assign folder
2
- = page.folderName %} {% assign featureData= site.data[folder][lang][file] %}
3
- <!DOCTYPE html>
4
- <html lang="{{page.lang}}">
5
- {% include head/index.html %}
6
-
7
- <body>
8
- {% include header/index.html %} {%- if site.safeui -%}
9
- <div
10
- class="alert alert-{{featureData.variant | default: 'info'}} fade show text-center"
11
- role="alert"
12
- id="safeui-alert"
13
- >
14
- <div class="container">
15
- {%- if featureData.alertmsg -%} {{featureData.alertmsg}} {%- else -%} We
16
- do not upload any files to server, hence your data is 100% secure. {%-
17
- endif -%}
18
- </div>
2
+ = page.folderName %} {% assign featureData= site.data[folder][lang][file] %}
3
+ <!DOCTYPE html>
4
+ <html lang="{{page.lang}}">
5
+ {% include head/index.html %}
6
+
7
+ <body>
8
+ {% include header/index.html %} {%- if site.safeui -%}
9
+ <div
10
+ class="alert alert-{{featureData.variant | default: 'info'}} fade show text-center"
11
+ role="alert"
12
+ id="safeui-alert"
13
+ >
14
+ <div class="container">
15
+ {%- if featureData.alertmsg -%} {{featureData.alertmsg}} {%- else -%} We
16
+ do not upload any files to server, hence your data is 100% secure. {%-
17
+ endif -%}
19
18
  </div>
20
- {%- endif -%} {%- if page.layout != "frame" and page.layout !=
21
- "photo-effects-home" and page.layout != "video" and page.layout != "audio"
22
- -%} {%- if site.newFeatureBox -%}
23
- <div class="appscms-sidebar-left"></div>
24
- <div class="appscms-sidebar-right"></div>
25
- {%- endif -%}
26
-
27
- <div class="flex-container pb-3">
28
- <div class="flex-class py-4 mt-4 mt-md-0">
29
- <div
30
- id="h1-img-wrapper"
31
- class="d-flex justify-content-center align-items-center"
32
- >
33
- <span id="h1-img" class="fHhdVc">
34
- <div class="div-cont feature-img mr-2">
35
- {%- if featureData.img -%}
36
- <img
37
- style="width:{{featureData.imgwidth}};height:{{featureData.imgheight}};"
38
- src="{{featureData.img}}"
39
- alt="{{featureData.imgalt}}"
40
- {%-
41
- if
42
- site.crossorigin
43
- -%}
44
- crossorigin
45
- {%-
46
- endif
47
- -%}
48
- />
49
- {%- else -%}
50
- <svg
51
- xmlns="http://www.w3.org/2000/svg"
52
- xmlns:xlink="http://www.w3.org/1999/xlink"
53
- viewBox="0 0 36 36"
54
- fill="#000"
55
- >
56
- <path
57
- d="M6,6 L9,18 L6,30 L18,27 L30,30 L27,18 L30,6 L18,9 L6,6 Z M3,3 L18,6.75 L33,3 L29.25,18 L33,33 L18,29.25 L3,33 L6.75,18 L3,3 Z"
58
- ></path>
59
- </svg>
60
- {%- endif -%}
61
- </div>
62
- </span>
63
- {%- assign featureh1 = featureData.H1 | replace: "$variable",
64
- page.value -%}
65
- <h1 id="feature-h1" class="feature-h1">
66
- {%- for word in featureh1-%} {%- if forloop.first == true -%} {{word
67
- | capitalize }} {%- else -%} {{word}} {%- endif -%} {%- endfor -%}
68
- </h1>
69
- </div>
70
- {%- assign featureh2 = featureData.H2 | replace: "$variable", page.value
71
- -%}
72
- <h2 id="feature-h2" class="feature-h2">
73
- {%- for word in featureh2 -%} {%- if forloop.first == true -%} {{word
74
- | capitalize }} {%- else -%} {{word}} {%- endif -%} {%- endfor -%}
75
- </h2>
76
- </div>
77
- </div>
78
-
79
- {%- endif -%} {%- if site.noFeatureBox == true -%}
80
- <div class="feature-content-box" id="theme-content-box">{{content}}</div>
81
- {%- elsif site.newFeatureBox and page.newBox -%}
82
- <div class="feature-content-box" id="theme-content-box">
83
- <div class="container">
84
- {%- assign boxColor =
85
- site.data[page.folderName][page.lang][page.fileName].color -%} {%- if
86
- page.removeBox != true -%}
87
- <div class="custom-box" data-color="{{boxColor}}">
88
- <div style="display: none" id="file-loader">
19
+ </div>
20
+ {%- endif -%} {%- if page.layout != "frame" and page.layout !=
21
+ "photo-effects-home" and page.layout != "video" and page.layout != "audio"
22
+ -%} {%- if site.newFeatureBox -%}
23
+ <div class="appscms-sidebar-left"></div>
24
+ <div class="appscms-sidebar-right"></div>
25
+ {%- endif -%}
26
+
27
+ <div class="flex-container pb-3">
28
+ <div class="flex-class py-4 mt-4 mt-md-0">
29
+ <div
30
+ id="h1-img-wrapper"
31
+ class="d-flex justify-content-center align-items-center"
32
+ >
33
+ <span id="h1-img" class="fHhdVc">
34
+ <div class="div-cont feature-img mr-2">
35
+ {%- if featureData.img -%}
89
36
  <img
90
- src="/spinner.gif"
91
- alt="spinner"
37
+ style="width:{{featureData.imgwidth}};height:{{featureData.imgheight}};"
38
+ src="{{featureData.img}}"
39
+ alt="{{featureData.imgalt}}"
92
40
  {%-
93
41
  if
94
42
  site.crossorigin
@@ -98,158 +46,288 @@
98
46
  endif
99
47
  -%}
100
48
  />
101
- <p>Please Wait ,Loading Your file</p>
102
- </div>
103
- <div class="saving-file-download-wrap" style="display: none">
104
- <img
105
- loading="lazy"
106
- class="trust-img"
107
- src="/trust.svg"
108
- alt="trust"
109
- {%-
110
- if
111
- site.crossorigin
112
- -%}
113
- crossorigin
114
- {%-
115
- endif
116
- -%}
117
- />
118
- <p class="text-white my-2">Thanks for your patience</p>
119
- <button class="btn" id="download-zip">Download</button>
49
+ {%- else -%}
50
+ <svg
51
+ xmlns="http://www.w3.org/2000/svg"
52
+ xmlns:xlink="http://www.w3.org/1999/xlink"
53
+ viewBox="0 0 36 36"
54
+ fill="#000"
55
+ >
56
+ <path
57
+ d="M6,6 L9,18 L6,30 L18,27 L30,30 L27,18 L30,6 L18,9 L6,6 Z M3,3 L18,6.75 L33,3 L29.25,18 L33,33 L18,29.25 L3,33 L6.75,18 L3,3 Z"
58
+ ></path>
59
+ </svg>
60
+ {%- endif -%}
120
61
  </div>
121
- <div class="file-input" id="inputbox" style="color: #fff">
122
- <div class="m-auto">
123
- <div class="d-flex justify-content-center align-items-center">
124
- <div
125
- id="Inputbox"
126
- class="boxes"
127
- style="background-color: {{boxColor}};"
128
- >
129
- <img
130
- height="21px"
131
- width="21px"
132
- src="/assets/images/add.svg"
133
- alt="add"
134
- {%-
135
- if
136
- site.crossorigin
137
- -%}
138
- crossorigin
139
- {%-
140
- endif
141
- -%}
142
- />
143
- <span class="ml-3">CHOOSE FILE</span>
144
- </div>
145
- <div
146
- class="file-pick-dropdown"
147
- style="background-color:{{boxColor}}"
148
- >
149
- <i class="fas fa-angle-down arrow-sign"></i>
150
- <div class="file-picker-dropdown" style="display: none">
151
- <button id="filepicker">
152
- <svg
153
- class="mr-3"
154
- viewBox="0 0 24 24"
155
- xmlns="http://www.w3.org/2000/svg"
156
- >
157
- <path
158
- id="Path"
159
- d="M8.33331 3H15.6666L23 15H15.6666L8.33331 3Z"
160
- fill="#FFC107"
161
- ></path>
162
- <path
163
- id="Path_2"
164
- d="M4.6012 21L8.30086 15H23L19.3333 21H4.6012Z"
165
- fill="#1976D2"
166
- ></path>
167
- <path
168
- id="Path_3"
169
- d="M1 15.0625L4.60119 21L12 9L8.33333 3L1 15.0625Z"
170
- fill="#4CAF50"
171
- ></path>
172
- </svg>
173
- Google Drive
174
- </button>
175
- <button id="dropbox">
176
- <svg
177
- class="mr-3"
178
- viewBox="0 0 24 24"
179
- fill="#0061FF"
180
- xmlns="http://www.w3.org/2000/svg"
181
- >
182
- <path
183
- id="icon"
184
- d="M12.0146 6.57367L6.50732 10.1473L12.0146 13.721L6.50732 17.2947L1 13.6912L6.50732 10.1176L1 6.57367L6.50732 3L12.0146 6.57367ZM6.47803 18.4263L11.9854 14.8527L17.4927 18.4263L11.9854 22L6.47803 18.4263ZM12.0146 13.6912L17.522 10.1176L12.0146 6.57367L17.4927 3L23 6.57367L17.4927 10.1473L23 13.721L17.4927 17.2947L12.0146 13.6912Z"
185
- ></path>
186
- </svg>
187
- Dropbox
188
- </button>
189
- </div>
62
+ </span>
63
+ {%- assign featureh1 = featureData.H1 | replace: "$variable",
64
+ page.value -%}
65
+ <h1 id="feature-h1" class="feature-h1">
66
+ {%- for word in featureh1-%} {%- if forloop.first == true -%} {{word
67
+ | capitalize }} {%- else -%} {{word}} {%- endif -%} {%- endfor -%}
68
+ </h1>
69
+ </div>
70
+ {%- assign featureh2 = featureData.H2 | replace: "$variable", page.value
71
+ -%}
72
+ <h2 id="feature-h2" class="feature-h2">
73
+ {%- for word in featureh2 -%} {%- if forloop.first == true -%} {{word
74
+ | capitalize }} {%- else -%} {{word}} {%- endif -%} {%- endfor -%}
75
+ </h2>
76
+ </div>
77
+ </div>
78
+
79
+ {%- endif -%} {%- if site.noFeatureBox == true -%}
80
+ <div class="feature-content-box" id="theme-content-box">{{content}}</div>
81
+ {%- elsif site.newFeatureBox and page.newBox -%}
82
+ <div class="feature-content-box" id="theme-content-box">
83
+ <div class="container">
84
+ {%- assign boxColor =
85
+ site.data[page.folderName][page.lang][page.fileName].color -%} {%- if
86
+ page.removeBox != true -%}
87
+ <div class="custom-box" data-color="{{boxColor}}">
88
+ <div style="display: none" id="file-loader">
89
+ <img
90
+ src="/assets/images/spinner.gif"
91
+ alt="spinner"
92
+ {%-
93
+ if
94
+ site.crossorigin
95
+ -%}
96
+ crossorigin
97
+ {%-
98
+ endif
99
+ -%}
100
+ />
101
+ <p>Please Wait ,Loading Your file</p>
102
+ </div>
103
+ <div class="saving-file-download-wrap" style="display: none">
104
+ <img
105
+ loading="lazy"
106
+ class="trust-img"
107
+ src="/trust.svg"
108
+ alt="trust"
109
+ {%-
110
+ if
111
+ site.crossorigin
112
+ -%}
113
+ crossorigin
114
+ {%-
115
+ endif
116
+ -%}
117
+ />
118
+ <p class="text-white my-2">Thanks for your patience</p>
119
+ <button class="btn" id="download-zip">Download</button>
120
+ </div>
121
+ <div class="file-input" id="inputbox" style="color: #fff">
122
+ <div class="m-auto">
123
+ <div class="d-flex justify-content-center align-items-center">
124
+ <div
125
+ id="Inputbox"
126
+ class="boxes"
127
+ style="background-color: {{boxColor}};"
128
+ >
129
+ <img
130
+ height="21px"
131
+ width="21px"
132
+ src="/assets/images/add.svg"
133
+ alt="add"
134
+ {%-
135
+ if
136
+ site.crossorigin
137
+ -%}
138
+ crossorigin
139
+ {%-
140
+ endif
141
+ -%}
142
+ />
143
+ <span class="ml-3">CHOOSE FILE</span>
144
+ </div>
145
+ <div
146
+ class="file-pick-dropdown"
147
+ style="background-color:{{boxColor}}"
148
+ >
149
+ <i class="fas fa-angle-down arrow-sign"></i>
150
+ <div class="file-picker-dropdown" style="display: none">
151
+ <button id="filepicker">
152
+ <svg
153
+ class="mr-3"
154
+ viewBox="0 0 24 24"
155
+ xmlns="http://www.w3.org/2000/svg"
156
+ >
157
+ <path
158
+ id="Path"
159
+ d="M8.33331 3H15.6666L23 15H15.6666L8.33331 3Z"
160
+ fill="#FFC107"
161
+ ></path>
162
+ <path
163
+ id="Path_2"
164
+ d="M4.6012 21L8.30086 15H23L19.3333 21H4.6012Z"
165
+ fill="#1976D2"
166
+ ></path>
167
+ <path
168
+ id="Path_3"
169
+ d="M1 15.0625L4.60119 21L12 9L8.33333 3L1 15.0625Z"
170
+ fill="#4CAF50"
171
+ ></path>
172
+ </svg>
173
+ Google Drive
174
+ </button>
175
+ <button id="dropbox">
176
+ <svg
177
+ class="mr-3"
178
+ viewBox="0 0 24 24"
179
+ fill="#0061FF"
180
+ xmlns="http://www.w3.org/2000/svg"
181
+ >
182
+ <path
183
+ id="icon"
184
+ d="M12.0146 6.57367L6.50732 10.1473L12.0146 13.721L6.50732 17.2947L1 13.6912L6.50732 10.1176L1 6.57367L6.50732 3L12.0146 6.57367ZM6.47803 18.4263L11.9854 14.8527L17.4927 18.4263L11.9854 22L6.47803 18.4263ZM12.0146 13.6912L17.522 10.1176L12.0146 6.57367L17.4927 3L23 6.57367L17.4927 10.1473L23 13.721L17.4927 17.2947L12.0146 13.6912Z"
185
+ ></path>
186
+ </svg>
187
+ Dropbox
188
+ </button>
190
189
  </div>
191
190
  </div>
192
191
  </div>
193
- <p id="dropfile" class="text-dark">or drop your file here</p>
194
- <p id="error" class="p-3"></p>
195
192
  </div>
193
+ <p id="dropfile" class="text-dark">or drop your file here</p>
194
+ <p id="error" class="p-3"></p>
195
+ </div>
196
+ </div>
197
+ <div class="workspace">
198
+ <div class="row mx-auto">
199
+ <div class="col-md-10 mx-auto">{{content}}</div>
196
200
  </div>
197
- <div class="workspace">
198
- <div class="row mx-auto">
199
- <div class="col-md-10 mx-auto">{{content}}</div>
201
+ </div>
202
+ {%- endif -%}
203
+ </div>
204
+ </div>
205
+ {%- else -%} {%- if page.noBox == true -%}
206
+ <div class="feature-content-box" id="theme-content-box">{{content}}</div>
207
+ {%- else -%}
208
+ <div class="box-padding" id="theme-content-box">
209
+ <div class="d-flex" id="__cond-922051">
210
+ <div class="flex-container">
211
+ <div class="flex-class">
212
+ <div class="d-flex flex-column">
213
+ <div
214
+ class="box"
215
+ style="background:{{featureData.color}};min-height:{{featureData.height}};width:{{featureData.width}}"
216
+ >
217
+ <div class="box-border"></div>
218
+ <div class="content-box">{{content}}</div>
219
+ </div>
200
220
  </div>
201
221
  </div>
202
- {%- endif -%}
203
222
  </div>
204
223
  </div>
205
- {%- else -%} {%- if page.noBox == true -%}
206
- <div class="feature-content-box" id="theme-content-box">{{content}}</div>
207
- {%- else -%}
208
- <div class="box-padding" id="theme-content-box">
209
- <div class="d-flex" id="__cond-922051">
210
- <div class="flex-container">
211
- <div class="flex-class">
212
- <div class="d-flex flex-column">
213
- <div
214
- class="box"
215
- style="background:{{featureData.color}};min-height:{{featureData.height}};width:{{featureData.width}}"
216
- >
217
- <div class="box-border"></div>
218
- <div class="content-box">{{content}}</div>
224
+ </div>
225
+ {%- endif -%} {%- endif -%} {%- if page.layout == "batch" -%}
226
+ <div
227
+ class="w-100 line"
228
+ style="border-top: 1px solid rgb(224, 224, 224)"
229
+ ></div>
230
+ {%- endif -%}
231
+
232
+ <div class="container mt-4 mb-5">
233
+ <div class="row px-0">
234
+ {%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%}
235
+ <div class="col-md-9 mx-auto">
236
+ <div class="row">
237
+ {%- endif -%} {% assign totalHeaderCount = 0 %} {% for data in
238
+ featureData.TEXTUAL_CONTENT %} {% assign words = data.header |
239
+ split: " " %} {% assign word_count = words | size %} {% assign
240
+ totalHeaderCount = totalHeaderCount | plus: word_count %} {% endfor
241
+ %} {% for data in featureData.TEXTUAL_CONTENT %}
242
+ <div
243
+ class="{%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%} col-md-6 my-4 {%- else -%} col-md-4 my-4 {%- endif -%}"
244
+ >
245
+ <div>
246
+ <img
247
+ class="feature-card-img"
248
+ src="{{data.logoUrl}}"
249
+ loading="lazy"
250
+ height="48px"
251
+ width="48px"
252
+ alt="{{data.header}}"
253
+ {%-
254
+ if
255
+ site.crossorigin
256
+ -%}
257
+ crossorigin
258
+ {%-
259
+ endif
260
+ -%}
261
+ />
262
+
263
+ {%- if totalHeaderCount > site.count_of_words_in_headings -%}
264
+ <h2 class="feature-card-title">
265
+ {{data.header | replace: "$variable", page.value}}
266
+ </h2>
267
+ {%- else -%}
268
+ <div class="feature-card-title">
269
+ {{data.header | replace: "$variable", page.value}}
270
+ </div>
271
+ {%- endif -%}
272
+ <div class="feature-card-desc">
273
+ {{data.content | replace: "$variable", page.value}}
219
274
  </div>
220
275
  </div>
221
276
  </div>
277
+ {% endfor %} {%- if site.monumetricId and page.url != '/' and
278
+ page.lang == 'en' -%}
222
279
  </div>
223
280
  </div>
281
+ {%- endif -%}
224
282
  </div>
225
- {%- endif -%} {%- endif -%} {%- if page.layout == "batch" -%}
226
- <div
227
- class="w-100 line"
228
- style="border-top: 1px solid rgb(224, 224, 224)"
229
- ></div>
230
- {%- endif -%}
231
-
232
- <div class="container mt-4 mb-5">
233
- <div class="row px-0">
283
+ </div>
284
+ <section class="how-to-section">
285
+ <div class="container">
286
+ <div class="row">
234
287
  {%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%}
235
288
  <div class="col-md-9 mx-auto">
236
289
  <div class="row">
237
- {%- endif -%} {% assign totalHeaderCount = 0 %} {% for data in
238
- featureData.TEXTUAL_CONTENT %} {% assign words = data.header |
239
- split: " " %} {% assign word_count = words | size %} {% assign
240
- totalHeaderCount = totalHeaderCount | plus: word_count %} {% endfor
241
- %} {% for data in featureData.TEXTUAL_CONTENT %}
242
- <div
243
- class="{%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%} col-md-6 my-4 {%- else -%} col-md-4 my-4 {%- endif -%}"
244
- >
245
- <div>
290
+ {%- endif -%}
291
+ <div class="col-md-6 order-0">
292
+ {%- if featureData.HOW_TO_CONTENT.YoutubeVideoUrl.size > 0 -%}
293
+ <div class="how-to-video-wrapper">
294
+ {% assign video_url =
295
+ featureData.HOW_TO_CONTENT.YoutubeVideoUrl %} {% assign
296
+ video_id = "" %} {% if video_url contains "youtu.be/" %} {%
297
+ assign parts = video_url | split: "/" %} {% assign video_id =
298
+ parts[3] %} {% elsif video_url contains "youtube.com/watch" %}
299
+ {% assign params = video_url | split: "?" | last | split: "&"
300
+ %} {% for param in params %} {% if param contains "v=" %} {%
301
+ assign video_id = param | split: "=" | last %} {% endif %} {%
302
+ endfor %} {% endif %} {%- if site.monumetricId -%}
303
+ <iframe
304
+ class="youtubeVideoPlayer mb-5"
305
+ width="400"
306
+ height="315"
307
+ src="https://www.youtube.com/embed/{{video_id}}?autoplay=1&mute=1"
308
+ allowfullscreen
309
+ >
310
+ </iframe>
311
+ {%- else -%}
312
+ <iframe
313
+ class="youtubeVideoPlayer mb-5"
314
+ width="500"
315
+ height="315"
316
+ src="https://www.youtube.com/embed/{{video_id}}?autoplay=1&mute=1"
317
+ allowfullscreen
318
+ >
319
+ </iframe>
320
+ {%- endif -%}
321
+ </div>
322
+ {%- else -%}
323
+ <div class="how-to-img-wrapper">
246
324
  <img
247
- class="feature-card-img"
248
- src="{{data.logoUrl}}"
325
+ class="how-to-leftimg"
326
+ height="180px"
327
+ width="300px"
328
+ src="{{featureData.HOW_TO_CONTENT.logoImageUrl}}"
249
329
  loading="lazy"
250
- height="48px"
251
- width="48px"
252
- alt="{{data.header}}"
330
+ alt="{{featureData.HOW_TO_CONTENT.logoImageAlt | default: 'how to image' }}"
253
331
  {%-
254
332
  if
255
333
  site.crossorigin
@@ -259,162 +337,101 @@
259
337
  endif
260
338
  -%}
261
339
  />
262
-
263
- {%- if totalHeaderCount > site.count_of_words_in_headings -%}
264
- <h2 class="feature-card-title">
265
- {{data.header | replace: "$variable", page.value}}
266
- </h2>
267
- {%- else -%}
268
- <div class="feature-card-title">
269
- {{data.header | replace: "$variable", page.value}}
270
- </div>
271
- {%- endif -%}
272
- <div class="feature-card-desc">
273
- {{data.content | replace: "$variable", page.value}}
274
- </div>
275
340
  </div>
276
- </div>
277
- {% endfor %} {%- if site.monumetricId and page.url != '/' and
278
- page.lang == 'en' -%}
279
- </div>
280
- </div>
281
- {%- endif -%}
282
- </div>
283
- </div>
284
- <section class="how-to-section">
285
- <div class="container">
286
- <div class="row">
287
- {%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%}
288
- <div class="col-md-9 mx-auto">
289
- <div class="row">
290
341
  {%- endif -%}
291
- <div class="col-md-6 order-0">
292
- {%- if featureData.HOW_TO_CONTENT.YoutubeVideoUrl.size > 0 -%}
293
- <div class="how-to-video-wrapper">
294
- {% assign video_url = featureData.HOW_TO_CONTENT.YoutubeVideoUrl %}
295
- {% assign video_id = "" %}
296
- {% if video_url contains "youtu.be/" %}
297
- {% assign parts = video_url | split: "/" %}
298
- {% assign video_id = parts[3] %}
299
- {% elsif video_url contains "youtube.com/watch" %}
300
- {% assign params = video_url | split: "?" | last | split: "&" %}
301
- {% for param in params %}
302
- {% if param contains "v=" %}
303
- {% assign video_id = param | split: "=" | last %}
304
- {% endif %}
342
+ </div>
343
+ <div class="col-md-6 order-1">
344
+ <div class="how-to-right">
345
+ <h3 class="how-to-title text-left">
346
+ {{featureData.HOW_TO_CONTENT.heading | replace: "$variable",
347
+ page.value}}
348
+ </h3>
349
+ <ol class="how-to-list">
350
+ {% for data in featureData.HOW_TO_CONTENT.steps %}
351
+
352
+ <li id="step{{forloop.index}}" class="how-to-list-item">
353
+ <span>{{forloop.index}}.</span>{{data | replace:
354
+ "$variable", page.value}}
355
+ </li>
305
356
  {% endfor %}
306
- {% endif %}
307
- {%- if site.monumetricId -%}
308
- <iframe class="youtubeVideoPlayer mb-5" width="400" height="315"
309
- src="https://www.youtube.com/embed/{{video_id}}?autoplay=1&mute=1" allowfullscreen>
310
- </iframe>
311
- {%- else -%}
312
- <iframe class="youtubeVideoPlayer mb-5" width="500" height="315"
313
- src="https://www.youtube.com/embed/{{video_id}}?autoplay=1&mute=1" allowfullscreen>
314
- </iframe>
315
- {%- endif -%}
316
- </div>
317
- {%- else -%}
318
- <div class="how-to-img-wrapper">
319
- <img class="how-to-leftimg" height="180px" width="300px"
320
- src="{{featureData.HOW_TO_CONTENT.logoImageUrl}}" loading="lazy"
321
- alt="{{featureData.HOW_TO_CONTENT.logoImageAlt | default: 'how to image' }}" {%- if site.crossorigin
322
- -%} crossorigin {%- endif -%} />
323
- </div>
324
- {%- endif -%}
357
+ </ol>
325
358
  </div>
326
- <div class="col-md-6 order-1">
327
- <div class="how-to-right">
328
- <h3 class="how-to-title text-left">
329
- {{featureData.HOW_TO_CONTENT.heading | replace: "$variable",
330
- page.value}}
331
- </h3>
332
- <ol class="how-to-list">
333
- {% for data in featureData.HOW_TO_CONTENT.steps %}
334
-
335
- <li id="step{{forloop.index}}" class="how-to-list-item">
336
- <span>{{forloop.index}}.</span>{{data | replace:
337
- "$variable", page.value}}
338
- </li>
339
- {% endfor %}
340
- </ol>
341
- </div>
342
- </div>
343
- {%- if site.monumetricId and page.url != '/' and page.lang == 'en'
344
- -%}
345
359
  </div>
360
+ {%- if site.monumetricId and page.url != '/' and page.lang == 'en'
361
+ -%}
346
362
  </div>
347
- {%- endif -%}
348
363
  </div>
364
+ {%- endif -%}
349
365
  </div>
350
- </section>
351
-
352
- {%- if page.layout == "feature" -%} {%- include bookmark.html -%} {%- endif
353
- -%} {%- assign showFaqs= true -%} {%- for item in site.noFaqsList -%} {%- if
354
- item == page.lang -%} {%- assign showFaqs = false -%} {%- break -%} {%- else
355
- -%} {%- assign showFaqs = true -%} {%- endif -%} {%- endfor -%} {%- if
356
- showFaqs == true -%} {%- if featureData.FAQ.size>0 -%}
357
- <section class="faq-section">
358
- <div class="container">
359
- <div class="row">
360
- <div class="col-md-8 mx-auto">
361
- <div class="faq">
362
- <h3 class="feature-h1 text-center mb-4">
363
- {{featureData.faqheading | default: 'Frequently Asked
364
- Questions'}}
365
- </h3>
366
- <ul class="list-unstyled">
367
- {% for data in featureData.FAQ %}
368
- <li>
369
- <h3 class="faq-question" itemprop="name">
370
- {{data.question | replace: "$variable", page.value}}<em
371
- style="transform: rotate(-135deg)"
372
- >
373
- <i></i
374
- ></em>
375
- </h3>
376
- <div style="display: block">
377
- <p class="faq-answer" itemprop="text">
378
- {{data.answer | replace: "$variable", page.value}}
379
- </p>
380
- </div>
381
- </li>
382
- {% endfor %}
383
- </ul>
384
- </div>
366
+ </div>
367
+ </section>
368
+
369
+ {%- if page.layout == "feature" -%} {%- include bookmark.html -%} {%- endif
370
+ -%} {%- assign showFaqs= true -%} {%- for item in site.noFaqsList -%} {%- if
371
+ item == page.lang -%} {%- assign showFaqs = false -%} {%- break -%} {%- else
372
+ -%} {%- assign showFaqs = true -%} {%- endif -%} {%- endfor -%} {%- if
373
+ showFaqs == true -%} {%- if featureData.FAQ.size>0 -%}
374
+ <section class="faq-section">
375
+ <div class="container">
376
+ <div class="row">
377
+ <div class="col-md-8 mx-auto">
378
+ <div class="faq">
379
+ <h3 class="feature-h1 text-center mb-4">
380
+ {{featureData.faqheading | default: 'Frequently Asked
381
+ Questions'}}
382
+ </h3>
383
+ <ul class="list-unstyled">
384
+ {% for data in featureData.FAQ %}
385
+ <li>
386
+ <h3 class="faq-question" itemprop="name">
387
+ {{data.question | replace: "$variable", page.value}}<em
388
+ style="transform: rotate(-135deg)"
389
+ >
390
+ <i></i
391
+ ></em>
392
+ </h3>
393
+ <div style="display: block">
394
+ <p class="faq-answer" itemprop="text">
395
+ {{data.answer | replace: "$variable", page.value}}
396
+ </p>
397
+ </div>
398
+ </li>
399
+ {% endfor %}
400
+ </ul>
385
401
  </div>
386
402
  </div>
387
403
  </div>
388
- </section>
389
- {%- endif -%} {%- endif -%} {%- include share/socialshare.html -%} {%-
390
- include Rating/rating.html -%} {%- if featureData.infographics.size > 0 -%}
391
- {%- include infographics/infographics.html -%} {%- endif -%} {%- include
392
- /Usp/usp.html -%} {%- if featureData.display_formats -%}
393
- <div class="container compare-table">
394
- {%- include fileformat/fileformatdetail.html -%}
395
- </div>
396
- {%- endif -%} {%- if featureData.compare_formats -%}
397
- <div class="container file-detail-table">
398
- {%- include fileformat/comparisonfiles.html -%}
399
404
  </div>
400
-
401
- {%- endif -%} {%- if site.userTrackingCount -%} {%- include
402
- userTracking.html -%} {%- endif -%} {%- assign langen = "en" -%} {%- if
403
- site.data[folder][langen][file].categories -%} {% assign categories=
404
- site.data[folder][langen][file].categories %} {%- else -%} {% assign
405
- categories= page.categories %} {%- endif -%} {%- if
406
- site.data[folder][langen][file].tags -%} {% assign tags=
407
- site.data[folder][langen][file].tags %} {%- else -%} {% assign tags=
408
- page.tags %} {%- endif -%} {%- if featureData.posts.size > 0 -%} {%- include
409
- customblog/pageRelatedPosts.html -%} {%- else -%} {%- if categories.size > 0
410
- or tags.size > 0 -%} {%- include section/related_categories_post.html -%}
411
- {%- else -%} {%- include section/recent_posts.html -%} {%- endif -%} {%-
412
- endif -%} {%- if site.customblogdata -%} {%- if categories.size> 0 or
413
- tags.size>0-%} {%- include customblog/relatedposts.html -%} {%- else -%} {%-
414
- include customblog/recentposts.html -%} {% endif %} {%- endif -%} {%- if
415
- featureData.author.size > 0 -%} {% include
416
- featurePageAuthors/featurePageAuthors.html %} {%- endif -%} {% include
417
- footer/index.html %} {%- if site.customCode -%} {%- include customCode.html
418
- -%} {%- endif -%} {% include script.html %}
419
- </body>
420
- </html>
405
+ </section>
406
+ {%- endif -%} {%- endif -%} {%- include share/socialshare.html -%} {%-
407
+ include Rating/rating.html -%} {%- if featureData.infographics.size > 0 -%}
408
+ {%- include infographics/infographics.html -%} {%- endif -%} {%- include
409
+ /Usp/usp.html -%} {%- if featureData.display_formats -%}
410
+ <div class="container compare-table">
411
+ {%- include fileformat/fileformatdetail.html -%}
412
+ </div>
413
+ {%- endif -%} {%- if featureData.compare_formats -%}
414
+ <div class="container file-detail-table">
415
+ {%- include fileformat/comparisonfiles.html -%}
416
+ </div>
417
+
418
+ {%- endif -%} {%- if site.userTrackingCount -%} {%- include
419
+ userTracking.html -%} {%- endif -%} {%- assign langen = "en" -%} {%- if
420
+ site.data[folder][langen][file].categories -%} {% assign categories=
421
+ site.data[folder][langen][file].categories %} {%- else -%} {% assign
422
+ categories= page.categories %} {%- endif -%} {%- if
423
+ site.data[folder][langen][file].tags -%} {% assign tags=
424
+ site.data[folder][langen][file].tags %} {%- else -%} {% assign tags=
425
+ page.tags %} {%- endif -%} {%- if featureData.posts.size > 0 -%} {%- include
426
+ customblog/pageRelatedPosts.html -%} {%- else -%} {%- if categories.size > 0
427
+ or tags.size > 0 -%} {%- include section/related_categories_post.html -%}
428
+ {%- else -%} {%- include section/recent_posts.html -%} {%- endif -%} {%-
429
+ endif -%} {%- if site.customblogdata -%} {%- if categories.size> 0 or
430
+ tags.size>0-%} {%- include customblog/relatedposts.html -%} {%- else -%} {%-
431
+ include customblog/recentposts.html -%} {% endif %} {%- endif -%} {%- if
432
+ featureData.author.size > 0 -%} {% include
433
+ featurePageAuthors/featurePageAuthors.html %} {%- endif -%} {% include
434
+ footer/index.html %} {%- if site.customCode -%} {%- include customCode.html
435
+ -%} {%- endif -%} {% include script.html %}
436
+ </body>
437
+ </html>