在wordpress js文件中添加代码的位置？

Question

我无法在哪里添加一些js / jquery。码。我的wordpress模板中有一个js文件，想要添加一段简单的代码来显示/隐藏div，尽管它打破了现有的js / jquery。我在哪里将它添加到文件中，因此它不会破坏它和/或构造此文件的方式是什么？

现有的Wordpress JS文件......

jQuery(document).ready(function( $ ) {


//VIDEO

    var iframe = $('.videoPlayer')[0],
        player = $f(iframe),
        status = $('.status');

// When the player is ready, add listeners for pause, finish, and playProgress
    player.addEvent('ready', function() {
        status.text('ready');

        player.addEvent('pause', onPause);
        player.addEvent('finish', onFinish);
        player.addEvent('playProgress', onPlayProgress);
    });

  // Call the API when a button is pressed
    $('.playPause').bind('click', function() {
        player.api($(this).text().toLowerCase());
       console.log('clicked'); // triggers
       player.api('paused', function(paused) {
       console.log('inside paused'); // doesn't trigger
            if (paused) {
              player.api('play');
            }
            else {
              player.api('pause');
            }
       });


    });    


    var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;

    // IFRAME RESIZE

    function videoWrapper() {
        var winW = $(window).width(); 
        var winH = $(window).height();
        var winR = winH / winW;
        var video = $("#videoContainer iframe");
        // console.log( winW, winH, winR );

        // ratio of original video
        var vidR = video.attr("height") / video.attr("width");
        // ratio of iframe
        var ifrR = video.height() / video.width();
        // ifrR nedds to be 0.65

        //var diff = winW / (winH / vidR);
        if ( winR > vidR ) {
            // diff between current video height and winH
            var diff = winH / (winW * vidR);

            var newW = winW * diff;
            var newH = winW * diff * 0.65;

            video.css({
                "width": newW,
                "margin-left": 0 - (newW - winW) / 2,
                "margin-top": 0 - (newH - winH) / 2,
                "height": newH
            });
        } else {            
            video.css({
                "width": winW,
                "margin-left": "",
                "margin-top": 0 - ( (winW * 0.65) - winH ) / 2,
                "height": winW * 0.65
            });         
        }
    }

    // VIDEO SELECT

    if ( iOS ) {
        $("#kvVideo").remove();
        $("#kvVideoMobile").show();
    }

    // VIDEO MUTE

    if ( iOS ) {
        var iframe = document.getElementById("kvVideoMobile");
    } else {
        var iframe = document.getElementById("kvVideo");
    }

    var player = $f(iframe);

    player.addEvent('ready', function() {
        // player.api('setVolume', 0);

        // $("#videoContainer").on('click', function() {
        //     // Play the video
        //     player.api('play');
        //     alert("play");
        // });
    });

    function muteVideo () {
        player.api('setVolume', 0);
        mute = true; 
        $("#mute_button").hide();
        $("#volume_button").show();
        // console.log("mute"); 
    }

    function unmuteVideo () {
        player.api('setVolume', 1);
        mute = false;  
        $("#mute_button").show();
        $("#volume_button").hide(); 
        // console.log("unmute");         
    }

    var mute = false;
    $('#button').on("click", function(){
        // console.log("button click");
        if ( !mute ) {
            muteVideo();
        } else {
            unmuteVideo();
        }
    });



    // EVENTS

    $(window).on("load", function(){
        videoWrapper();
    }).on("resize", function(){
        videoWrapper();
        sectionCalc();
    });



});

我要添加到js文件中的代码的第二部分，因此它将与已存在的代码一起使用...

$(document).ready(function(){
    $(".colophon").hide();
    $(".newsletter").hide();

    $("#colophon").click(function(){
        $(".newsletter").hide();
        $(".colophon").fadeToggle('slow');      
    });

    $("#newsletter").click(function(){
        $(".colophon").hide();
        $(".newsletter").fadeToggle('slow');      
    });
});

谢谢！

Answer 1

我会创建你自己的文件，然后在你的functions.php文件中使用WordPress wp_enqueue_script()对其进行排队