I have a WordPress website which eventually is a streaming radio website. on the header i have a script that is pulling streaming data (like listeners count and currently playing) from my Dedicated server’s CP..(Centova Cast)
I registered the script in the function.php:
this is the register
wp_register_script( âstreaminfoâ,
‘http://94.23.250.14:2199/system/streaminfo.js’,false,null);
wp_enqueue_script( âstreaminfoâ );
This is the the whole jQuery section for you to review..
/* ------------------------------------
:: INITIATE JQUERY / STYLING
------------------------------------ */
function init_dynscripts() {
if (!is_admin()) {
if ( function_exists('bp_is_blog_page')) {
if (!bp_is_blog_page()) {
wp_enqueue_script( 'bp-js', BP_PLUGIN_URL . '/bp-themes/bp-default/_inc/global.js', array( 'jquery' ) );
}
}
wp_register_style('northvantage-style', get_bloginfo('stylesheet_url'),false,null);
wp_enqueue_style('northvantage-style');
if(get_option('enable_responsive')!='disable') :
wp_register_style('northvantage-responsive', get_template_directory_uri().'/stylesheets/responsive.css',false,null);
wp_enqueue_style('northvantage-responsive');
endif;
wp_enqueue_script('jquery-ui-core',false,null);
wp_enqueue_script('jquery-ui-tabs',false,null);
wp_enqueue_script("jquery-ui-accordion",false,null);
wp_enqueue_script("swfobject",false,null);
wp_deregister_script("jquery-effects-core");
wp_deregister_script('libertas');
wp_register_script('libertas',get_template_directory_uri().'/js/nv-script.pack.js',false,null);
wp_enqueue_script('libertas');
wp_register_script( âstreaminfoâ, 'http://94.23.250.14:2199/system/streaminfo.js',false,null);
wp_enqueue_script( âstreaminfoâ );
wp_register_script( âjpieâ, get_template_directory_uri().'/js/jpie.js',false,null);
wp_enqueue_script( âjpieâ );
wp_register_style('jpiestyle', get_template_directory_uri().'/jpie.css',false,null);
wp_enqueue_style('jpiestyle');
if(get_option('jwplayer_js')) { // Check jw player javascript file is present
$NV_jwplayer_js = get_option('jwplayer_js');
wp_deregister_script( 'jw-player' );
wp_register_script( 'jw-player', $NV_jwplayer_js,false,null);
wp_enqueue_script( 'jw-player' );
}
}
}
add_action('init', 'init_dynscripts',100);
function _remove_script_version( $src ){ // remove script version
$parts = explode( '?', $src );
return $parts[0];
}
add_filter( 'script_loader_src', '_remove_script_version', 15, 1 );
add_filter( 'style_loader_src', '_remove_script_version', 15, 1 );
It appears i have a conflict between streaminfo.js and my website.
element inspection gives:
Uncaught TypeError: Property ‘$’ of object [object Window] is not a
function
To make things short..everything i tried with the file ended up wrong.
i tried changing every $ sign to jQuery in the file, it eliminate the conflict but created conflicts with other files.
i tried adding
jQuery(document).ready(function ($) {
to the head of the file but it breaks other elements on the CP.
Eventually i ran a simple test and created a webpage with only this code:
<html>
<body>
<span id="cc_strinfo_title_tranceilfm" class="cc_streaminfo"></span>
<script language="javascript" type="text/javascript" src="http://94.23.250.14:2199/system/streaminfo.js"></script>
</body>
</html>
And the page didn’t return any errors. (i did include a path to the google jQuery file)
Something in WordPress is messing up with the jQuery plugin? or some string is missing in my code?
www.tranceil.fm
try adding
jQuery.noConflict()
at the top of your document.ready. This will unbind the$
variable, which should get rid of your conflicts.In response to our discussion in comments, and to help anyone else who sees this question, here’s a little bit of overview:
How jQuery and jQuery.noConflicts() work:
When you load the jQuery library, a variable called
jQuery
is created, which represents the “jQuery” function. An alias tojQuery
, named$
, is also created.For whatever reason, several other javascript libraries change the
$
alias to represent their own functions. When this happens, you have a conflict, as two different things are trying to have control of the$
variable. What jQuery.noConflict() does is unassociates$
withjQuery
, allowing whatever else is trying to use$
to use it freely.The catch is that now
$
doesn’t refer tojQuery
, so everywhere you want to access the jQuery object, you need to usejQuery
instead of$
.