RubyGems - appscms-tools-theme - Versions diffs - 4.5.5 → 4.5.6 - Mend

appscms-tools-theme 4.5.5 → 4.5.6

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 (129) hide show

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 +356 -356
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 -160
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-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 +256 -256
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/allAuthors.html CHANGED Viewed

@@ -1,131 +1,131 @@
-<!DOCTYPE html>
-<html lang="en">
-  {% include authorpagehead/index.html %}
-  <style>
-    body {
-      font-family: "Font Awesome 5 Free" !important;
-    }
-    .authors-heading {
-      font-size: 50px;
-      font-weight: 900;
-    }
-    .authors-info {
-      padding: 32px;
-      display: flex;
-      flex-direction: column;
-      justify-content: center;
-      text-align: center;
-      width: 100%;
-    }
-    .authors-info .authors-image img {
-      display: inline-block;
-      width: 200px;
-      height: 200px;
-      padding: 8px;
-      border: 5px solid #eee;
-      border-radius: 50%;
-      object-fit: cover;
-      user-select: none;
-    }
-    .authors-info .authors-name {
-      margin: 1rem;
-      font-size: 28px;
-      color: #000;
-      font-weight: 900;
-    }
-    .authors-info .authors-bio {
-      color: #121315;
-      font-size: 16px;
-    }
-    .authors-posts-count {
-      font-size: 24px;
-      font-weight: 400;
-      color: #000 !important;
-      text-decoration: underline !important;
-    }
-  </style>
-  <body>
-    {%- include header/blogHeader.html -%}
-    <section class="authors-list" style="margin-top: 100px">
-      <div class="container">
-        <div class="row">
-          <div class="col-md-12">
-            <h1 class="mb-4 text-center authors-heading">Our Authors</h1>
-            <div class="row">
-              {% assign minCommonAuthor = 1 %} {% assign sameAuthorCount = 0 %}
-              {% assign posts = site.posts | where_exp:"post","post.url !=
-              page.url" %} {% assign seen_authors = '' %} {% for post in
-              site.posts %} {% unless seen_authors contains post.author %} {%
-              assign seen_authors = seen_authors | append: post.author | append:
-              ',' %}
-              <!-- Render your author here -->
-              {%- include /authors/authors.html -%} {%- if authorName contains
-              authorName -%}
-              <div class="col-md-4 mb-4">
-                <div class="authors-info">
-                  <a
-                    class="authors-image"
-                    href="/authors/{{authorName | downcase  | replace: ' ' , '-' }}"
-                  >
-                    <img
-                      loading="lazy"
-                      src="{{image}}"
-                      alt="{{ authorName }}"
-                    />
-                  </a>
-                  <a
-                    class="authors-name"
-                    href="/authors/{{authorName | downcase  | replace: ' ' , '-' }}"
-                    >{{authorName | capitalize }}</a
-                  >
-                  <a href="/blog/" class="authors-posts-count"
-                    >{{ site.posts | where: 'author', post.author | size }}
-                    Posts</a
-                  >
-                  <p class="authors-bio mt-3">{{bio}}</p>
-                </div>
-              </div>
-              {%- endif -%} {% endunless %} {% endfor %} {% for post in posts %}
-              {%- include /authors/authors.html -%} {%- if post.author contains
-              authorName -%}
-              <div class="d-none col-md-4 mb-4">
-                <div class="authors-info">
-                  <a
-                    class="authors-image"
-                    href="/authors/{{authorName | downcase  | replace: ' ' , '-' }}"
-                  >
-                    <img
-                      loading="lazy"
-                      src="{{image}}"
-                      alt="{{ authorName }}"
-                    />
-                  </a>
-                  <a
-                    class="authors-name"
-                    href="/authors/{{authorName | downcase  | replace: ' ' , '-' }}"
-                    >{{authorName | capitalize }}</a
-                  >
-                  <a href="/blog/" class="authors-posts-count"
-                    >{{ site.posts | where: 'author', post.author | size }}
-                    Posts</a
-                  >
-                  <p class="authors-bio mt-3">{{bio}}</p>
-                </div>
-              </div>
-              {%- endif -%} {% endfor %}
-            </div>
-          </div>
-        </div>
-      </div>
-      {% include section/count.html %}
-    </section>
-    {% include script.html %}
-  </body>
-</html>
+<!DOCTYPE html>
+<html lang="en">
+  {% include authorpagehead/index.html %}
+  <style>
+    body {
+      font-family: "Font Awesome 5 Free" !important;
+    }
+    .authors-heading {
+      font-size: 50px;
+      font-weight: 900;
+    }
+    .authors-info {
+      padding: 32px;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      text-align: center;
+      width: 100%;
+    }
+    .authors-info .authors-image img {
+      display: inline-block;
+      width: 200px;
+      height: 200px;
+      padding: 8px;
+      border: 5px solid #eee;
+      border-radius: 50%;
+      object-fit: cover;
+      user-select: none;
+    }
+    .authors-info .authors-name {
+      margin: 1rem;
+      font-size: 28px;
+      color: #000;
+      font-weight: 900;
+    }
+    .authors-info .authors-bio {
+      color: #121315;
+      font-size: 16px;
+    }
+    .authors-posts-count {
+      font-size: 24px;
+      font-weight: 400;
+      color: #000 !important;
+      text-decoration: underline !important;
+    }
+  </style>
+  <body>
+    {%- include header/blogHeader.html -%}
+    <section class="authors-list" style="margin-top: 100px">
+      <div class="container">
+        <div class="row">
+          <div class="col-md-12">
+            <h1 class="mb-4 text-center authors-heading">Our Authors</h1>
+            <div class="row">
+              {% assign minCommonAuthor = 1 %} {% assign sameAuthorCount = 0 %}
+              {% assign posts = site.posts | where_exp:"post","post.url !=
+              page.url" %} {% assign seen_authors = '' %} {% for post in
+              site.posts %} {% unless seen_authors contains post.author %} {%
+              assign seen_authors = seen_authors | append: post.author | append:
+              ',' %}
+              <!-- Render your author here -->
+              {%- include /authors/authors.html -%} {%- if authorName contains
+              authorName -%}
+              <div class="col-md-4 mb-4">
+                <div class="authors-info">
+                  <a
+                    class="authors-image"
+                    href="/authors/{{authorName | downcase  | replace: ' ' , '-' }}"
+                  >
+                    <img
+                      loading="lazy"
+                      src="{{image}}"
+                      alt="{{ authorName }}"
+                    />
+                  </a>
+                  <a
+                    class="authors-name"
+                    href="/authors/{{authorName | downcase  | replace: ' ' , '-' }}"
+                    >{{authorName | capitalize }}</a
+                  >
+                  <a href="/blog/" class="authors-posts-count"
+                    >{{ site.posts | where: 'author', post.author | size }}
+                    Posts</a
+                  >
+                  <p class="authors-bio mt-3">{{bio}}</p>
+                </div>
+              </div>
+              {%- endif -%} {% endunless %} {% endfor %} {% for post in posts %}
+              {%- include /authors/authors.html -%} {%- if post.author contains
+              authorName -%}
+              <div class="d-none col-md-4 mb-4">
+                <div class="authors-info">
+                  <a
+                    class="authors-image"
+                    href="/authors/{{authorName | downcase  | replace: ' ' , '-' }}"
+                  >
+                    <img
+                      loading="lazy"
+                      src="{{image}}"
+                      alt="{{ authorName }}"
+                    />
+                  </a>
+                  <a
+                    class="authors-name"
+                    href="/authors/{{authorName | downcase  | replace: ' ' , '-' }}"
+                    >{{authorName | capitalize }}</a
+                  >
+                  <a href="/blog/" class="authors-posts-count"
+                    >{{ site.posts | where: 'author', post.author | size }}
+                    Posts</a
+                  >
+                  <p class="authors-bio mt-3">{{bio}}</p>
+                </div>
+              </div>
+              {%- endif -%} {% endfor %}
+            </div>
+          </div>
+        </div>
+      </div>
+      {% include section/count.html %}
+    </section>
+    {% include script.html %}
+  </body>
+</html>

