slider "messed up"

Hi,
the past few days I was busy getting the performance up and running without plugins (and doing not too bad so far).

But it seems that something messed up the slider display, photos are enlarged and the actual slider is not visible. And I can’t figure out what is causing this. Also the images show a darkened bottom, any chance to remove this ?

http://www.dinckol.com/2015/04/22/wandering-laos-with-x-t1/

Since I’m here google pagespeed annoys with should fix this for mobiles (but not for desktop!):

Optimize CSS Delivery of the following:
http://www.dinckol.com/…-content/plugins/jetpack/css/jetpack.css
http://www.dinckol.com/…cons/genericons/genericons.css?ver=1.7.1
http://www.dinckol.com/…themes/Newsmag-child/style.css?ver=1.7.1
http://www.dinckol.com/wp-content/themes/Newsmag/style.css

I understand from what I have read so far the theme css’ hast to be loaded at top. Once you open my page you will see nonetheless a brief delay the style gets applied. any suggestions to improve mobile speed and visual experience?

Thanks

thx Alin
unfortunately I’m not able to resolve the issue. At this moment all plugins are deactivated except composer and I get

Fatal error: Call to undefined function get_base_recaptcha_lang_code

I think I played too much with fucntion.php would be cool if someone would take a look and I think the prob for the jquery messages may lay here too.

EDIT: ok I commented the lang part out and now it works, somehow it was anyway double. The slider is also visible now though the thumbs and image are scaled too large, how can fix that one ?
On the jquery error before I assume I activate plugins one by one and see where the pain comes right ? and off I go..

<?php

/*  ----------------------------------------------------------------------------
    WordPress booster framework - this is our theme framework - all the content and settings are there
    It is not necessary to include it in the child theme only if you want to use the API
*/
if (!defined('TD_THEME_WP_BOOSTER')) {
	include TEMPLATEPATH . '/includes/td_config.php';
	include TEMPLATEPATH . '/includes/wp_booster/td_wp_booster_functions.php';
}

/*include theme.js under newsmag to put modal image on*/
/* include theme.js*/

/*wp_enqueue_script( 'theme-js', get_stylesheet_directory_uri() . '/js/theme.js', array( 'jquery'), NULL, TRUE );*/

remove_action( 'wp_head', 'wp_generator' ) ;
 remove_action( 'wp_head', 'wlwmanifest_link' ) ;
 remove_action( 'wp_head', 'rsd_link' ) ;
 remove_action( 'wp_head', 'feed_links', 2 );
 remove_action( 'wp_head', 'feed_links_extra', 3 );

 add_filter( 'pre_comment_content', 'wp_specialchars' );

 function no_errors_please(){
   return 'You appear to be up to no good. Please stop now!';
 }
 add_filter( 'login_errors', 'no_errors_please' );

 // and we hook our function via
 add_action( 'wp_before_admin_bar_render', 'mytheme_admin_bar_render' );

 function delete_enclosure(){
  return '';
  }
  add_filter( 'get_enclosed', 'delete_enclosure' );
  add_filter( 'rss_enclosure', 'delete_enclosure' );
  add_filter( 'atom_enclosure', 'delete_enclosure' );

// function remove_cssjs_ver( $src ) {
//     if( strpos( $src, '?ver=' ) )
//         $src = remove_query_arg( 'ver', $src );
//     return $src;
// }
// add_filter( 'style_loader_src', 'remove_cssjs_ver', 10, 2 );
// add_filter( 'script_loader_src', 'remove_cssjs_ver', 10, 2 );

 add_filter( 'jpeg_quality', create_function( '', 'return 65;' ) );

//remove render blocking by jetpack
add_filter( 'jetpack_implode_frontend_css', '__return_false' );

 function remove_pingback_url( $output, $show ) {
     if ( $show == 'pingback_url' ) $output = '';
     return $output;
 }
 add_filter( 'bloginfo_url', 'remove_pingback_url', 10, 2 );

// add_action('init', 'myoverride', 100);
 function myoverride() {
     remove_action('wp_head', array(visual_composer(), 'addMetaData'));
}

function dequeue_visual_composer_css() {
if (is_single()) {
    wp_dequeue_style('js_composer_front');
}
}

// Defer jQuery Parsing using the HTML5 defer property
if (!(is_admin() )) {
    function defer_parsing_of_js ( $url ) {
        if ( FALSE === strpos( $url, '.js' ) ) return $url;
        if ( strpos( $url, 'jquery.js' ) ) return $url;
        // return "$url' defer ";
        return "$url' defer onload='";
    }
    add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 );
}

