appscms-tools-theme 4.6.2 → 4.6.3

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.
Files changed (131) hide show
  1. checksums.yaml +4 -4
  2. data/_data/about/en/about.json +16 -16
  3. data/_data/blog/nav.json +14 -14
  4. data/_data/blog/relatedblogs.json +2816 -2816
  5. data/_data/feature/en/batch-conversion.json +192 -192
  6. data/_data/feature/en/compress-pdf.json +209 -305
  7. data/_data/feature/en/devtools.json +321 -321
  8. data/_data/feature/en/face-detection.json +156 -156
  9. data/_data/feature/en/split-pdf.json +221 -221
  10. data/_data/feature/en/theframe.json +160 -160
  11. data/_data/footer/en/data.json +2 -2
  12. data/_data/header/en/data.json +412 -412
  13. data/_data/home/en/en.json +324 -324
  14. data/_data/home/en/posters.json +322 -322
  15. data/_includes/appscms/customblog/contenttool-recent-posts.html +94 -94
  16. data/_includes/appscms/customblog/pageRelatedPosts.html +68 -68
  17. data/_includes/appscms/customblog/recentposts.html +67 -67
  18. data/_includes/appscms/customblog/relatedBlogs.html +82 -82
  19. data/_includes/appscms/customblog/relatedposts.html +193 -193
  20. data/_includes/appscms/extras/appscms-postbox.html +57 -57
  21. data/_includes/appscms/featurePageAuthors/featurePageAuthors.html +85 -85
  22. data/_includes/appscms/head/bloghead.html +128 -128
  23. data/_includes/appscms/headings/contenttool-headings.html +33 -33
  24. data/_includes/appscms/headings/devtool-headings.html +38 -38
  25. data/_includes/appscms/home/contenttool-feature-boxes.html +19 -19
  26. data/_includes/appscms/home/devtool-feature-boxes.html +70 -70
  27. data/_includes/appscms/infographics/infographics.html +166 -166
  28. data/_includes/appscms/loaders/loader.html +4 -4
  29. data/_includes/appscms/navbars/devtool-navbar.html +50 -50
  30. data/_includes/appscms/navbars/devtool-toolbar.html +100 -100
  31. data/_includes/appscms/navbars/toolbar.html +4 -17
  32. data/_includes/appscms/recent-posts/recent_posts.html +90 -90
  33. data/_includes/appscms/recent-posts/related_categories_post.html +194 -194
  34. data/_includes/appscms/searchbar/devtool-searchbar.html +63 -63
  35. data/_includes/appscms/usp/usp.html +90 -90
  36. data/_includes/author_bio.html +41 -41
  37. data/_includes/authorpagehead/index.html +47 -47
  38. data/_includes/authors/authors.html +39 -39
  39. data/_includes/batch-conversion.html +141 -141
  40. data/_includes/bookmark.html +6 -6
  41. data/_includes/cssfile/links.html +54 -54
  42. data/_includes/custom-head.html +138 -138
  43. data/_includes/customCode.html +1 -1
  44. data/_includes/customScripts.html +1 -1
  45. data/_includes/customblog/pageRelatedPosts.html +87 -87
  46. data/_includes/customblog/recentposts.html +67 -67
  47. data/_includes/customblog/relatedBlogs.html +86 -86
  48. data/_includes/customblog/relatedposts.html +201 -201
  49. data/_includes/dropdown/langdropdown.html +32 -32
  50. data/_includes/feature.html +39 -39
  51. data/_includes/featurePageAuthors/featurePageAuthors.html +101 -101
  52. data/_includes/footer/index.html +537 -537
  53. data/_includes/google-analytics.html +32 -32
  54. data/_includes/head/index.html +623 -623
  55. data/_includes/header/blogHeader.html +34 -34
  56. data/_includes/header/index.html +192 -192
  57. data/_includes/infographics/infographics.html +241 -241
  58. data/_includes/paginationBlogPage.html +70 -70
  59. data/_includes/postbox.html +65 -65
  60. data/_includes/script.html +493 -493
  61. data/_includes/section/count.html +32 -32
  62. data/_includes/section/recent_posts.html +94 -94
  63. data/_includes/section/related_categories_post.html +196 -196
  64. data/_includes/share/socialshare.html +21 -21
  65. data/_includes/userTracking.html +14 -14
  66. data/_layouts/aboutUs.html +175 -175
  67. data/_layouts/allAuthors.html +131 -131
  68. data/_layouts/appscms-about.html +163 -163
  69. data/_layouts/appscms-audio.html +33 -33
  70. data/_layouts/appscms-author.html +436 -436
  71. data/_layouts/appscms-authors.html +145 -145
  72. data/_layouts/appscms-batch.html +141 -141
  73. data/_layouts/appscms-calculator.html +93 -93
  74. data/_layouts/appscms-categories.html +26 -26
  75. data/_layouts/appscms-contact.html +132 -132
  76. data/_layouts/appscms-disclaimer.html +124 -124
  77. data/_layouts/appscms-download.html +289 -289
  78. data/_layouts/appscms-feature-result.html +96 -96
  79. data/_layouts/appscms-help.html +25 -25
  80. data/_layouts/appscms-imagekit.html +96 -96
  81. data/_layouts/appscms-post.html +243 -243
  82. data/_layouts/appscms-privacy-policy.html +781 -781
  83. data/_layouts/appscms-terms-and-conditions.html +646 -646
  84. data/_layouts/appscms-video.html +33 -33
  85. data/_layouts/audio.html +33 -33
  86. data/_layouts/author.html +409 -409
  87. data/_layouts/batch.html +177 -177
  88. data/_layouts/blog-1.html +116 -116
  89. data/_layouts/blog.html +131 -131
  90. data/_layouts/calculator.html +99 -99
  91. data/_layouts/contenttool-feature.html +45 -45
  92. data/_layouts/contenttool-home.html +53 -53
  93. data/_layouts/devtool-blog.html +132 -132
  94. data/_layouts/devtool-feature.html +54 -54
  95. data/_layouts/devtool-home.html +53 -53
  96. data/_layouts/devtools.html +57 -57
  97. data/_layouts/feature-1.html +406 -406
  98. data/_layouts/feature.html +351 -351
  99. data/_layouts/featureResultPage.html +82 -82
  100. data/_layouts/frame.html +222 -222
  101. data/_layouts/home.html +281 -281
  102. data/_layouts/homeResultPage.html +32 -32
  103. data/_layouts/imagekit.html +308 -308
  104. data/_layouts/photo-effects-home.html +190 -190
  105. data/_layouts/post.html +233 -233
  106. data/assets/app.js +75 -75
  107. data/assets/css/appscms-blog.css +505 -505
  108. data/assets/css/appscms-contenttool.css +1384 -1384
  109. data/assets/css/appscms-home.css +5 -5
  110. data/assets/css/appscms-imagekit.css +855 -855
  111. data/assets/css/appscms-variables.css +19 -19
  112. data/assets/css/blog.css +510 -510
  113. data/assets/css/calculators.css +46 -46
  114. data/assets/css/devtool-main.css +1350 -1350
  115. data/assets/css/devtools.css +105 -105
  116. data/assets/css/feature-1.css +293 -293
  117. data/assets/css/imagekit copy.css +848 -848
  118. data/assets/css/imagekit.css +848 -848
  119. data/assets/css/tools.css +1847 -1847
  120. data/assets/images/close-button.svg +31 -31
  121. data/assets/images/digipaint.svg +6 -6
  122. data/assets/images/logo.svg +2 -2
  123. data/assets/images/manthink.svg +3552 -3552
  124. data/assets/images/search-icon.svg +2 -2
  125. data/assets/js/batch.js +219 -219
  126. data/assets/js/devtools.js +81 -81
  127. data/assets/js/sharePage.js +65 -65
  128. data/assets/js/usageTracking.js +143 -143
  129. data/assets/js/usageTrackingEvents.js +6 -6
  130. data/assets/js/webvitals.js +4 -4
  131. metadata +3 -3