data/_layouts/appscms-about.html CHANGED Viewed

@@ -1,163 +1,163 @@
-{% assign file = page.fileName %} {% assign lang = page.lang %} {% assign folder
-= page.folderName %} {% assign aboutData = site.data[folder][lang][file] %}
-<!DOCTYPE html>
-<html lang="{{aboutData.htmlLangAtt}}">
-  {%- include appscms/head/head.html -%}
-  <body>
-    {%- include appscms/navbars/navbar.html -%} {%- include
-    appscms/navbars/toolbar.html -%}
-    <div class="container py-4 about_layout">
-      {%- if site.monumetricId and page.url != '/' and page.lang == "en" -%}
-      <div class="row">
-        <div class="col-md-9 mx-auto">
-          {%- endif -%}
-          <h1 class="about-h1 py-2">About us</h1>
-          <h2 class="about-h2">Welcome to {{ page.companyName}}</h2>
-          <p class="about-para pt-4 text-left">
-            We are here to help you. Ping us your queries at care@{{
-            page.companyName}}.{{page.domain}}
-          </p>
-          <div>{{content}}</div>
-          {%- if site.monumetricId and page.url != '/' and page.lang == "en" -%}
-        </div>
-      </div>
-      {%- endif -%}
-    </div>
-    {% assign posts = site.posts | where_exp:"post","post.url != page.url" %} {%
-    assign authors = "" | split: "," %} {% for post in site.posts %} {% if
-    post.author %} {% unless authors contains post.author %} {% assign authors =
-    authors | push: post.author %} {% endunless %} {% endif %} {% endfor %}
-    <div class="container mt-4 mb-5">
-      <div class="row px-0">
-        <div class="col-md-4 my-4">
-          <img
-            class="feature-card-img"
-            src="/assets/images/lightbulb.svg"
-            loading="lazy"
-            height="48px"
-            width="48px"
-            alt="{{data.header}}"
-            {%-
-            if
-            site.crossorigin
-            -%}
-            crossorigin
-            {%-
-            endif
-            -%}
-          />
-          <div class="feature-card-title">Features</div>
-          <div class="feature-card-desc">
-            Our website currently has
-            <a class="highlight_style" href="{{site.url}}/sitemap.xml"
-              >{{ site.pages | size }} features</a
-            >
-          </div>
-        </div>
-        {%- if site.internationalizationall -%}
-        <div class="col-md-4 my-4">
-          <img
-            class="feature-card-img"
-            src="/assets/images/lightbulb.svg"
-            loading="lazy"
-            height="48px"
-            width="48px"
-            alt="{{data.header}}"
-            {%-
-            if
-            site.crossorigin
-            -%}
-            crossorigin
-            {%-
-            endif
-            -%}
-          />
-          <div class="feature-card-title">Languages Supported</div>
-          <div class="feature-card-desc">
-            Our website currently supports 22 languages.
-          </div>
-        </div>
-        {%- endif -%}
-        <div class="col-md-4 my-4">
-          <img
-            class="feature-card-img"
-            src="/assets/images/lightbulb.svg"
-            loading="lazy"
-            height="48px"
-            width="48px"
-            alt="{{data.header}}"
-            {%-
-            if
-            site.crossorigin
-            -%}
-            crossorigin
-            {%-
-            endif
-            -%}
-          />
-          <div class="feature-card-title">Blog Posts</div>
-          <div class="feature-card-desc">
-            We currently have
-            <a class="highlight_style" href="/blog/"
-              >{{ site.posts | size }} blog posts</a
-            >
-            on our website.
-          </div>
-        </div>
-        <div class="col-md-4 my-4">
-          <img
-            class="feature-card-img"
-            src="/assets/images/lightbulb.svg"
-            loading="lazy"
-            height="48px"
-            width="48px"
-            alt="{{data.header}}"
-            {%-
-            if
-            site.crossorigin
-            -%}
-            crossorigin
-            {%-
-            endif
-            -%}
-          />
-          <div class="feature-card-title">Authors</div>
-          <div class="feature-card-desc">
-            We have
-            <a class="highlight_style" href="/authors">
-              {{ authors.size }} authors
-            </a>
-            on our website
-          </div>
-        </div>
-        <div class="col-md-4 my-4">
-          <img
-            class="feature-card-img"
-            src="/assets/images/lightbulb.svg"
-            loading="lazy"
-            height="48px"
-            width="48px"
-            alt="{{data.header}}"
-            {%-
-            if
-            site.crossorigin
-            -%}
-            crossorigin
-            {%-
-            endif
-            -%}
-          />
-          <div class="feature-card-title">Total Visitors</div>
-          <div id="visits" class="feature-card-desc">
-            {{site.totalVisitors}}
-          </div>
-        </div>
-      </div>
-    </div>
-    {% include appscms/footer/static-footer.html %} {% include script.html %}
-  </body>
-</html>
+{% assign file = page.fileName %} {% assign lang = page.lang %} {% assign folder
+= page.folderName %} {% assign aboutData = site.data[folder][lang][file] %}
+<!DOCTYPE html>
+<html lang="{{aboutData.htmlLangAtt}}">
+  {%- include appscms/head/head.html -%}
+  <body>
+    {%- include appscms/navbars/navbar.html -%} {%- include
+    appscms/navbars/toolbar.html -%}
+    <div class="container py-4 about_layout">
+      {%- if site.monumetricId and page.url != '/' and page.lang == "en" -%}
+      <div class="row">
+        <div class="col-md-9 mx-auto">
+          {%- endif -%}
+          <h1 class="about-h1 py-2">About us</h1>
+          <h2 class="about-h2">Welcome to {{ page.companyName}}</h2>
+          <p class="about-para pt-4 text-left">
+            We are here to help you. Ping us your queries at care@{{
+            page.companyName}}.{{page.domain}}
+          </p>
+          <div>{{content}}</div>
+          {%- if site.monumetricId and page.url != '/' and page.lang == "en" -%}
+        </div>
+      </div>
+      {%- endif -%}
+    </div>
+    {% assign posts = site.posts | where_exp:"post","post.url != page.url" %} {%
+    assign authors = "" | split: "," %} {% for post in site.posts %} {% if
+    post.author %} {% unless authors contains post.author %} {% assign authors =
+    authors | push: post.author %} {% endunless %} {% endif %} {% endfor %}
+    <div class="container mt-4 mb-5">
+      <div class="row px-0">
+        <div class="col-md-4 my-4">
+          <img
+            class="feature-card-img"
+            src="/assets/images/lightbulb.svg"
+            loading="lazy"
+            height="48px"
+            width="48px"
+            alt="{{data.header}}"
+            {%-
+            if
+            site.crossorigin
+            -%}
+            crossorigin
+            {%-
+            endif
+            -%}
+          />
+          <div class="feature-card-title">Features</div>
+          <div class="feature-card-desc">
+            Our website currently has
+            <a class="highlight_style" href="{{site.url}}/sitemap.xml"
+              >{{ site.pages | size }} features</a
+            >
+          </div>
+        </div>
+        {%- if site.internationalizationall -%}
+        <div class="col-md-4 my-4">
+          <img
+            class="feature-card-img"
+            src="/assets/images/lightbulb.svg"
+            loading="lazy"
+            height="48px"
+            width="48px"
+            alt="{{data.header}}"
+            {%-
+            if
+            site.crossorigin
+            -%}
+            crossorigin
+            {%-
+            endif
+            -%}
+          />
+          <div class="feature-card-title">Languages Supported</div>
+          <div class="feature-card-desc">
+            Our website currently supports 22 languages.
+          </div>
+        </div>
+        {%- endif -%}
+        <div class="col-md-4 my-4">
+          <img
+            class="feature-card-img"
+            src="/assets/images/lightbulb.svg"
+            loading="lazy"
+            height="48px"
+            width="48px"
+            alt="{{data.header}}"
+            {%-
+            if
+            site.crossorigin
+            -%}
+            crossorigin
+            {%-
+            endif
+            -%}
+          />
+          <div class="feature-card-title">Blog Posts</div>
+          <div class="feature-card-desc">
+            We currently have
+            <a class="highlight_style" href="/blog/"
+              >{{ site.posts | size }} blog posts</a
+            >
+            on our website.
+          </div>
+        </div>
+        <div class="col-md-4 my-4">
+          <img
+            class="feature-card-img"
+            src="/assets/images/lightbulb.svg"
+            loading="lazy"
+            height="48px"
+            width="48px"
+            alt="{{data.header}}"
+            {%-
+            if
+            site.crossorigin
+            -%}
+            crossorigin
+            {%-
+            endif
+            -%}
+          />
+          <div class="feature-card-title">Authors</div>
+          <div class="feature-card-desc">
+            We have
+            <a class="highlight_style" href="/authors">
+              {{ authors.size }} authors
+            </a>
+            on our website
+          </div>
+        </div>
+        <div class="col-md-4 my-4">
+          <img
+            class="feature-card-img"
+            src="/assets/images/lightbulb.svg"
+            loading="lazy"
+            height="48px"
+            width="48px"
+            alt="{{data.header}}"
+            {%-
+            if
+            site.crossorigin
+            -%}
+            crossorigin
+            {%-
+            endif
+            -%}
+          />
+          <div class="feature-card-title">Total Visitors</div>
+          <div id="visits" class="feature-card-desc">
+            {{site.totalVisitors}}
+          </div>
+        </div>
+      </div>
+    </div>
+    {% include appscms/footer/static-footer.html %} {% include script.html %}
+  </body>
+</html>