// Remove WP version number from js and css files.
function remove_cssjs_ver( $src ) {
    if( strpos( $src, '?ver=' ) )
        $src = remove_query_arg( 'ver', $src );
    return $src;
}
add_filter( 'style_loader_src', 'remove_cssjs_ver', 10, 2 );
add_filter( 'script_loader_src', 'remove_cssjs_ver', 10, 2 );

function tweakjp_add_sharing_js() {
    wp_enqueue_script( 'sharing-js', WP_SHARING_PLUGIN_URL . 'sharing.js', array( ), 4 );
    $sharing_js_options = array(
        'lang'   => get_base_recaptcha_lang_code(),
        'counts' => apply_filters( 'jetpack_sharing_counts', true )
    );
    wp_localize_script( 'sharing-js', 'sharing_js_options', $sharing_js_options );
}
add_action( 'wp_enqueue_scripts', 'tweakjp_add_sharing_js' );
 
function tweakjp_add_sharing_css() {
    wp_enqueue_style( 'sharing', WP_SHARING_PLUGIN_URL. 'sharing.css', false, JETPACK__VERSION );
}
add_action( 'wp_enqueue_scripts', 'tweakjp_add_sharing_css' );

• This reply was modified 11 years by cem.

the slider gets messed up by the speedbooster plugin, sooo…here is the code 😉 as I don’t know what I did other than the performance improvement tips ( Is this required? As the performance drops from 93 to 91 after activating it).

<?php
/*
	Plugin Name: tagDiv Speed Booster
	Plugin URI: http://tagdiv.com
	Description: Speed booster for Newspaper and Newsmag theme - It moves the styles and all the scripts of the theme to the bottom when needed. It activates internal theme optimizations for better speed and it adds async js .
	Author: tagDiv
	Version: 3.2
	Author URI: http://tagdiv.com
*/

/*

    3.2 - better bbpress support on newsmag
    3.1 - fixed issue with flashing white on load on newspaper theme
        - better compatibility with themes that do not have wp booster framework
        - Newsmag loads fonts in a bundle now
    3.0 - better visual composer support
    2.8 - Newsmag support added :)
    2.7 - fixed ie 9 10 11 window resize bug
    2.6 - fixed rendering bug on the loading of the page
    2.5 - code improvements, newspaper 4 compatibility
        - makes most of the javascript files use defer parsing
        - better compatibility with revolution slider
    2.4 - updated jquery version
        - support for https
    2.3 - fixed warnings when trying to move javascript files that are not registered
 */

define('TD_SPEED_BOOSTER' , 'v3.2');

class td_speed_booster {

    var $styles_for_footer = array(); // here we keep all the stylesheets IDs that we want to move to the footer

    var $is_ie = false; // if the browser is detected as IE, treat it differently

    var $async_js_scripts = array(
        'contact-form-7',
        'bbpress',
        'woocommerce',
        'site',
        'devicepx',
        'js_composer_front'
    );

    var $td_theme_name = '';
    var $td_theme_version = '';
    var $td_deploy_mode = '';

    function __construct() {
        add_action('td_wp_booster_loaded', array($this, 'td_wp_booster_loaded'));
    }

    function td_wp_booster_loaded() {
        // read the theme version and name if defined
        if (defined('TD_THEME_VERSION') and defined('TD_THEME_NAME') and defined('TD_DEPLOY_MODE')) {
            $this->td_theme_version = TD_THEME_VERSION;
            $this->td_theme_name = TD_THEME_NAME;
            $this->td_deploy_mode = TD_DEPLOY_MODE;
        } else {
            return;
        }

        // detect IE 8 9 10 11
        if (!empty($_SERVER['HTTP_USER_AGENT']) and (preg_match('~MSIE|Internet Explorer~i', $_SERVER['HTTP_USER_AGENT']) || (strpos($_SERVER['HTTP_USER_AGENT'], 'Trident/7.0; rv:11.0') !== false))) {
            $this->is_ie = true;
        }

        // add hooks
        add_action('wp_enqueue_scripts', array($this, 'enqueue_scripts_hook'), 1002);  // 1002 priority - because visual composer has 1000 and we use 1001 in the wp010 theme
        add_action('wp_footer', array($this, 'wp_footer_hook'), 15);
        if ($this->is_ie === false) {
            add_action('wp_head', array($this, 'wp_head_hook'), 15);
        }
    }

