add bookmark button to website

<!-- Floating Bookmark Button -->
<div class="bookmark-btn" onclick="bookmarkPage()">🔖</div>

<style>
.bookmark-btn{
    position: fixed;
    right: 20px;
    bottom: 80px;
    width: 55px;
    height: 55px;
    background: #ff9800;
    color: #fff;
    font-size: 24px;
    border-radius: 50%;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    box-shadow:0 4px 10px rgba(0,0,0,0.3);
    z-index:9999;
}
</style>

<script>
function bookmarkPage(){

    const isMobile = /Android|iPhone|iPad|iPod/i.test(navigator.userAgent);

    if(isMobile){
        alert("📌 To bookmark this page:\n\n1️⃣ Tap the browser menu (⋮)\n2️⃣ Tap ⭐ Add to Bookmarks\n\nOr choose 'Add to Home Screen'");
    } 
    else {
        const url = window.location.href;
        const title = document.title;

        if (window.sidebar && window.sidebar.addPanel){
            window.sidebar.addPanel(title, url, "");
        } 
        else if (window.external && ('AddFavorite' in window.external)){
            window.external.AddFavorite(url, title);
        } 
        else {
            alert("Press Ctrl + D to bookmark this page ⭐");
        }
    }

}
</script>



Leave a Reply