appscms-tools-theme 5.2.5 → 5.2.7

data/_includes/appscms/extras/ratings.html

@@ -0,0 +1,349 @@
+{%- if page.tool -%} {%- assign tool = page.tool -%} {%- assign data =
+site.data.rating.rating.tools -%} {%- for item in data -%} {%- if item.name
+==tool -%} {%- assign rating = item.rating -%} {%- assign votes = item.votes -%}
+{%- endif -%} {%- endfor -%}
+
+<div class="container">
+  <div class="row justify-content-center">
+    <div class="col-md-10 pt-5 text-center">
+      <div class="rating-tool">
+        <img
+          id="rating-img"
+          loading="lazy"
+          src="/assets/images/rating.png"
+          alt="rating-img"
+        />
+
+        <div class="rating-header">
+          <h2 class="rating-text">Rate this tool</h2>
+          <p class="rating-description">
+            Your feedback helps us improve our services
+          </p>
+        </div>
+        <div class="rating-stars">
+          <svg
+            class="rating-star"
+            width="26"
+            height="26"
+            viewBox="0 0 56 53"
+            fill="gray"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M30.8532 3.54509C29.9551 0.781158 26.0449 0.781146 25.1468 3.54508L20.538 17.7295C20.4042 18.1415 20.0202 18.4205 19.587 18.4205H4.67262C1.76645 18.4205 0.558112 22.1393 2.90926 23.8475L14.9752 32.614C15.3257 32.8686 15.4724 33.32 15.3385 33.732L10.7297 47.9164C9.83166 50.6803 12.9951 52.9787 15.3462 51.2705L27.4122 42.5041C27.7627 42.2494 28.2373 42.2494 28.5878 42.5041L40.6538 51.2705C43.0049 52.9787 46.1683 50.6803 45.2703 47.9164L40.6615 33.732C40.5276 33.32 40.6743 32.8686 41.0248 32.614L53.0907 23.8475C55.4419 22.1393 54.2336 18.4205 51.3274 18.4205H36.413C35.9798 18.4205 35.5958 18.1415 35.462 17.7295L30.8532 3.54509Z"
+            />
+          </svg>
+          <svg
+            class="rating-star"
+            width="26"
+            height="26"
+            viewBox="0 0 56 53"
+            fill="gray"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M30.8532 3.54509C29.9551 0.781158 26.0449 0.781146 25.1468 3.54508L20.538 17.7295C20.4042 18.1415 20.0202 18.4205 19.587 18.4205H4.67262C1.76645 18.4205 0.558112 22.1393 2.90926 23.8475L14.9752 32.614C15.3257 32.8686 15.4724 33.32 15.3385 33.732L10.7297 47.9164C9.83166 50.6803 12.9951 52.9787 15.3462 51.2705L27.4122 42.5041C27.7627 42.2494 28.2373 42.2494 28.5878 42.5041L40.6538 51.2705C43.0049 52.9787 46.1683 50.6803 45.2703 47.9164L40.6615 33.732C40.5276 33.32 40.6743 32.8686 41.0248 32.614L53.0907 23.8475C55.4419 22.1393 54.2336 18.4205 51.3274 18.4205H36.413C35.9798 18.4205 35.5958 18.1415 35.462 17.7295L30.8532 3.54509Z"
+            />
+          </svg>
+          <svg
+            class="rating-star"
+            width="26"
+            height="26"
+            viewBox="0 0 56 53"
+            fill="gray"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M30.8532 3.54509C29.9551 0.781158 26.0449 0.781146 25.1468 3.54508L20.538 17.7295C20.4042 18.1415 20.0202 18.4205 19.587 18.4205H4.67262C1.76645 18.4205 0.558112 22.1393 2.90926 23.8475L14.9752 32.614C15.3257 32.8686 15.4724 33.32 15.3385 33.732L10.7297 47.9164C9.83166 50.6803 12.9951 52.9787 15.3462 51.2705L27.4122 42.5041C27.7627 42.2494 28.2373 42.2494 28.5878 42.5041L40.6538 51.2705C43.0049 52.9787 46.1683 50.6803 45.2703 47.9164L40.6615 33.732C40.5276 33.32 40.6743 32.8686 41.0248 32.614L53.0907 23.8475C55.4419 22.1393 54.2336 18.4205 51.3274 18.4205H36.413C35.9798 18.4205 35.5958 18.1415 35.462 17.7295L30.8532 3.54509Z"
+            />
+          </svg>
+          <svg
+            class="rating-star"
+            width="26"
+            height="26"
+            viewBox="0 0 56 53"
+            fill="gray"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M30.8532 3.54509C29.9551 0.781158 26.0449 0.781146 25.1468 3.54508L20.538 17.7295C20.4042 18.1415 20.0202 18.4205 19.587 18.4205H4.67262C1.76645 18.4205 0.558112 22.1393 2.90926 23.8475L14.9752 32.614C15.3257 32.8686 15.4724 33.32 15.3385 33.732L10.7297 47.9164C9.83166 50.6803 12.9951 52.9787 15.3462 51.2705L27.4122 42.5041C27.7627 42.2494 28.2373 42.2494 28.5878 42.5041L40.6538 51.2705C43.0049 52.9787 46.1683 50.6803 45.2703 47.9164L40.6615 33.732C40.5276 33.32 40.6743 32.8686 41.0248 32.614L53.0907 23.8475C55.4419 22.1393 54.2336 18.4205 51.3274 18.4205H36.413C35.9798 18.4205 35.5958 18.1415 35.462 17.7295L30.8532 3.54509Z"
+            />
+          </svg>
+          <svg
+            class="rating-star"
+            width="26"
+            height="26"
+            viewBox="0 0 56 53"
+            fill="gray"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M30.8532 3.54509C29.9551 0.781158 26.0449 0.781146 25.1468 3.54508L20.538 17.7295C20.4042 18.1415 20.0202 18.4205 19.587 18.4205H4.67262C1.76645 18.4205 0.558112 22.1393 2.90926 23.8475L14.9752 32.614C15.3257 32.8686 15.4724 33.32 15.3385 33.732L10.7297 47.9164C9.83166 50.6803 12.9951 52.9787 15.3462 51.2705L27.4122 42.5041C27.7627 42.2494 28.2373 42.2494 28.5878 42.5041L40.6538 51.2705C43.0049 52.9787 46.1683 50.6803 45.2703 47.9164L40.6615 33.732C40.5276 33.32 40.6743 32.8686 41.0248 32.614L53.0907 23.8475C55.4419 22.1393 54.2336 18.4205 51.3274 18.4205H36.413C35.9798 18.4205 35.5958 18.1415 35.462 17.7295L30.8532 3.54509Z"
+            />
+          </svg>
+          <!-- <i class="bi bi-star-fill rating-star"></i>
+          <i class="bi bi-star-fill  rating-star"></i>
+          <i class="bi bi-star-fill rating-star"></i>
+          <i class="bi bi-star-fill rating-star"></i>
+          <i class="bi bi-star-fill rating-star"></i> -->
+        </div>
+
+        <div class="rating-value ml-2">
+          <span class="rating">
+            <strong id="rating">{{rating}}</strong><span>/5</span>
+          </span>
+          &nbsp; <span class="total-ratings" id="count">{{votes}} </span> votes
+        </div>
+        <button class="feedback-btn" id="openFeedbackBtn">
+          Share your feedback
+        </button>
+      </div>
+    </div>
+  </div>
+
+  <div class="modal-overlay" style="display: none">
+    <div class="feedbackModal" class="modal" style="display: none">
+      <div class="modal-header">
+        <h3 class="modal-title">Share Your Feedback</h3>
+        <button class="close-button">&times;</button>
+      </div>
+      <div class="modal-body">
+        <form
+          id="feedbackForm"
+          action="https://script.google.com/macros/s/AKfycby4YvQokDItHtVEPqr6KtxG11rhz5aSqMuByToBbbFPb_PDyw0ooizHpb9m89Xgh3TU/exec"
+          method="POST"
+          target="hidden_iframe"
+        >
+          <div class="form-group">
+            <label for="comment" class=".form-label">Your Feedback:</label>
+            <textarea
+              id="comment"
+              name="comment"
+              class="form-input"
+              rows="4"
+              required
+              placeholder="Tell us what you liked or how we can improve..."
+            ></textarea>
+          </div>
+          <div class="form-group">
+            <label for="email" class=".form-label">Email (optional):</label>
+            <input
+              type="email"
+              id="email"
+              name="email"
+              placeholder="Your.email@example.com"
+              class="form-input"
+            />
+          </div>
+        </form>
+
+        <!-- Hidden iframe to catch the response -->
+        <iframe
+          name="hidden_iframe"
+          id="hidden_iframe"
+          style="display: none"
+          class="hidden"
+        ></iframe>
+      </div>
+      <div class="modal-footer">
+        <button class="btn btn-secondary">Cancel</button>
+        <button class="btn btn-primary">Submit Feedback</button>
+      </div>
+    </div>
+    <div class="thank-you">
+      <div class="thank-you-icon">✓</div>
+      <h3 class="thank-you-title">Thank You!</h3>
+      <p class="thank-you-message">
+        We appreciate your feedback and will use it to improve our services.
+      </p>
+      <button class="btn btn-primary">Close</button>
+    </div>
+  </div>
+</div>
+
+<script>
+  const ratingValue = document.getElementById("rating");
+  const count = document.getElementById("count");
+  const tool = "{{page.tool}}";
+  const openBtn = document.getElementById("openFeedbackBtn");
+  const modal = document.querySelector(".feedbackModal");
+  const modalOverlay = document.querySelector(".modal-overlay");
+  const cancelButton = document.querySelector(".btn-secondary");
+  const submitButton = document.querySelector(".btn-primary");
+  const closeButton = document.querySelector(".close-button");
+  const thankYouMsg = document.querySelector(".thank-you");
+  const form = document.getElementById("feedbackForm");
+  const iframes = document.getElementById("hidden_iframe");
+
+  const setRating = async (rating) => {
+    const name = "{{site.name}}";
+    const tool = "{{page.tool}}";
+    const data = { website: name, feature: tool, rating: rating };
+    fetch(
+      "https://ratingapi-main.netlify.app/.netlify/functions/api/v1/rating/add",
+      {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify(data),
+      }
+    )
+      .then((response) => response.json())
+      .then((data) => {
+        console.log(data);
+
+        ratingValue.innerText = data.rating;
+        count.innerText = data.count;
+      })
+      .catch((error) => {
+        console.error("Error:", error);
+      });
+  };
+  closeButton.addEventListener("click", () => {
+    modalOverlay.style.display = "none";
+  });
+
+  cancelButton.addEventListener("click", () => {
+    modalOverlay.style.display = "none";
+  });
+  const fetchRating = async () => {
+    const data = await fetch(
+      `https://ratingapi-main.netlify.app/.netlify/functions/api/v1/${tool}/rating`
+    ).then((res) => res.json());
+    if (data.rating === "NaN") {
+      ratingValue.innerText = "5.00";
+      count.innerText = "1";
+    } else {
+      ratingValue.innerText = data.rating;
+      count.innerText = data.votes;
+    }
+  };
+  let ratingImg = document.querySelector("#rating-img");
+  ratingImg.addEventListener("load", (event) => {
+    fetchRating();
+  });
+  const ratingNode = document.getElementsByClassName("rating-star");
+  let ratedValue = localStorage.getItem(`${tool}rating`);
+  if (ratedValue) {
+    Array.from(ratingNode)
+      .slice(0, ratedValue)
+      .map((item) => {
+        item.style.fill = "#FFB21D";
+      });
+  }
+
+  Array.from(ratingNode).map((item) =>
+    item.addEventListener("click", () => {
+      const tool = "{{page.tool}}";
+      function indexInClass(node) {
+        var className = node.className;
+        var num = 0;
+        for (var i = 0; i < ratingNode.length; i++) {
+          if (ratingNode[i] === node) {
+            return num;
+          }
+          num++;
+        }
+        return -1;
+      }
+
+      // Reset all stars to gray first
+      Array.from(ratingNode).map((star) => {
+        star.style.fill = "gray";
+      });
+
+      const index = indexInClass(item);
+      // Color the selected stars
+      Array.from(ratingNode)
+        .slice(0, index + 1)
+        .map((star) => {
+          star.style.fill = "#FFB21D";
+        });
+
+      setRating(index + 1);
+      localStorage.setItem(`${tool}rating`, index + 1);
+      modal.style.display = "block";
+      modalOverlay.style.display = "flex";
+      thankYouMsg.style.display = "none";
+      document.getElementById("comment").placeholder = `Tell us why you gave ${
+        index + 1
+      } stars...`;
+    })
+  );
+
+  openBtn.addEventListener("click", () => {
+    modal.style.display = "block";
+    modalOverlay.style.display = "flex";
+    thankYouMsg.style.display = "none";
+    form.reset();
+  });
+
+  document
+    .querySelector(".thank-you .btn-primary")
+    .addEventListener("click", () => {
+      modalOverlay.style.display = "none";
+    });
+
+  window.addEventListener("click", (event) => {
+    if (event.target === modal) {
+      modal.style.display = "none";
+    }
+  });
+
+  // Set up iframes onload handler
+  iframes.onload = function () {
+    // This function runs when the form submission completes
+    if (form.classList.contains("submitted")) {
+      // Reset the form
+      form.reset();
+      // Hide modal and show thank you message
+      modal.style.display = "none";
+      thankYouMsg.style.display = "block";
+      form.classList.remove("submitted");
+    }
+  };
+
+  // Handle submit button click
+  submitButton.addEventListener("click", function () {
+    // Mark the form as submitted
+    form.classList.add("submitted");
+
+    // Get the current domain, URL and rating
+    const domain = window.location.hostname;
+    const url = window.location.href;
+    const rating = localStorage.getItem(`${tool}rating`) || "0";
+
+    // Create or update hidden fields
+    createHiddenElement("domain", "domain").value = domain;
+    createHiddenElement("url", "url").value = url;
+    createHiddenElement("user-rating", "rating").value = rating;
+
+    // Disable the submit button
+    submitButton.disabled = true;
+    submitButton.textContent = "Submitting...";
+
+    // Submit the form
+    form.submit();
+
+    // Enable the button after 5 seconds (in case of errors)
+    setTimeout(function () {
+      submitButton.disabled = false;
+      submitButton.textContent = "Submit Feedback";
+    }, 5000);
+  });
+
+  // Helper function to create hidden form elements
+  function createHiddenElement(elementId, elementName) {
+    let field = document.getElementById(elementId);
+    if (!field) {
+      field = document.createElement("input");
+      field.type = "hidden";
+      field.name = elementName;
+      field.id = elementId;
+      form.appendChild(field);
+    }
+    return field;
+  }
+</script>
+{%- endif -%}