data/_layouts/home.html CHANGED
@@ -1,282 +1,282 @@
1
- {% assign file = page.fileName %} {% assign lang = page.lang %} {% assign folder
2
- = page.folderName %} {% assign homeData= 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 homeData.nofileupload -%}
9
- <div id="safeui-alert" class="alert alert-{{homeData.variant | default: 'info'}} fade show text-center" role="alert">
10
- <div class="container">
11
- {%- if homeData.alertmsg -%} {{homeData.alertmsg}} {%- else -%} We do
12
- not upload any files to server, hence your data is 100% secure. {%-
13
- endif -%}
14
- </div>
15
- </div>
16
- {%- endif -%} {%- if homeData.h1 or homeData.h2 -%}
17
- <div class="flex-container mb-1">
18
- <div class="flex-class py-5">
19
- <div class="d-flex justify-content-center align-items-center">
20
- <span class="fHhdVc">
21
- <div class="div-cont feature-img mr-2">
22
- {%- if homeData.img -%}
23
- <img loading="lazy" style="width:{{homeData.imgwidth}};height:{{homeData.imgheight}};"
24
- src="{{homeData.img}}" alt="{{homeData.imgalt}}" {%- if site.crossorigin -%} crossorigin {%- endif -%} />
25
- {%- endif -%}
26
- </div>
27
- </span>
28
- <h1 class="home-top-h1">
29
- {%- for word in homeData.h1 -%} {%- if forloop.first == true -%}
30
- {{word | capitalize }} {%- else -%} {{word}} {%- endif -%} {%-
31
- endfor -%}
32
- </h1>
33
- </div>
34
- <h2 class="home-top-h2">
35
- {%- for word in homeData.h2 -%} {%- if forloop.first == true -%}
36
- {{word | capitalize }} {%- else -%} {{word}} {%- endif -%} {%- endfor
37
- -%}
38
- </h2>
39
- </div>
40
- </div>
41
- {%- endif -%} {%- if homeData.features -%} {%- if site.monumetricId and
42
- page.url != '/' and page.lang == "en" -%}
43
- <div class="container">
44
- <div class="row">
45
- <div class="col-md-9 mx-auto">
46
- {%- endif -%}
47
- <div class="flex-container">
48
- <div class="flex-class">
49
- <ul class="home-features">
50
- {% for product in homeData.features %}
51
- <li style="background:{{product.color}}" class="home-feature-box">
52
- <div class="home-inner-box">
53
- <div class="div-cont feature-img" height="36px" width="36px">
54
- <img loading="lazy" src="{{product.icon}}" height="36px" width="36px" alt="star icon" {%- if
55
- site.crossorigin -%} crossorigin {%- endif -%} />
56
- </div>
57
- </div>
58
- <div class="home-feature-desc">{{product.description}}</div>
59
- <a class="home-feature-name" href="{{product.url}}">{{product.name}}</a>
60
- </li>
61
- {% endfor %}
62
- </ul>
63
- </div>
64
- </div>
65
- {%- if site.monumetricId and page.url != '/' and page.lang == "en" -%}
66
- </div>
67
- </div>
68
- </div>
69
- {%- endif -%} {%- endif -%}
70
- <div class="home-content-box" id="theme-content-box">{{content}}</div>
71
- {%- if homeData.TEXTUAL_CONTENT -%}
72
- <div class="container mt-4 mb-4">
73
- <div class="row px-0">
74
- {%- if site.monumetricId and page.url != '/' and page.lang == "en" -%}
75
- <div class="col-md-9 mx-auto">
76
- <div class="row">
77
- {%- endif -%} {% assign totalHeaderCount = 0 %} {% for data in
78
- homeData.TEXTUAL_CONTENT %} {% assign words = data.header | split: "
79
- " %} {% assign word_count = words | size %} {% assign
80
- totalHeaderCount = totalHeaderCount | plus: word_count %} {% endfor
81
- %} {% for data in homeData.TEXTUAL_CONTENT %}
82
- <div
83
- class="{%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%} col-md-6 my-4 {%- else -%} col-md-4 my-4 {%- endif -%}">
84
- <div>
85
- <img class="feature-card-img" height="48px" width="48px" loading="lazy" src="{{data.logoUrl}}"
86
- alt="{{data.header}}" {%- if site.crossorigin -%} crossorigin {%- endif -%} />
87
-
88
- {%- if totalHeaderCount > site.count_of_words_in_headings -%}
89
- <h2 class="feature-card-title">
90
- {{data.header | replace: "$variable", page.value}}
91
- </h2>
92
- {%- else -%}
93
- <div class="feature-card-title">
94
- {{data.header | replace: "$variable", page.value}}
95
- </div>
96
- {%- endif -%}
97
- <div class="feature-card-desc">
98
- {{data.content | replace: "$variable", page.value}}
99
- </div>
100
- </div>
101
- </div>
102
- {% endfor %} {%- if site.monumetricId and page.url != '/' and
103
- page.lang == "en" -%}
104
- </div>
105
- </div>
106
- {%- endif -%}
107
- </div>
108
- </div>
109
- {%- endif -%} {%- if homeData.HOW_TO_CONTENT -%}
110
- <section class="how-to-section">
111
- <div class="container">
112
- <div class="row">
113
- {%- if site.monumetricId and page.url != '/' and page.lang == "en" -%}
114
- <div class="col-md-9 mx-auto">
115
- <div class="row">
116
- {%- endif -%}
117
- <div class="col-md-6 order-0">
118
- {%- if homeData.HOW_TO_CONTENT.YoutubeVideoUrl.size > 0 -%}
119
- <div class="how-to-video-wrapper">
120
- {% assign video_url = homeData.HOW_TO_CONTENT.YoutubeVideoUrl %}
121
- {% assign video_id = "" %}
122
- {% if video_url contains "youtu.be/" %}
123
- {% assign parts = video_url | split: "/" %}
124
- {% assign video_id = parts[3] %}
125
- {% elsif video_url contains "youtube.com/watch" %}
126
- {% assign params = video_url | split: "?" | last | split: "&" %}
127
- {% for param in params %}
128
- {% if param contains "v=" %}
129
- {% assign video_id = param | split: "=" | last %}
130
- {% endif %}
131
- {% endfor %}
132
- {% endif %}
133
-
134
- {%- if site.monumetricId -%}
135
- <div class="how-to-video h-100 w-100" data-videoid="{{video_id}}">
136
- <img class="youtubeVideoPlayer" width="100%" height="100%" id="thumbnail-img" alt="thumbnail-img" />
137
- <div class="youtube-play-btn-wrapper">
138
- <button class="play-btn btn btn-primary" onClick="loadVideo()">►</button>
139
- </div>
140
- </div>
141
- {%- else -%}
142
- <div class="how-to-video h-100 w-100" data-videoid="{{video_id}}">
143
- <img class="youtubeVideoPlayer" width="100%" height="100%" id="thumbnail-img" alt="thumbnail-img" />
144
- <div class="youtube-play-btn-wrapper">
145
- <button class="play-btn btn btn-primary" onClick="loadVideo()">►</button>
146
- </div>
147
- </div>
148
- {%- endif -%}
149
- </div>
150
- {%- else -%}
151
- <div class="how-to-img-wrapper">
152
- <img class="how-to-leftimg" height="180px" width="300px" src="{{homeData.HOW_TO_CONTENT.logoImageUrl}}"
153
- loading="lazy" alt="{{homeData.HOW_TO_CONTENT.logoImageAlt | default: 'how to image' }}" {%- if
154
- site.crossorigin -%} crossorigin {%- endif -%} />
155
- </div>
156
- {%- endif -%}
157
- </div>
158
- <div class="col-md-6 order-1">
159
- <div class="how-to-right">
160
- <h3 class="how-to-title text-left">
161
- {{homeData.HOW_TO_CONTENT.heading | replace: "$variable",
162
- page.value}}
163
- </h3>
164
- <ol class="how-to-list">
165
- {% for data in homeData.HOW_TO_CONTENT.steps %}
166
-
167
- <li id="step{{forloop.index}}" class="how-to-list-item">
168
- <span>{{forloop.index}}.</span>{{data | replace:
169
- "$variable", page.value}}
170
- </li>
171
- {% endfor %}
172
- </ol>
173
- </div>
174
- </div>
175
- {%- if site.monumetricId and page.url != '/' and page.lang == 'en'
176
- -%}
177
- </div>
178
- </div>
179
- {%- endif -%}
180
- </div>
181
- </div>
182
- </section>
183
- {%- endif -%} {%- assign showFaqs = true -%} {%- for item in site.noFaqsList
184
- -%} {%- if item == page.lang -%} {%- assign showFaqs = false -%} {%- break
185
- -%} {%- else -%} {%- assign showFaqs = true -%} {%- endif -%} {%- endfor -%}
186
- {%- if showFaqs == true -%} {%- if homeData.FAQ -%}
187
- <section class="faq-section">
188
- <div class="container">
189
- <div class="row">
190
- <div class="col-md-8 mx-auto">
191
- <div class="faq">
192
- {%- if homeData.FAQ.size>0 -%}
193
- <h3 class="feature-h1 text-center mb-4">
194
- {{homeData.faqheading | default: 'Frequently Asked Questions'}}
195
- </h3>
196
- {%- endif -%}
197
- <ul class="list-unstyled">
198
- {% for data in homeData.FAQ %}
199
- <li>
200
- <h3 class="faq-question" itemprop="name">
201
- {{data.question | replace: "$variable", page.value}}<em style="transform: rotate(-135deg)">
202
- <i></i></em>
203
- </h3>
204
- <div style="display: block">
205
- <p class="faq-answer" itemprop="text">
206
- {{data.answer | replace: "$variable", page.value}}
207
- </p>
208
- </div>
209
- </li>
210
- {% endfor %}
211
- </ul>
212
- </div>
213
- </div>
214
- </div>
215
- </div>
216
- </section>
217
- {%- endif -%} {%- endif -%} {%- include share/socialshare.html -%} {%-
218
- include Rating/rating.html -%}
219
- {%- if homeData.infographics.size > 0 -%}
220
- {%- include /appscms/infographics/infographics.html -%}
221
- {%- endif -%}
222
-
223
- {%- if homeData.USPS -%} {%- include
224
- /Usp/usp.html -%} {%- endif -%} {%- if homeData.display_formats -%}
225
- <div class="container file-detail-table">
226
- {%- include fileformat/fileformatdetail.html -%}
227
- </div>
228
- {%- endif -%} {%- if homeData.compare_formats -%}
229
- <div class="container compare-table">
230
- {%- include fileformat/comparisonfiles.html -%}
231
- </div>
232
- {%- endif -%} {%- assign langen = "en" -%} {%- if
233
- site.data[folder][langen][file].categories -%} {%- assign categories =
234
- site.data[folder][langen][file].categories -%} {%- else -%} {%- assign
235
- categories = page.categories -%} {%- endif -%} {%- if
236
- site.data[folder][langen][file].tags -%} {%- assign tags =
237
- site.data[folder][langen][file].tags -%} {%- else -%} {%- assign tags =
238
- page.tags -%} {%- endif -%} {%- if homeData.posts.size > 0 -%} {%- include
239
- customblog/pageRelatedPosts.html -%} {%- else -%} {%- if categories.size > 0
240
- or tags.size > 0 -%} {%- include section/related_categories_post.html -%}
241
- {%- else -%} {%- include section/recent_posts.html -%} {%- endif -%} {%-
242
- endif -%} {%- if site.customblogdata -%} {%- if categories.size > 0 or
243
- tags.size > 0 -%} {%- include customblog/relatedposts.html -%} {%- else -%}
244
- {%- include customblog/recentposts.html -%} {%- endif -%} {%- endif -%} {%-
245
- if homeData.author.size > 0 -%} {%- include
246
- featurePageAuthors/featurePageAuthors.html -%} {%- endif -%} {%- include
247
- footer/index.html -%} {%- if site.customCode -%} {%- include customCode.html
248
- -%} {%- endif -%} {%- include script.html -%}
249
- </body>
250
-
251
- {%- if homeData.HOW_TO_CONTENT.YoutubeVideoUrl.size > 0 -%}
252
- <script>
253
- let videoContainer = document.querySelector('.how-to-video');
254
- let thumbnail = document.getElementById('thumbnail-img');
255
- let videoId = videoContainer.getAttribute("data-videoid")
256
- let thumbnailUrl = 'https://img.youtube.com/vi/' + videoId + '/maxresdefault.jpg';
257
- console.log(videoId)
258
-
259
- // Function to load video
260
- function loadVideo() {
261
- videoContainer.innerHTML = '<iframe loading="lazy" class="youtubeVideoPlayer" width="100%" height="100%" src="https://www.youtube.com/embed/' + videoId + '?autoplay=1&mute=1" allowfullscreen></iframe>';
262
- }
263
- // Function to handle lazy loading of the thumbnail
264
- function lazyLoadThumbnail(entries, observer) {
265
- entries.forEach(entry => {
266
- if (entry.isIntersecting) {
267
- // Load thumbnail when it becomes visible
268
- thumbnail.src = thumbnailUrl;
269
- // Stop observing once loaded
270
- observer.unobserve(entry.target);
271
- }
272
- });
273
- }
274
- // Set up the Intersection Observer
275
- var observer = new IntersectionObserver(lazyLoadThumbnail, { threshold: 0.1 });
276
- observer.observe(thumbnail);
277
- // Optionally, you can add an event listener to trigger video loading on click or other interactions
278
- thumbnail.addEventListener('click', loadVideo);
279
- </script>
280
- {%- endif -%}
281
-
1
+ {% assign file = page.fileName %} {% assign lang = page.lang %} {% assign folder
2
+ = page.folderName %} {% assign homeData= 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 homeData.nofileupload -%}
9
+ <div id="safeui-alert" class="alert alert-{{homeData.variant | default: 'info'}} fade show text-center" role="alert">
10
+ <div class="container">
11
+ {%- if homeData.alertmsg -%} {{homeData.alertmsg}} {%- else -%} We do
12
+ not upload any files to server, hence your data is 100% secure. {%-
13
+ endif -%}
14
+ </div>
15
+ </div>
16
+ {%- endif -%} {%- if homeData.h1 or homeData.h2 -%}
17
+ <div class="flex-container mb-1">
18
+ <div class="flex-class py-5">
19
+ <div class="d-flex justify-content-center align-items-center">
20
+ <span class="fHhdVc">
21
+ <div class="div-cont feature-img mr-2">
22
+ {%- if homeData.img -%}
23
+ <img loading="lazy" style="width:{{homeData.imgwidth}};height:{{homeData.imgheight}};"
24
+ src="{{homeData.img}}" alt="{{homeData.imgalt}}" {%- if site.crossorigin -%} crossorigin {%- endif -%} />
25
+ {%- endif -%}
26
+ </div>
27
+ </span>
28
+ <h1 class="home-top-h1">
29
+ {%- for word in homeData.h1 -%} {%- if forloop.first == true -%}
30
+ {{word | capitalize }} {%- else -%} {{word}} {%- endif -%} {%-
31
+ endfor -%}
32
+ </h1>
33
+ </div>
34
+ <h2 class="home-top-h2">
35
+ {%- for word in homeData.h2 -%} {%- if forloop.first == true -%}
36
+ {{word | capitalize }} {%- else -%} {{word}} {%- endif -%} {%- endfor
37
+ -%}
38
+ </h2>
39
+ </div>
40
+ </div>
41
+ {%- endif -%} {%- if homeData.features -%} {%- if site.monumetricId and
42
+ page.url != '/' and page.lang == "en" -%}
43
+ <div class="container">
44
+ <div class="row">
45
+ <div class="col-md-9 mx-auto">
46
+ {%- endif -%}
47
+ <div class="flex-container">
48
+ <div class="flex-class">
49
+ <ul class="home-features">
50
+ {% for product in homeData.features %}
51
+ <li style="background:{{product.color}}" class="home-feature-box">
52
+ <div class="home-inner-box">
53
+ <div class="div-cont feature-img" height="36px" width="36px">
54
+ <img loading="lazy" src="{{product.icon}}" height="36px" width="36px" alt="star icon" {%- if
55
+ site.crossorigin -%} crossorigin {%- endif -%} />
56
+ </div>
57
+ </div>
58
+ <div class="home-feature-desc">{{product.description}}</div>
59
+ <a class="home-feature-name" href="{{product.url}}">{{product.name}}</a>
60
+ </li>
61
+ {% endfor %}
62
+ </ul>
63
+ </div>
64
+ </div>
65
+ {%- if site.monumetricId and page.url != '/' and page.lang == "en" -%}
66
+ </div>
67
+ </div>
68
+ </div>
69
+ {%- endif -%} {%- endif -%}
70
+ <div class="home-content-box" id="theme-content-box">{{content}}</div>
71
+ {%- if homeData.TEXTUAL_CONTENT -%}
72
+ <div class="container mt-4 mb-4">
73
+ <div class="row px-0">
74
+ {%- if site.monumetricId and page.url != '/' and page.lang == "en" -%}
75
+ <div class="col-md-9 mx-auto">
76
+ <div class="row">
77
+ {%- endif -%} {% assign totalHeaderCount = 0 %} {% for data in
78
+ homeData.TEXTUAL_CONTENT %} {% assign words = data.header | split: "
79
+ " %} {% assign word_count = words | size %} {% assign
80
+ totalHeaderCount = totalHeaderCount | plus: word_count %} {% endfor
81
+ %} {% for data in homeData.TEXTUAL_CONTENT %}
82
+ <div
83
+ class="{%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%} col-md-6 my-4 {%- else -%} col-md-4 my-4 {%- endif -%}">
84
+ <div>
85
+ <img class="feature-card-img" height="48px" width="48px" loading="lazy" src="{{data.logoUrl}}"
86
+ alt="{{data.header}}" {%- if site.crossorigin -%} crossorigin {%- endif -%} />
87
+
88
+ {%- if totalHeaderCount > site.count_of_words_in_headings -%}
89
+ <h2 class="feature-card-title">
90
+ {{data.header | replace: "$variable", page.value}}
91
+ </h2>
92
+ {%- else -%}
93
+ <div class="feature-card-title">
94
+ {{data.header | replace: "$variable", page.value}}
95
+ </div>
96
+ {%- endif -%}
97
+ <div class="feature-card-desc">
98
+ {{data.content | replace: "$variable", page.value}}
99
+ </div>
100
+ </div>
101
+ </div>
102
+ {% endfor %} {%- if site.monumetricId and page.url != '/' and
103
+ page.lang == "en" -%}
104
+ </div>
105
+ </div>
106
+ {%- endif -%}
107
+ </div>
108
+ </div>
109
+ {%- endif -%} {%- if homeData.HOW_TO_CONTENT -%}
110
+ <section class="how-to-section">
111
+ <div class="container">
112
+ <div class="row">
113
+ {%- if site.monumetricId and page.url != '/' and page.lang == "en" -%}
114
+ <div class="col-md-9 mx-auto">
115
+ <div class="row">
116
+ {%- endif -%}
117
+ <div class="col-md-6 order-0">
118
+ {%- if homeData.HOW_TO_CONTENT.YoutubeVideoUrl.size > 0 -%}
119
+ <div class="how-to-video-wrapper">
120
+ {% assign video_url = homeData.HOW_TO_CONTENT.YoutubeVideoUrl %}
121
+ {% assign video_id = "" %}
122
+ {% if video_url contains "youtu.be/" %}
123
+ {% assign parts = video_url | split: "/" %}
124
+ {% assign video_id = parts[3] %}
125
+ {% elsif video_url contains "youtube.com/watch" %}
126
+ {% assign params = video_url | split: "?" | last | split: "&" %}
127
+ {% for param in params %}
128
+ {% if param contains "v=" %}
129
+ {% assign video_id = param | split: "=" | last %}
130
+ {% endif %}
131
+ {% endfor %}
132
+ {% endif %}
133
+
134
+ {%- if site.monumetricId -%}
135
+ <div class="how-to-video h-100 w-100" data-videoid="{{video_id}}">
136
+ <img class="youtubeVideoPlayer" width="100%" height="100%" id="thumbnail-img" alt="thumbnail-img" />
137
+ <div class="youtube-play-btn-wrapper">
138
+ <button class="play-btn btn btn-primary" onClick="loadVideo()">►</button>
139
+ </div>
140
+ </div>
141
+ {%- else -%}
142
+ <div class="how-to-video h-100 w-100" data-videoid="{{video_id}}">
143
+ <img class="youtubeVideoPlayer" width="100%" height="100%" id="thumbnail-img" alt="thumbnail-img" />
144
+ <div class="youtube-play-btn-wrapper">
145
+ <button class="play-btn btn btn-primary" onClick="loadVideo()">►</button>
146
+ </div>
147
+ </div>
148
+ {%- endif -%}
149
+ </div>
150
+ {%- else -%}
151
+ <div class="how-to-img-wrapper">
152
+ <img class="how-to-leftimg" height="180px" width="300px" src="{{homeData.HOW_TO_CONTENT.logoImageUrl}}"
153
+ loading="lazy" alt="{{homeData.HOW_TO_CONTENT.logoImageAlt | default: 'how to image' }}" {%- if
154
+ site.crossorigin -%} crossorigin {%- endif -%} />
155
+ </div>
156
+ {%- endif -%}
157
+ </div>
158
+ <div class="col-md-6 order-1">
159
+ <div class="how-to-right">
160
+ <h3 class="how-to-title text-left">
161
+ {{homeData.HOW_TO_CONTENT.heading | replace: "$variable",
162
+ page.value}}
163
+ </h3>
164
+ <ol class="how-to-list">
165
+ {% for data in homeData.HOW_TO_CONTENT.steps %}
166
+
167
+ <li id="step{{forloop.index}}" class="how-to-list-item">
168
+ <span>{{forloop.index}}.</span>{{data | replace:
169
+ "$variable", page.value}}
170
+ </li>
171
+ {% endfor %}
172
+ </ol>
173
+ </div>
174
+ </div>
175
+ {%- if site.monumetricId and page.url != '/' and page.lang == 'en'
176
+ -%}
177
+ </div>
178
+ </div>
179
+ {%- endif -%}
180
+ </div>
181
+ </div>
182
+ </section>
183
+ {%- endif -%} {%- assign showFaqs = true -%} {%- for item in site.noFaqsList
184
+ -%} {%- if item == page.lang -%} {%- assign showFaqs = false -%} {%- break
185
+ -%} {%- else -%} {%- assign showFaqs = true -%} {%- endif -%} {%- endfor -%}
186
+ {%- if showFaqs == true -%} {%- if homeData.FAQ -%}
187
+ <section class="faq-section">
188
+ <div class="container">
189
+ <div class="row">
190
+ <div class="col-md-8 mx-auto">
191
+ <div class="faq">
192
+ {%- if homeData.FAQ.size>0 -%}
193
+ <h3 class="feature-h1 text-center mb-4">
194
+ {{homeData.faqheading | default: 'Frequently Asked Questions'}}
195
+ </h3>
196
+ {%- endif -%}
197
+ <ul class="list-unstyled">
198
+ {% for data in homeData.FAQ %}
199
+ <li>
200
+ <h3 class="faq-question" itemprop="name">
201
+ {{data.question | replace: "$variable", page.value}}<em style="transform: rotate(-135deg)">
202
+ <i></i></em>
203
+ </h3>
204
+ <div style="display: block">
205
+ <p class="faq-answer" itemprop="text">
206
+ {{data.answer | replace: "$variable", page.value}}
207
+ </p>
208
+ </div>
209
+ </li>
210
+ {% endfor %}
211
+ </ul>
212
+ </div>
213
+ </div>
214
+ </div>
215
+ </div>
216
+ </section>
217
+ {%- endif -%} {%- endif -%} {%- include share/socialshare.html -%} {%-
218
+ include Rating/rating.html -%}
219
+ {%- if homeData.infographics.size > 0 -%}
220
+ {%- include /appscms/infographics/infographics.html -%}
221
+ {%- endif -%}
222
+
223
+ {%- if homeData.USPS -%} {%- include
224
+ /Usp/usp.html -%} {%- endif -%} {%- if homeData.display_formats -%}
225
+ <div class="container file-detail-table">
226
+ {%- include fileformat/fileformatdetail.html -%}
227
+ </div>
228
+ {%- endif -%} {%- if homeData.compare_formats -%}
229
+ <div class="container compare-table">
230
+ {%- include fileformat/comparisonfiles.html -%}
231
+ </div>
232
+ {%- endif -%} {%- assign langen = "en" -%} {%- if
233
+ site.data[folder][langen][file].categories -%} {%- assign categories =
234
+ site.data[folder][langen][file].categories -%} {%- else -%} {%- assign
235
+ categories = page.categories -%} {%- endif -%} {%- if
236
+ site.data[folder][langen][file].tags -%} {%- assign tags =
237
+ site.data[folder][langen][file].tags -%} {%- else -%} {%- assign tags =
238
+ page.tags -%} {%- endif -%} {%- if homeData.posts.size > 0 -%} {%- include
239
+ customblog/pageRelatedPosts.html -%} {%- else -%} {%- if categories.size > 0
240
+ or tags.size > 0 -%} {%- include section/related_categories_post.html -%}
241
+ {%- else -%} {%- include section/recent_posts.html -%} {%- endif -%} {%-
242
+ endif -%} {%- if site.customblogdata -%} {%- if categories.size > 0 or
243
+ tags.size > 0 -%} {%- include customblog/relatedposts.html -%} {%- else -%}
244
+ {%- include customblog/recentposts.html -%} {%- endif -%} {%- endif -%} {%-
245
+ if homeData.author.size > 0 -%} {%- include
246
+ featurePageAuthors/featurePageAuthors.html -%} {%- endif -%} {%- include
247
+ footer/index.html -%} {%- if site.customCode -%} {%- include customCode.html
248
+ -%} {%- endif -%} {%- include script.html -%}
249
+ </body>
250
+
251
+ {%- if homeData.HOW_TO_CONTENT.YoutubeVideoUrl.size > 0 -%}
252
+ <script>
253
+ let videoContainer = document.querySelector('.how-to-video');
254
+ let thumbnail = document.getElementById('thumbnail-img');
255
+ let videoId = videoContainer.getAttribute("data-videoid")
256
+ let thumbnailUrl = 'https://img.youtube.com/vi/' + videoId + '/maxresdefault.jpg';
257
+ console.log(videoId)
258
+
259
+ // Function to load video
260
+ function loadVideo() {
261
+ videoContainer.innerHTML = '<iframe loading="lazy" class="youtubeVideoPlayer" width="100%" height="100%" src="https://www.youtube.com/embed/' + videoId + '?autoplay=1&mute=1" allowfullscreen></iframe>';
262
+ }
263
+ // Function to handle lazy loading of the thumbnail
264
+ function lazyLoadThumbnail(entries, observer) {
265
+ entries.forEach(entry => {
266
+ if (entry.isIntersecting) {
267
+ // Load thumbnail when it becomes visible
268
+ thumbnail.src = thumbnailUrl;
269
+ // Stop observing once loaded
270
+ observer.unobserve(entry.target);
271
+ }
272
+ });
273
+ }
274
+ // Set up the Intersection Observer
275
+ var observer = new IntersectionObserver(lazyLoadThumbnail, { threshold: 0.1 });
276
+ observer.observe(thumbnail);
277
+ // Optionally, you can add an event listener to trigger video loading on click or other interactions
278
+ thumbnail.addEventListener('click', loadVideo);
279
+ </script>
280
+ {%- endif -%}
281
+
282
282
  </html>
