কীভাবে Popup অ্যাড করবেন

১.ই-দোকান এর ম্যানেজ প্যানেল থেকে Shop > Design ক্লিক করুন

২.JvavScript অপশন এ ক্লিক করুন

৩.Add New তে ক্লিক করে একটা new javascript ফাইল ক্রিয়েট করুন ৪.জাভাস্ক্রিপ্ট এর কোড তা copy করে ওই খানে সেট করে আপডেট করুন ৫.আবার Shop > Design > Custom CSS এ ক্লিক করুন ৬.স্ক্রোল করে নিছে css কোড তা পেস্ট করুন

###CSS Code

//style

/* Popup style */
  /* Basic styles for the popup */
        #popup {
            display: none;
            /* Hidden by default */
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 500px;
            background-color: white;
            border: 1px solid #ccc;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
            z-index: 9999;
            text-align: center;
            padding: 20px;
        }

        #popup img {
            max-width: 100%;
        }

        #popup .close-btn {
            position: absolute;
            top: 10px;
            right: 10px;
            cursor: pointer;
            font-size: 40px;
            color: red;
        }

        /* Overlay background */
        #popup-overlay {
            display: none;
            /* Hidden by default */
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
            z-index: 9999;
        }

        @media screen and (max-width:768px){
            #popup{
                width: 90%;
            }
        }

###JavaScript Code

//Script


    let popUpDiv = document.createElement('div');
    popUpDiv.innerHTML=`<div id="popup-overlay"></div>
    <div id="popup">
        <span class="close-btn" onclick="closePopup()">×</span>
        <img src="https://bd-1.edkncdn.net/img/938x938/stores/61e022fa4c90a5779374d5f9/banner/1732018220750-wIQYv7Mv7Y57nPnwQ35i2/50k%20cup.webp"
            alt="Popup Image">
    </div>`


let topHeader = document.querySelector("#masthead");
topHeader.appendChild(popUpDiv)

const popupInterval = 1000*60*30; // 1 hour in milliseconds

        function closePopup() {
            document.getElementById('popup').style.display = 'none';
            document.getElementById('popup-overlay').style.display = 'none';
        }

        function showPopup() {
            document.getElementById('popup').style.display = 'block';
            document.getElementById('popup-overlay').style.display = 'block';
        }

        // Check current URL
        if (window.location.pathname !== '/checkout') {
            const lastPopupTime = localStorage.getItem('lastPopupTime');
            const currentTime = new Date().getTime();

            if (!lastPopupTime || currentTime - lastPopupTime > popupInterval) {
                showPopup();
                localStorage.setItem('lastPopupTime', currentTime);
            }
        }

    

কীভাবে Popup অ্যাড করবেন​

কীভাবে Popup অ্যাড করবেন