data/_includes/appscms/extras/recent-posts.html

@@ -0,0 +1 @@
+<!-- . -->

data/_includes/appscms/extras/traffic-count.html

@@ -0,0 +1,21 @@
+
+<div class="container pt-5">
+    <div class="row">
+      <div class="col-md-7 mx-auto">
+        <div class="row">
+          <div class="col-lg-4 col-4 mb-4 mb-sm-0 ms-auto">
+            <div class="text-primary mb-2 text-center">5M+</div>
+            <div class="description text-center">users visited</div>
+          </div>
+          <div class="col-lg-4 col-4 mb-4 mb-sm-0">
+            <div class="text-primary mb-2 text-center">200+</div>
+            <div class="description text-center">Number of tools</div>
+          </div>
+          <div class="col-lg-4 col-4 mb-4 mb-sm-0 me-auto">
+            <div class="text-primary mb-2 text-center">90K+</div>
+            <div class="description text-center">images made</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>

data/_includes/appscms/faq/faq.html

@@ -0,0 +1,40 @@
+<!-- heading -->
+
+{%- if page.layout == "feature" -%} {%- include bookmark.html -%} {%- endif -%}
+{%- assign showFaqs= true -%} {%- for item in site.noFaqsList -%} {%- if item ==
+page.lang -%} {%- assign showFaqs = false -%} {%- break -%} {%- else -%} {%-
+assign showFaqs = true -%} {%- endif -%} {%- endfor -%} {%- if showFaqs == true
+-%} 
+{%- if pageData.FAQ.size>0 -%}
+<div class="container heading mt-5">
+      <div class="d-flex align-items-center justify-content-center">
+        <hr
+          class="flex-grow-1 mx-4 mb-0"
+          style="height: 2px; background-color: #000"
+        />
+        <p class="appscms-h3 my-4 text-center">
+          {{pageData.faqheading | default: 'Frequently Asked Questions'}}
+        </p>
+        <hr
+          class="flex-grow-1 mx-4 mb-0"
+          style="height: 2px; background-color: #000"
+        />
+      </div>
+</div>
+<div class="container mx-auto appscms-faq-section col-md-9 p-3 pb-3 col-12">
+   {% for data in pageData.FAQ %}
+  <div class="faq-item">
+    <h3 class="faq-question">
+      {{ data.question | replace: "$variable", page.value }}
+    </h3>
+    <p class="faq-answer">
+      {{ data.answer | replace: "$variable", page.value | auto_link }}
+    </p>
+  </div>
+{% endfor %}
+
+</div>
+</div>
+</div>
+
+{%- endif -%} {%- endif -%}

