• Today I was checking my website page source code and I found out that the stylesheet for vjs is loaded inside the header even if the page doesn’t have a video in it, plus it’s inline code; it isn’t a call for a .css file.
    Am I right with this or I did something wrong with the plugin setup??
    Thanks

    https://wordpress.org/plugins/videojs-html5-video-player-for-wordpress/

    PS: Ok i see that the css files are loaded through wp_register_style function so I should be able to deregister them using functions.php.
    Still I don’t get why this isn’t implemented by the plugin itself; guess the question is still valid.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter Horizont

    (@horizont)

    I update my question because i see that the actual js and css file (video.js and video-js.css) are loaded correctly checking the minify string of all files loaded and also with wappalyzer.
    So what I was referring to must be a portion of the css and is this one (judging from the code it must be the custom color you select in the plugin backend).

    <style type='text/css'>
    		.vjs-default-skin { color: #ccc }
    		.vjs-default-skin .vjs-play-progress, .vjs-default-skin .vjs-volume-level { background-color: #b81005 }
    		.vjs-default-skin .vjs-control-bar, .vjs-default-skin .vjs-big-play-button { background: rgba(0,0,0,0.7) }
    		.vjs-default-skin .vjs-slider { background: rgba(0,0,0,0.2333333333333333) }
    	</style>

    This is loaded on every page and I don’t think it is supposed to, am I wrong?

    EDIT: Probably I should have written the post after I was certain of everything, sorry :D.
    Anyways the code above IS indeed hardcoded, it’s beginning on line 64 of the video-js.php plugin main file

    /* Include custom color styles in the site header */
    function videojs_custom_colors() {
    	$options = get_option('videojs_options');
    
    	if($options['videojs_color_one'] != "#ccc" || $options['videojs_color_two'] != "#66A8CC" || $options['videojs_color_three'] != "#000") { //If custom colors are used
    		$color3 = vjs_hex2RGB($options['videojs_color_three'], true); //Background color is rgba
    		echo "
    	<style type='text/css'>
    		.vjs-default-skin { color: " . $options['videojs_color_one'] . " }
    		.vjs-default-skin .vjs-play-progress, .vjs-default-skin .vjs-volume-level { background-color: " . $options['videojs_color_two'] . " }
    		.vjs-default-skin .vjs-control-bar, .vjs-default-skin .vjs-big-play-button { background: rgba(" . $color3 . ",0.7) }
    		.vjs-default-skin .vjs-slider { background: rgba(" . $color3 . ",0.2333333333333333) }
    	</style>
    		";
    	}
    }
    add_action( 'wp_head', 'videojs_custom_colors' );

    This should load only if you navigate to a page with an actual video, shouldn’t it?

    Plugin Author Dustin Lammiman

    (@nosecreek)

    Yeah, this is inline because it is based on the color options the user sets on the admin screen. It is probably possible to load it conditionally like the other scripts, although I don’ think that 6 extra lines are going to make much of a difference. Still, I will look at the possibility of changing this in a future version.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Css still being loaded even if the page doesn't have a video’ is closed to new replies.