将 js 文件和 css 文件添加到 wordpress [英] adding js files and css files to wordpress

问题描述

我是 wordpress 的新手.我已经安装了名为hare"的主题.现在我想在 index.php 页面中添加一些 javascripts 文件和 css 文件.但我没有找到所需的输出.

I am new to wordpress.. I have installed my theme named 'hare'. Now I want to add some javascripts files as well as css files into the index.php page. But I am not finding the desired output.

以下是我写的代码..

    <?php get_header(); ?>
    // Some content
    <?php get_footer(); ?>
<!-- JQuery libs
================================================== -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<!-- js jQuery wait for images Plugin ====================== -->
<script src="<?php bloginfo(template_directory ); ?>/javascripts/jquery.waitforimages.js"></script>
<!-- js jQuery flexslider Plugin ====================== -->
<script src="<?php bloginfo(template_url); ?>/javascripts/jquery.flexslider-min.js"></script>
<!-- jQuery Cycle Plugin ====================================== -->
<script src="<?php bloginfo(template_url); ?>/javascripts/jquery.cycle.all.js"></script>
<!-- jQuery Cycle Plugin ====================================== -->
<script src="<?php bloginfo(template_url); ?>/javascripts/jquery.fullscreen-min.js"></script>
<!-- js jQuery jcarousellite Plugin ====================== -->
<script src="<?php bloginfo(template_url); ?>/javascripts/jcarousellite_1.0.1.min.js"></script>

<!-- js Fancybox Plugin ================================= -->
<link rel="stylesheet" href="<?php bloginfo(template_directory); ?>/javascripts/fancyBox-2/jquery.fancybox.css">
<script src="<?php bloginfo(template_url); ?>/javascripts/fancyBox-2/jquery.fancybox.pack.js"></script>
<!--fancybox helpers-->

<link rel="stylesheet" href="<?php bloginfo(template_directory); ?>/javascripts/fancyBox-2/helpers/jquery.fancybox-buttons.css"/>
<script src="<?php bloginfo(template_url); ?>/javascripts/fancyBox-2/helpers/jquery.fancybox-buttons.js"></script>
<!-- js jQuery qtip plugin ====================== -->
<script src="<?php bloginfo(template_url); ?>/javascripts/jquery.qtip-1.0.0-rc3.min.js"></script>
<!-- toTop ====================== -->
<script src="<?php bloginfo(template_url); ?>/javascripts/goToTop.js"></script>
<!-- js jQuery my own functions ====================== -->
<script src="<?php bloginfo(template_url); ?>/javascripts/functions.js"></script>


<!-- <script src="javascripts/jquery.tweet.js"></script> -->

<!-- JS twitter scripts ================================== -->
<script src="http://twitter.com/javascripts/blogger.js"></script>
<script src="http://twitter.com/statuses/user_timeline/EnvatoWebDesign.json?callback=twitterCallback2&amp;count=5"></script>

    <!-- End Document
    ================================================== -->
    </body>

    </html>

我的这个方法对吗??如果没有，请纠正我..

Is my this way is correct?? If not then please correct me..

提前致谢

推荐答案

@qccreative 提供的答案是正确的.您应该使用您的主题中必须具有的functions.php 文件将您需要的所有js/css 文件包含到您的页面中.如果您没有它，只需创建一个并制作一个导入文件的功能，就像上面的答案一样.

The answer provide by @qccreative is the right one. You should include all the js/css files you need to your page using the functions.php file that you must have within your theme. if you dont have it just create one and make a function for import your files just like the answer above.

您甚至可以管理要加载脚本的页面.

you can even manage in what page you want to load your scripts.

这也是 WP 提供的以有组织的方式包含脚本的最安全的方式.

also this is the safest way WP provide for including scripts in an organized way.

wordpress 提供的这个钩子 WP_ENQUEQUE_SCRIPTS 它的一个功能是将您的操作中的脚本添加到网站.

this hook that wordpress provide WP_ENQUEQUE_SCRIPTS its a function that will add the scripts within your action to the site.

这是另一个例子:

function load_javascript_files(){

      wp_register_script( 'jquery-accordion', get_template_directory_uri() . '/js/jquery.accordion.js', array('jquery'),true );
      wp_enqueue_script('jquery-accordion'); 
  }

 add_action('wp_enqueue_scripts', 'load_javascript_files');

祝你好运

这篇关于将 js 文件和 css 文件添加到 wordpress的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！