Add a floating button to create magic tests

To create a floating button at the top of your website, which is useful if you do not have your admin bar visible. Paste the below script into any code managing plugin, or anywhere you paste JavaScript

This script will create the button that starts magic test mode.

<script>

// Script to display floating New AB Test Button that loads the magic test mode when clicked.


(function() {
    // only show if the abst_magic_bar function exists. Should only exist if current_user_can 'edit_posts'
    if (typeof abst_magic_bar !== 'function') return; 

    //create the button
    const button = document.createElement('button');
    button.textContent = 'New AB Test ✨';
    button.style.position = 'fixed';
    button.style.top = '20px';
    button.style.right = '20px';
    button.style.zIndex = '9999';
    button.style.padding = '10px 15px';
    button.style.fontSize = '14px';
    button.style.backgroundColor = '#2d8cff';
    button.style.color = '#fff';
    button.style.border = 'none';
    button.style.borderRadius = '5px';
    button.style.cursor = 'pointer';
    button.style.boxShadow = '0 2px 8px rgba(0, 0, 0, 0.15)';

    button.onclick = function() {
        abst_magic_bar();
        button.remove(); // remove button after click
    };

    document.body.appendChild(button);
})();
</script>