How would you set Theme Customizer API Previewer Preview URL of a Logged out Page or Login Screen

How would you set the WP_Customizer preview iframe to a Logged out page like the Login Screen /wp-login.php?

I'm aware of how to set the preview page on expansion of panels or sections, but I have some subtle theme mods for the login screen I'd like the user to preview when customizing. Any Ideas? I looked at the code to some Custom Login plugins and it appears they might print out a fake clone or duplicate of the login page and form. I'd like to keep the code as small as possible preferably just showing the regular login screen if possible.

ATTEMPT

This is a non working modified code snippet from Weston Ruter from one of his blog posts to change preview url when you expand 'login_screen_settings' or whatever your panel is named. You can use it with sections too, you just change that api.panel - api.section

// Not currently working - just an example
    api.panel('login_screen_settings', function (section) {
        var previousUrl, clearPreviousUrl, previewUrlValue;
        previewUrlValue = api.previewer.previewUrl;
        clearPreviousUrl = function () {
            previousUrl = null;
        };

        section.expanded.bind(function (isExpanded) {
            var url;
            if (isExpanded) {
                url = api.settings.url.home + '/wp-login.php';
                previousUrl = previewUrlValue.get();
                previewUrlValue.set(url);
                previewUrlValue.bind(clearPreviousUrl);
            } else {
                previewUrlValue.unbind(clearPreviousUrl);
                if (previousUrl) {
                    previewUrlValue.set(previousUrl);
                }
            }
        });
    });

Topic theme-customizer wp-login-form Wordpress

Category Web

About

Geeks Mental is a community that publishes articles and tutorials about Web, Android, Data Science, new techniques and Linux security.