data/_includes/appscms/featurePageAuthors/featurePageAuthors.html

@@ -0,0 +1,86 @@
+{% assign file = page.fileName %} {% assign lang = page.lang %} {% assign folder
+= page.folderName %} {% assign featureData= site.data[folder][lang][file] %}
+<section class="authors-list">
+  <div class="container">
+    <div class="row">
+      <div class="col-md-12">
+        {%- if featureData.author -%}
+        <h4 class="mb-4 text-center authors-heading font-weight-bolder">
+          About The Author
+        </h4>
+        {%- endif -%}
+          {%- if featureData.author -%} {%- include authors/authors.html -%} {%-
+          assign featureAuthor = featureData.author | split: " " -%} {%- assign
+          author = featureAuthor.first | downcase -%} {%- assign collection =
+          [author] -%} {%- for item in collection -%} {%- if forloop.index==1
+          -%} {%- assign featureAuthorName = item -%} {%- endif -%} {%- if
+          forloop.index==2 -%} {%- assign featureAuthorImage = item -%} {%-
+          endif -%} {%- if forloop.index==3 -%} {%- assign featureAuthorBio =
+          item -%} {%- endif %} {%- endfor %}
+
+          <div class="featurePageAuthor">
+            <a
+              href="/authors/{{featureAuthorName | downcase  | replace: ' ', '-' }}"
+              class="author_image d-flex justify-content-center"
+            >
+              <img
+                class="author-img"
+                loading="lazy"
+                src="{{ featureAuthorImage }}"
+                height="35px"
+                width="35px"
+                alt="{{ featureAuthorName }}"
+                id="author_img"
+                {%-
+                if
+                site.crossorigin
+                -%}
+                crossorigin
+                {%-
+                endif
+                -%}
+              />
+            </a>
+              <p class="author-meta author_bio mt-3  mb-0">{{featureAuthorBio}}</p>
+          </div>
+          {%- endif %} {%- assign contributors = featureData.contributors |
+          uniq: 'name' -%} {%- if contributors.size > 0 -%}
+          <h4 class="mb-4 w-100 text-center authors-heading font-weight-bolder">
+            Contributors
+          </h4>
+          <div class="d-flex justify-content-center w-100" style="gap: 10px">
+            {%- for contributor in contributors -%}
+            {%- assign
+            featureContributorData = contributor.name | split: " " -%} {%-
+            assign featureContributorData = featureContributorData.first |
+            downcase -%} {%- assign collectionData = [featureContributorData]
+            -%} {%- for item in collectionData -%} {%- if forloop.index == 1 -%}
+            {%- assign featureContributorDataName = item -%} {%- endif -%} {%-
+            if forloop.index == 2 -%} {%- assign featureContributorDataImage =
+            item -%} {%- endif -%} {%- if forloop.index == 3 -%} {%- assign
+            featureContributorDataBio = item -%} {%- endif -%} {%- if
+            forloop.index == 4 -%} {%- assign featureContributorDataTwitter =
+            item -%} {%- endif -%} {%- endfor -%} {%- if
+            featureContributorDataName -%}
+            <a
+              href="/authors/{{featureContributorDataName | downcase  | replace: ' ' , '-'' }}"
+              class="contributor"
+            >
+              <img
+                loading="lazy"
+                src="{{ featureContributorDataImage }}"
+                alt="author image {{ featureContributorDataName }}"
+                style="border-radius: 100%; width: 50px; height: 50px"
+              />
+              <div class="contributor-name">
+                {{ featureContributorDataName }}
+              </div>
+            </a>
+            {%- assign featureContributorDataName = false -%} {%- else -%} {%-
+            endif -%} {%- endfor -%}
+          </div>
+          {%- endif -%}
+      </div>
+    </div>
+  </div>
+</section>

