Support » Plugin: Socialize » floating.js loading when not needed, causing errors

  • Resolved gannondigital

    (@gannondigital)


    I could have missed some subtlety here, but it appears that floating.js is loaded on any singular page if the floating button bar option is “turned on”. This means it can be loaded on pages/post types that aren’t set (via the admin options) to display the buttons. In this case the buttons aren’t in the DOM, and both socialize_floating.parent().offset().top and off.left throw errors in floating.js, which is an issue for other js on the page.

    The quick fix would be to check that jQuery('.socialize-floating') has length > 0 in floating.js. A better solution would probably be to check that the post type is one on which the admin has chosen to display buttons before loading the js (to save unneeded http requests). Keeping the checks in floating.js wouldn’t be a bad idea, to be safe.

    Thanks-

    http://wordpress.org/plugins/socialize/

Viewing 4 replies - 1 through 4 (of 4 total)
  • marky_uk

    (@marky_uk)

    Got exactly the same problem here.

    I’ve only checked to load socialize on “Posts” yet the JS is loading on every page of my site.

    And yep, because the JS is loaded on every page, regardless of this setting, the socialize bar is NOT displayed, but the code still assumes it’s there, fails, and stops any future JS running.

    At the moment I’ve sticky-taped over this by wrapping the failure in a try, catch as follows:

    function socialize_scroll(){
            var topPadding = 30;
            var socialize_floating = jQuery('.socialize-floating');
            try {
            var s = socialize_floating.parent().offset().top;
            var p = jQuery(window).scrollTop();
            socialize_floating.css('position',((p+topPadding)>s) ? 'fixed' : 'absolute');
            socialize_floating.css('top',((p+topPadding)>s) ? topPadding+'px' : '');
            } catch(err) {}
        }

    Can this be fixed for subsequent releases please?

    Plugin Author Jon Bishop

    (@jonbishop)

    I’ve added a jQuery('.socialize-floating').length > 0 check to prevent this error from happening.

    Hi Jon

    Great stuff, thank you.

    I think I later saw the problem in another place – could that be the case?

    Also, does your JS only load on pages and posts where it’s ticked to show?

    Plugin Author Jon Bishop

    (@jonbishop)

    The code for the floating share bar was a proof of concept for modifying socialize using built in filters.

    Here is the floating share code. It can be copied into its own plugin and modified as needed.

    class socialize_inline_class {
    
        function init() {
            $socialize_settings = socializeWP::get_options();
            // check to see if turned on,
            // check to see if single page, post or custom post type
            if(is_singular() && !is_feed()){
                if($socialize_settings['socialize_button_display'] == 'out'){
                    add_filter('socialize-inline_class', array(__CLASS__, 'replace_class'));
                    add_filter('socialize-after-inline_content', array(__CLASS__, 'email_button'));
                    add_filter('socialize-after-inline_content', array(__CLASS__, 'print_button'));
                    add_filter('wp_enqueue_scripts', array(__CLASS__, 'scripts'));
                    add_action('wp_head', array(__CLASS__, 'style'));
                }
            }
        }
    
        function scripts() {
            wp_enqueue_script('socialize-floating', SOCIALIZE_URL . 'frontend/js/floating.js', array('jquery'));
        }
    
        function style(){
            $socialize_settings = socializeWP::get_options();
            echo '<style type="text/css" media="screen">';
            echo '.socialize-floating { margin-left: '.$socialize_settings['socialize_out_margin'].'px; }';
            echo '</style>';
        }
    
        function replace_class($classes) {
            $classes = array('socialize-floating', 'socialize-floating-bg');
            return $classes;
        }
    
        function email_button($content) {
            $content .= '<div class="socialize-in-button socialize-in-button-vertical">';
            $content .= '<a href="mailto:?subject=' . urlencode(get_the_title()) . '&body=' . urlencode(get_permalink()) . '" class="socialize-email-button">Email</a>';
            $content .= '</div>';
            return $content;
        }
    
        function print_button($content) {
            $content .= '<div class="socialize-in-button socialize-in-button-vertical">';
            $content .= '<a href="javascript:window.print()" class="socialize-print-button">Print</a>';
            $content .= '</div>';
            return $content;
        }
    
    }
    add_filter('wp', array('socialize_inline_class', 'init'));
Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘floating.js loading when not needed, causing errors’ is closed to new replies.