appscms-tools-theme 4.6.0 → 4.6.1
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.
- checksums.yaml +4 -4
- data/_data/about/en/about.json +16 -16
- data/_data/blog/nav.json +14 -14
- data/_data/feature/en/batch-conversion.json +192 -192
- data/_data/feature/en/compress-pdf.json +305 -305
- data/_data/feature/en/devtools.json +321 -321
- data/_data/feature/en/face-detection.json +156 -156
- data/_data/feature/en/split-pdf.json +221 -221
- data/_data/feature/en/theframe.json +160 -160
- data/_data/footer/en/data.json +2 -2
- data/_data/header/en/data.json +412 -412
- data/_data/home/en/en.json +324 -324
- data/_data/home/en/posters.json +322 -322
- data/_includes/appscms/customblog/contenttool-recent-posts.html +94 -94
- data/_includes/appscms/customblog/pageRelatedPosts.html +62 -62
- data/_includes/appscms/customblog/recentposts.html +67 -67
- data/_includes/appscms/customblog/relatedBlogs.html +82 -82
- data/_includes/appscms/customblog/relatedposts.html +193 -193
- data/_includes/appscms/extras/appscms-postbox.html +57 -57
- data/_includes/appscms/featurePageAuthors/featurePageAuthors.html +85 -85
- data/_includes/appscms/head/bloghead.html +128 -128
- data/_includes/appscms/headings/contenttool-headings.html +33 -33
- data/_includes/appscms/headings/devtool-headings.html +38 -38
- data/_includes/appscms/home/contenttool-feature-boxes.html +19 -19
- data/_includes/appscms/home/devtool-feature-boxes.html +70 -70
- data/_includes/appscms/infographics/infographics.html +166 -166
- data/_includes/appscms/loaders/loader.html +4 -4
- data/_includes/appscms/navbars/devtool-navbar.html +50 -50
- data/_includes/appscms/navbars/devtool-toolbar.html +100 -100
- data/_includes/appscms/recent-posts/recent_posts.html +90 -90
- data/_includes/appscms/recent-posts/related_categories_post.html +194 -194
- data/_includes/appscms/searchbar/devtool-searchbar.html +63 -63
- data/_includes/appscms/usp/usp.html +90 -90
- data/_includes/author_bio.html +41 -41
- data/_includes/authorpagehead/index.html +47 -47
- data/_includes/authors/authors.html +39 -39
- data/_includes/batch-conversion.html +141 -141
- data/_includes/bookmark.html +6 -6
- data/_includes/cssfile/links.html +54 -54
- data/_includes/custom-head.html +138 -138
- data/_includes/customCode.html +1 -1
- data/_includes/customScripts.html +1 -1
- data/_includes/customblog/pageRelatedPosts.html +87 -87
- data/_includes/customblog/recentposts.html +67 -67
- data/_includes/customblog/relatedBlogs.html +86 -86
- data/_includes/customblog/relatedposts.html +201 -201
- data/_includes/dropdown/langdropdown.html +32 -32
- data/_includes/feature.html +39 -39
- data/_includes/featurePageAuthors/featurePageAuthors.html +101 -101
- data/_includes/footer/index.html +537 -537
- data/_includes/google-analytics.html +32 -32
- data/_includes/head/index.html +623 -623
- data/_includes/header/blogHeader.html +34 -34
- data/_includes/header/index.html +192 -192
- data/_includes/infographics/infographics.html +241 -241
- data/_includes/paginationBlogPage.html +70 -70
- data/_includes/postbox.html +65 -65
- data/_includes/script.html +493 -493
- data/_includes/section/count.html +32 -32
- data/_includes/section/recent_posts.html +94 -94
- data/_includes/section/related_categories_post.html +196 -196
- data/_includes/share/socialshare.html +21 -21
- data/_includes/userTracking.html +14 -14
- data/_layouts/aboutUs.html +175 -175
- data/_layouts/allAuthors.html +131 -131
- data/_layouts/appscms-about.html +163 -163
- data/_layouts/appscms-audio.html +33 -33
- data/_layouts/appscms-author.html +436 -436
- data/_layouts/appscms-authors.html +145 -145
- data/_layouts/appscms-batch.html +141 -141
- data/_layouts/appscms-calculator.html +93 -93
- data/_layouts/appscms-categories.html +26 -26
- data/_layouts/appscms-contact.html +132 -132
- data/_layouts/appscms-disclaimer.html +124 -124
- data/_layouts/appscms-download.html +289 -289
- data/_layouts/appscms-feature-result.html +96 -96
- data/_layouts/appscms-help.html +25 -25
- data/_layouts/appscms-imagekit.html +96 -96
- data/_layouts/appscms-post.html +243 -243
- data/_layouts/appscms-privacy-policy.html +781 -781
- data/_layouts/appscms-terms-and-conditions.html +646 -646
- data/_layouts/appscms-video.html +33 -33
- data/_layouts/audio.html +33 -33
- data/_layouts/author.html +409 -409
- data/_layouts/batch.html +177 -177
- data/_layouts/blog-1.html +116 -116
- data/_layouts/blog.html +131 -131
- data/_layouts/calculator.html +99 -99
- data/_layouts/contenttool-feature.html +45 -45
- data/_layouts/contenttool-home.html +53 -53
- data/_layouts/devtool-blog.html +132 -132
- data/_layouts/devtool-feature.html +54 -54
- data/_layouts/devtool-home.html +53 -53
- data/_layouts/devtools.html +57 -57
- data/_layouts/feature-1.html +406 -406
- data/_layouts/feature.html +351 -351
- data/_layouts/featureResultPage.html +82 -82
- data/_layouts/frame.html +222 -222
- data/_layouts/home.html +281 -281
- data/_layouts/homeResultPage.html +32 -32
- data/_layouts/imagekit.html +308 -308
- data/_layouts/photo-effects-home.html +190 -190
- data/_layouts/post.html +233 -233
- data/assets/app.js +75 -75
- data/assets/css/appscms-blog.css +505 -505
- data/assets/css/appscms-contenttool.css +1384 -1384
- data/assets/css/appscms-home.css +5 -5
- data/assets/css/appscms-imagekit.css +855 -855
- data/assets/css/appscms-theme.css +59 -59
- data/assets/css/appscms-variables.css +19 -19
- data/assets/css/blog.css +510 -510
- data/assets/css/calculators.css +46 -46
- data/assets/css/devtool-main.css +1350 -1350
- data/assets/css/devtools.css +105 -105
- data/assets/css/feature-1.css +293 -293
- data/assets/css/imagekit copy.css +848 -848
- data/assets/css/imagekit.css +848 -848
- data/assets/css/tools.css +1847 -1847
- data/assets/images/close-button.svg +31 -31
- data/assets/images/digipaint.svg +6 -6
- data/assets/images/logo.svg +2 -2
- data/assets/images/manthink.svg +3552 -3552
- data/assets/images/search-icon.svg +2 -2
- data/assets/js/batch.js +219 -219
- data/assets/js/devtools.js +81 -81
- data/assets/js/sharePage.js +65 -65
- data/assets/js/usageTracking.js +143 -143
- data/assets/js/usageTrackingEvents.js +6 -6
- data/assets/js/webvitals.js +4 -4
- 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>
|