Broken Social Menu appearance in child of 2017 theme

2 Replies ·

  1. Using a child theme of the twenty seventeen theme, I made single-event.php and single_sans_sidebar.php which, while serving different purposes are essentially single.php without <?php get_sidebar(); ?>

    single post without sidebar
    single event
    The layout of the social menu at the bottom of each post is broken, but is fine elsewhere in the site.
    Using the Inspector in Firefox, I see errors in the console.
    TypeError: sidebarPos is undefined in global.js
    If I understand get_theme_file_uri used in 2017 theme, all I need to do to modify global.jsin a child theme is copy it to the same path in the child theme, which I have done.
    This is the relevant code (I think) from global.js

    // Add 'below-entry-meta' class to elements.
        function belowEntryMetaClass( param ) {
            var sidebarPos, sidebarPosBottom;
    
            if ( ! $body.hasClass( 'has-sidebar' ) || (
                $body.hasClass( 'search' ) ||
                $body.hasClass( 'single-attachment' ) ||
                $body.hasClass( 'error404' ) ||
                $body.hasClass( 'twentyseventeen-front-page' )
            ) ) {
                return;
            }
    
            sidebarPos       = $sidebar.offset();
            sidebarPosBottom = sidebarPos.top + ( $sidebar.height() + 28 );
    
            $entryContent.find( param ).each( function() {
                var $element = $( this ),
                    elementPos = $element.offset(),
                    elementPosTop = elementPos.top;
    
                // Add 'below-entry-meta' to elements below the entry meta.
                if ( elementPosTop > sidebarPosBottom ) {
                    $element.addClass( 'below-entry-meta' );
                } else {
                    $element.removeClass( 'below-entry-meta' );
                }
            });
        } 
    

    but how to fix is beyond my capabilities. Could you suggest a fix?