Shopify Code Library

live vistors

this code is for fake live vistores

Custom Liquid Easy Tested - Preview

Live Preview

Runs the saved Liquid code in a safe browser sandbox.

Loading preview…

Testing note: This preview uses a browser-based simulator with sample Shopify data. It is not Shopify’s official Liquid runtime. Always verify the final snippet in a duplicate/development Shopify theme.

How It Works

asdasd

Where to Paste

paste in your shopify store liquid sestion

Code

Copy the code you need and paste it into your Shopify theme.

Liquid Code

<div class="live-viewers">
  <span class="live-dot"></span>
  <span>
    <strong id="live-viewer-count">12</strong>
    people are viewing this product just now!
  </span>
</div>

<style>
  .live-viewers {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: #f5f9fc;
    border-radius: 8px;
    width: fit-content;
    font-size: 13px;
    color: #333;
  }

  .live-viewers strong {
    font-weight: 700;
  }

  .live-dot {
    width: 8px;
    height: 8px;
    background: #18b66a;
    border-radius: 50%;
    display: inline-block;
    animation: livePulse 1.5s infinite;
  }

  @keyframes livePulse {
    0%, 100% {
      opacity: 1;
      transform: scale(1);
    }
    50% {
      opacity: .45;
      transform: scale(.8);
    }
  }
</style>

<script>
  document.addEventListener("DOMContentLoaded", function () {
    const viewerCount = document.getElementById("live-viewer-count");

    function updateViewers() {
      const numbers = [12, 18, 21, 25, 28, 32, 36, 42, 48, 50];
      const randomNumber = numbers[Math.floor(Math.random() * numbers.length)];

      viewerCount.textContent = randomNumber;
    }

    updateViewers();

    setInterval(updateViewers, 8000);
  });
</script>

Installation

as asknsa

Important: The preview is a local simulator. Shopify theme versions, app blocks, section settings, metafields and Shopify-only objects can change the final result. Test the final code on a duplicate/development theme before publishing.