@@ -1,33 +1,33 @@
1
- <!DOCTYPE html>
2
- <html>
3
- {% include head/index.html %}
4
-
5
- <body>
6
- {% include header/index.html %}
7
- <div class="appscms-sidebar-left"></div>
8
- <div class="appscms-sidebar-right"></div>
9
- <div class="flex-container mb-1">
10
- <div class="flex-class py-5">
11
- <div class="d-flex justify-content-center align-items-center"><span class="fHhdVc">
12
- <div class="div-cont feature-img mr-2">
13
- <img class="home-img" src="" alt="" {%- if site.crossorigin -%} crossorigin {%- endif -%}>
14
- </div>
15
- </span>
16
- <h1 class="home-top-h1"></h1>
17
- </div>
18
- <h2 class="home-top-h2"></h2>
19
- </div>
20
- </div>
21
-
22
- <div>
23
- {{content}}
24
- </div>
25
-
26
- {% include footer/index.html %}
27
- {% include script.html %}
28
-
29
- <script defer src="/assets/js/homeResult.js" data-foldername="{{page.folderName}}"
30
- data-lang="{{page.lang}}"></script>
31
- </body>
32
-
1
+ <!DOCTYPE html>
2
+ <html>
3
+ {% include head/index.html %}
4
+
5
+ <body>
6
+ {% include header/index.html %}
7
+ <div class="appscms-sidebar-left"></div>
8
+ <div class="appscms-sidebar-right"></div>
9
+ <div class="flex-container mb-1">
10
+ <div class="flex-class py-5">
11
+ <div class="d-flex justify-content-center align-items-center"><span class="fHhdVc">
12
+ <div class="div-cont feature-img mr-2">
13
+ <img class="home-img" src="" alt="" {%- if site.crossorigin -%} crossorigin {%- endif -%}>
14
+ </div>
15
+ </span>
16
+ <h1 class="home-top-h1"></h1>
17
+ </div>
18
+ <h2 class="home-top-h2"></h2>
19
+ </div>
20
+ </div>
21
+
22
+ <div>
23
+ {{content}}
24
+ </div>
25
+
26
+ {% include footer/index.html %}
27
+ {% include script.html %}
28
+
29
+ <script defer src="/assets/js/homeResult.js" data-foldername="{{page.folderName}}"
30
+ data-lang="{{page.lang}}"></script>
31
+ </body>
32
+
33
33
  </html>