在哪里添加代碼在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（）將其加入隊列