How to Creating a “Pop-up” button in WordPress involves adding HTML, CSS, and possibly JavaScript to your WordPress site Without Plugins

1. Create a new page or post in WordPress, and switch to the Text editor. Add the following HTML code:

<button id="popup-button">Start Now</button>

<div id="popup-modal" class="popup">
    <div class="popup-content">
        <span class="close" id="popup-close">&times;</span>
        <p>Click on the buttons below:</p>
        <a href="https://isansar.net/buttom1" id="popup-sub-button1" class="popup-sub-button">Whatsapp</a>
        <a href="https://isansar.net/buttom2" id="popup-sub-button2" class="popup-sub-button">Messanger</a>
        <a href="https://isansar.net/buttom3" id="popup-sub-button3" class="popup-sub-button">Email</a>
    </div>
</div>

2. Add the CSS styles to your WordPress theme’s style.css or use the WordPress Customizer:

.popup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.7);
    z-index: 1;
}

.popup-content {
    background-color: #fff;
    margin: 10% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 60%;
    position: relative;
}

.close {
    position: absolute;
    top: 0;
    right: 0;
    padding: 10px;
    cursor: pointer;
}

.popup-sub-button {
    display: block;
    margin-bottom: 10px; /* Add space between the buttons */
}

3. Add the JavaScript for the pop-up interaction. Place this code in your theme’s footer.php just before the closing </body> tag or use a custom JavaScript file if your theme provides one:

<script>
    document.getElementById("popup-button").addEventListener("click", function() {
        document.getElementById("popup-modal").style.display = "block";
    });

    document.getElementById("popup-close").addEventListener("click", function() {
        document.getElementById("popup-modal").style.display = "none";
    });

    document.getElementById("popup-sub-button1").addEventListener("click", function() {
        // Add your action here for Button 1
    });

    document.getElementById("popup-sub-button2").addEventListener("click", function() {
        // Add your action here for Button 2
    });

    document.getElementById("popup-sub-button3").addEventListener("click", function() {
        // Add your action here for Button 3
    });
</script>