    function enqueue_scripts_hook() {
        global $wp_scripts;

        //detect revmin - revolution slider and do not move jquery
        if( !is_admin() and !isset($wp_scripts->registered['revmin'])){
            if (is_ssl()) {
                $td_protocol = 'https';
            } else {
                $td_protocol = 'http';
            }

            wp_deregister_script('jquery');
            wp_register_script('jquery', ($td_protocol . '://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'), true, '1.11.1', true);
            wp_enqueue_script('jquery');
        }

        if ($this->td_theme_name == 'Newsmag') {
/*             wp 010*/
            $this->move_style_to_footer('js_composer_front');
            $this->move_style_to_footer('js_composer_custom_css');
        }

        // Newsmag dosn't move the css to the bottom as such, bbpress should stay at the top
        if ($this->td_theme_name != 'Newsmag') {
            $this->move_style_to_footer('bbp-default-bbpress');  //bpress old
            $this->move_style_to_footer('bbp-default');  //bpress
            $this->move_style_to_footer('google-font-rest');
            $this->move_style_to_footer('contact-form-7');
            $this->move_style_to_footer('genericons');
            $this->move_style_to_footer('jetpack');
            $this->move_style_to_footer('jetpack-widgets');
            $this->move_style_to_footer('jetpack-subscriptions');
			$this->move_style_to_footer('sharing-css');

        }

        /**
         * Move the style only on newspaper
         * @todo move the style also on newsmag after we fix all the issues
         */
        if ($this->is_ie === false and $this->td_theme_name == 'Newspaper') {
            $this->move_style_to_footer('td-bootstrap');
            $this->move_style_to_footer('td-theme'); //this is the main style of the theme, it depends on td-bootstrap to load
        }

        $this->move_style_to_footer('woocommerce_frontend_styles');

        //jetpack lost styles
        $this->move_style_to_footer('jetpack-subscriptions');
        $this->move_style_to_footer('jetpack-widgets');
        $this->move_style_to_footer('genericons');
        $this->move_style_to_footer('jetpack');
        $this->move_style_to_footer('td-theme');
		$this->move_style_to_footer('sharing-css');

        /**
         * move javascript to footer
         */
        $this->move_js_to_footer('themepunchtools');
        $this->move_js_to_footer('revmin');

        // remove strange custom.css file loaded by visual composer
        wp_deregister_style('js_composer_custom_css');

        // replace comment-reply.min.js with inline version

    }

    function wp_footer_hook() {
        //get the theme version for style
        $current_theme_version = $this->td_theme_version;

        //on demo mode, autogenerate version hourly + day
        if ($this->td_deploy_mode == 'demo') {
            $current_theme_version = date('jG');
        }

        foreach ($this->styles_for_footer as $style_id => $style_src) {
            echo "<link rel='stylesheet' id='" . $style_id . "-css'  href='" . $style_src . "?ver=" . $current_theme_version . "' type='text/css' media='all' />\n";
        }
    }

    function wp_head_hook() {
        if ($this->td_theme_name == 'Newspaper') {
            echo '<style>body {visibility:hidden;}</style>';
        }
    }

    function move_style_to_footer($style_id) {
        global $wp_styles;
        if (!empty($wp_styles->registered[$style_id]) and !empty($wp_styles->registered[$style_id]->src)) {
            $this->styles_for_footer[$style_id] = $wp_styles->registered[$style_id]->src;
            wp_deregister_style($style_id);
        }
    }

    function move_js_to_footer($js_id) {
        global $wp_scripts;
        if (isset($wp_scripts->registered[$js_id])) {
            wp_enqueue_script($js_id, ($wp_scripts->registered[$js_id]->src), '', $wp_scripts->registered[$js_id]->ver, true);
        }

    }

    function async_js_hook($url) {
        //check to see if we have js
        if (strpos( $url, '.js' ) === false) {
            return $url;
        }
        if ($this->strpos_array($url, $this->async_js_scripts) === false) {
            return $url;
        } else {
            return "$url' defer='defer";
        }
    }

    private function strpos_array($haystack_string, $needle_array, $offset=0) {
        foreach($needle_array as $query) {
            if(strpos($haystack_string, $query, $offset) !== false) {
                return true; // stop on first true result
            }
        }
        return false;
    }

}

new td_speed_booster();

• This reply was modified 11 years by cem.

thx for the reply Marius but the speed booster is currently deactivated so the prob is not there, I fixed the other error message.

Does the slider need specific thumbs to be generated ? I currently have 0x420, 283×178,300×350,640×0 and 1021×580. btw I’m using the child theme but don’t think that causes troubles.

Okay I got the slider now running. The documentation should be amended to say what thumbs are required as a prerequisite to be able to use the slider. Inspect element in Chrome luckily showed what it was looking for and after activating the thumb and regenerating them it now looks good.