data/_includes/appscms/featurehighlight/featurehighlight.html

@@ -0,0 +1,48 @@
+<div class="container mt-5">
+  <div class="row feature-description-boxes pt-5">
+    {%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%}
+    <div class="row">
+      {%- endif -%} {% assign totalHeaderCount = 0 %} {% for data in
+      pageData.TEXTUAL_CONTENT %} {% assign words = data.header | split: " " %}
+      {% assign word_count = words | size %} {% assign totalHeaderCount =
+      totalHeaderCount | plus: word_count %} {% endfor %} {% for data in
+      pageData.TEXTUAL_CONTENT %}
+      <div
+        class="{%- if site.monumetricId and page.url != '/' and page.lang == 'en' -%} col-md-6 my-4 {%- else -%} col-md-4 my-4 card h-100 border-0 bg-transparent{%- endif -%}"
+      >
+        {%- assign space = ' ' -%}
+        <img
+          src="{{data.logoUrl}}"
+          loading="lazy"
+          class="card-img-top float-left mr-3 appscms-feature-image"
+          alt="{{data.header}}"
+          {%-
+          if
+          site.crossorigin
+          -%}
+          crossorigin{{space}}
+          {{space}}
+          {%-
+          endif
+          -%}
+          style="object-fit: cover; height: 5rem; width: 5rem"
+        />
+        {%- if totalHeaderCount > site.count_of_words_in_headings -%}
+        <h2 class="card-title appscms-feature-title">
+          {{data.header | replace: "$variable", page.value}}
+        </h2>
+        {%- else -%}
+        <div class="card-title appscms-feature-title">
+          {{data.header | replace: "$variable", page.value}}
+        </div>
+        {%- endif -%}
+        <p class="card-text m-0 appscms-feature-description">
+          {{data.content | replace: "$variable", page.value}}
+        </p>
+      </div>
+      {% endfor %} {%- if site.monumetricId and page.url != '/' and page.lang ==
+      'en' -%}
+    </div>
+    {%- endif -%}
+  </div>
+</div>

data/_includes/appscms/footer/ai-image-tools-footer.html

@@ -0,0 +1,14 @@
+{% assign lang = page.lang %}
+{% assign dataToShow = site.data.footer[lang].data %}
+
+<footer class="d-flex flex-wrap justify-content-between align-items-center py-3 my-4 border-top">
+    <p class="col-md-4 mb-0 text-muted">&copy; {{dataToShow.companytitle | default: 'Company' }}</p>
+
+
+    <ul class="nav col-md-8 justify-content-end p-0 m-0">
+        {% for data in dataToShow.company %}
+        <li class="nav-item"><a href="{{data.url}}" class="nav-link px-2 text-muted">{{data.name}}</a></li>
+        {% endfor %}
+
+    </ul>
+</footer>