JavaScript和CSS无法正常加载在WordPress网站

我设法让通过codepen工作我的代码，你可以看到，如果你访问链接here JavaScript和CSS无法正常加载在WordPress网站

现在试图在WordPress的试验场，它看起来实现像我的JavaScript不工作以及fontawesome未被正确加载。 Here is the link for the test site

这是我的JS：

$(document).ready(function() { 
    var txtFromDate, txtToDate; 
    $("#txtFrom").datepicker({ 
    numberOfMonths: 1, 
    onSelect: function(selected) { 
     txtFromDate = selected; 
     var dt = new Date(selected); 
     dt.setDate(dt.getDate() + 1); 
     $("#txtTo").datepicker("option", "minDate", dt); 
    } 
    }); 
    $("#txtTo").datepicker({ 
    numberOfMonths: 1, 
    onSelect: function(selected) { 
     txtToDate = selected; 
     var dt = new Date(selected); 
     dt.setDate(dt.getDate() - 1); 
     $("#txtFrom").datepicker("option", "maxDate", dt); 
    } 
    }); 

    $('.submit-here').click(function() { 
    // var link = day_1+month_1+year; 
    var date1 = $("#txtFrom").datepicker('getDate'), 
     day_1 = date1.getDate(), 
     month_1 = date1.getMonth() + 1,    
     year_1 = date1.getFullYear(); 

    var date2 = $("#txtTo").datepicker('getDate'), 
     day_2 = date2.getDate(), 
     month_2 = date2.getMonth() + 1,    
     year_2 = date2.getFullYear(); 

    var where = $('#selection :selected').text(); 
    var people = $('#people :selected').text(); 

    console.log('www.lekkeslaap.co.za/akkommodasie-in/'+where+'?q='+where+'&start='+day_1+'+'+month_1+'+'+year_1+'&end='+day_2+'+'+month_2+'+'+year_2+'&pax='+people); 
    }); 
});

这里，它是我的functions.php：

function testsite_scripts() { 
    wp_enqueue_style('testsite-style', get_stylesheet_uri()); 
    wp_enqueue_style('fontawesome', get_template_directory_uri() . 'https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css', array(), '1.0.0', 'all'); 
    wp_enqueue_script('testsite-navigation', get_template_directory_uri() . '/js/navigation.js', array('jquery'), '20151215', true); 

    wp_enqueue_script('testsite-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20151215', true); 

    if (is_singular() && comments_open() && get_option('thread_comments')) { 
     wp_enqueue_script('comment-reply'); 
    } 
} 
add_action('wp_enqueue_scripts', 'testsite_scripts'); 

function testsite_load_scripts(){ 

    wp_enqueue_style('font_extra', get_template_directory_uri() . 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/start/jquery-ui.css', array(), '1.0.0', 'all'); 
    wp_enqueue_script('plugin_script', get_template_directory_uri() . 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js', array('jquery'), '20151215', true); 
    wp_enqueue_script('calendario', get_template_directory_uri() . 'http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js', array('jquery'), '20151215', true); 
    wp_enqueue_script('calendario', get_template_directory_uri() . '/js/calendario.js', array('jquery'), '20151215', true); 
} 

add_action('wp_enqueue_scripts', 'testsite_load_scripts');

来源

2017-04-06 Wosley Alarico

您参考网址，你的HTML的<head>是不正确的，因为他们是如下：

如果从两个网址的开头删除http://wordpressdev.burnnotice.co.za/wp-content/themes/testsite，他们应该载入罚款。要做到这一点，您必须从php文件中移除这两个引用的get_template_directory_uri() .部分。

尝试下面的PHP代码：

function testsite_scripts() { 
    wp_enqueue_style('testsite-style', get_stylesheet_uri()); 
    wp_enqueue_style('fontawesome', 'https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css', array(), '1.0.0', 'all'); 
    wp_enqueue_script('testsite-navigation', get_template_directory_uri() . '/js/navigation.js', array('jquery'), '20151215', true); 

    wp_enqueue_script('testsite-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20151215', true); 

    if (is_singular() && comments_open() && get_option('thread_comments')) { 
     wp_enqueue_script('comment-reply'); 
    } 
} 
add_action('wp_enqueue_scripts', 'testsite_scripts'); 

function testsite_load_scripts(){ 

    wp_enqueue_style('font_extra', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/start/jquery-ui.css', array(), '1.0.0', 'all'); 
    wp_enqueue_script('plugin_script', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js', array('jquery'), '20151215', true); 
    wp_enqueue_script('calendario', 'http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js', array('jquery'), '20151215', true); 
    wp_enqueue_script('calendario', get_template_directory_uri() . '/js/calendario.js', array('jquery'), '20151215', true); 
} 

add_action('wp_enqueue_scripts', 'testsite_load_scripts');

来源

2017-04-06 08:46:21 AryKay

最初它只是工作fontawesome，但我取消了第二功能与第一功能加载的一切，因为它现在确实不是我的codepen它的工作原理是相同的。欣赏支持 –

它不是在所有

与您js你的链接字体真棒CSS中的错误。你的链接是这样的：

http://wordpressdev.burnnotice.co.za/wp-content/themes/testsitehttps://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css?ver=1.0.0

它应该是这样的：

https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css?ver=1.0.0

结帐您header.php文件的代码。你应该直接链接！像这样：

<link rel='stylesheet' id='fontawesome-css' href='https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css?ver=1.0.0' type='text/css' media='all' />

来源

2017-04-06 08:46:34

wp_enqueue_style('fontawesome', get_template_directory_uri() . 'https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css', array(), '1.0.0', 'all');

和类似的问题。

你正试图从

/wp-content/themes/testsitehttps:/maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css?ver=1.0.0

加载的资产，很明显是错误的。

get_template_directory_uri（）获取到你的WP主题的相对路径。

相反，试试这个：

wp_enqueue_style('fontawesome', 'https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css', array(), '1.0.0', 'all');

来源

2017-04-06 08:48:33

正是这一点。与@AryKay完整答案我跑我想要的。谢谢 –

没问题。如果答案有用，请将其标记为这样。 –

JavaScript和CSS无法正常加载在WordPress网站

回答

相关问题