data/_layouts/appscms-audio.html CHANGED Viewed

@@ -1,33 +1,33 @@
----
-layout: appscms-feature
----
-{%- assign fileData = site.data[page.folderName][page.lang][page.fileName] -%}
-<div class="container pt-5 mt-5">
-  <div class="row">
-    <div class="col-md-6 mb-5" id="left-section" data-format="{{page.format}}">
-      <div>
-        {%- assign h1 = fileData.H1 | replace: "$variable", page.value -%}
-        <h1 class="audio-h1">
-          {%- for word in h1-%} {%- if forloop.first == true -%} {{word |
-          capitalize }} {%- else -%} {{word}} {%- endif -%} {%- endfor -%}
-        </h1>
-      </div>
-      {%- assign h2 = fileData.H2 | replace: "$variable", page.value -%}
-      <div>
-        <h2 class="audio-h2">
-          {%- for word in h2 -%} {%- if forloop.first == true -%} {{word |
-          capitalize }} {%- else -%} {{word}} {%- endif -%} {%- endfor -%}
-        </h2>
-      </div>
-      <div class="d-flex justify-content-left mt-4">
-        <button class="upload-redirect">Upload Your Audio</button>
-      </div>
-    </div>
-    <div class="col-md-6">
-      <div class="right-section mb-5">
-        <img src="/assets/images/audio-upload.svg" alt="alt" />
-      </div>
-    </div>
-  </div>
-</div>
+---
+layout: appscms-feature
+---
+{%- assign fileData = site.data[page.folderName][page.lang][page.fileName] -%}
+<div class="container pt-5 mt-5">
+  <div class="row">
+    <div class="col-md-6 mb-5" id="left-section" data-format="{{page.format}}">
+      <div>
+        {%- assign h1 = fileData.H1 | replace: "$variable", page.value -%}
+        <h1 class="audio-h1">
+          {%- for word in h1-%} {%- if forloop.first == true -%} {{word |
+          capitalize }} {%- else -%} {{word}} {%- endif -%} {%- endfor -%}
+        </h1>
+      </div>
+      {%- assign h2 = fileData.H2 | replace: "$variable", page.value -%}
+      <div>
+        <h2 class="audio-h2">
+          {%- for word in h2 -%} {%- if forloop.first == true -%} {{word |
+          capitalize }} {%- else -%} {{word}} {%- endif -%} {%- endfor -%}
+        </h2>
+      </div>
+      <div class="d-flex justify-content-left mt-4">
+        <button class="upload-redirect">Upload Your Audio</button>
+      </div>
+    </div>
+    <div class="col-md-6">
+      <div class="right-section mb-5">
+        <img src="/assets/images/audio-upload.svg" alt="alt" />
+      </div>
+    </div>
+  </div>
+</div>