wp enginue satır içi komut dosyası nedeniyle bağımlılıklar


35

Satır içi komut dosyaları için wp_enqueue_script () kullanmanın bir yolu var mı?

Bunu yapıyorum çünkü satır içi komut dosyam başka bir komut dosyasına bağlı ve yüklendikten sonra ekleme esnekliğini istiyorum.

Ayrıca, bu bir satır içi komut dosyasıdır çünkü php değişkenlerini javascript'e (tema yolu, vb.) Geçiriyorum

Şimdiden teşekkürler.

Yanıtlar:


33

Eh, wp_localize_script () yöntemine sahipsiniz, ancak bu yalnızca veri iletmek içindir.

Aksi takdirde, bunu yapabilirsiniz:

function print_my_inline_script() {
  if ( wp_script_is( 'some-script-handle', 'done' ) ) {
?>
<script type="text/javascript">
// js code goes here
</script>
<?php
  }
}
add_action( 'wp_footer', 'print_my_inline_script' );

Buradaki fikir, satır içi betiğinize, tam olarak bağlı olduğu betiğin ardından yazdırıldığından emin olmamanız gerektiğidir .


4
Şüphesiz bu, yalnızca bağlı olduğunuz komut dosyası zaten çıktıysa çalışır mı? Bağlandığınız komut dosyası da wp_footer'da kayıtlıysa ve satır içi komut dosyası kodundan sonra yürütülürse, satır içi komut dosyası istemciye yazılmaz ve bu nedenle çalıştırılır?
Sam Peacey



7

Bu çözüm @ scribu'nun cevabına benzer , ancak biçimini izler ve wp_enquque_script()eğer bağımlılıkları başlığa dahil edilmişse betiği başlığa koyar.

/**
 * Enqueue inline Javascript. @see wp_enqueue_script().
 * 
 * KNOWN BUG: Inline scripts cannot be enqueued before 
 *  any inline scripts it depends on, (unless they are
 *  placed in header, and the dependant in footer).
 * 
 * @param string      $handle    Identifying name for script
 * @param string      $src       The JavaScript code
 * @param array       $deps      (optional) Array of script names on which this script depends
 * @param bool        $in_footer (optional) Whether to enqueue the script before </head> or before </body> 
 * 
 * @return null
 */
function enqueue_inline_script( $handle, $js, $deps = array(), $in_footer = false ){
    // Callback for printing inline script.
    $cb = function()use( $handle, $js ){
        // Ensure script is only included once.
        if( wp_script_is( $handle, 'done' ) )
            return;
        // Print script & mark it as included.
        echo "<script type=\"text/javascript\" id=\"js-$handle\">\n$js\n</script>\n";
        global $wp_scripts;
        $wp_scripts->done[] = $handle;
    };
    // (`wp_print_scripts` is called in header and footer, but $cb has re-inclusion protection.)
    $hook = $in_footer ? 'wp_print_footer_scripts' : 'wp_print_scripts';

    // If no dependencies, simply hook into header or footer.
    if( empty($deps)){
        add_action( $hook, $cb );
        return;
    }

    // Delay printing script until all dependencies have been included.
    $cb_maybe = function()use( $deps, $in_footer, $cb, &$cb_maybe ){
        foreach( $deps as &$dep ){
            if( !wp_script_is( $dep, 'done' ) ){
                // Dependencies not included in head, try again in footer.
                if( ! $in_footer ){
                    add_action( 'wp_print_footer_scripts', $cb_maybe, 11 );
                }
                else{
                    // Dependencies were not included in `wp_head` or `wp_footer`.
                }
                return;
            }
        }
        call_user_func( $cb );
    };
    add_action( $hook, $cb_maybe, 0 );
}

// Usage
enqueue_inline_script('test','alert(\'enqueue inline script test\');',array( 'jquery'));

Not: Bu anonim işlevlerin kullanılmasını kullanır, ancak 5.3'ten önceki PHP sürümleri için bu kolayca bir sınıfa dönüştürülebilir.


5

WordPress 4.5’ten bu yana wp_add_inline_script () işlevini kullanabilirsiniz :

add_action( 'wp_enqueue_scripts', 'cyb_enqueue_scripts' );
function cyb_enqueue_scripts() {
   wp_enqueue_script( 'myscript', 'url/to/myscript.js', array(), '1.0' );
   wp_add_inline_script( 'myscript', 'Your inline javascript code gos here' );
}

4

Bulduğum en iyi yol wp_localize_script(), @scribu'nun önerdiği gibi kullanmaktır .

Genellikle, satır içi Javascript kullanmaya karar verdim, çünkü betiğime bazı PHP değişkenleri vermem gerekti. Bu ile çözülebilir wp_localize_script(). Bir örnek vereceğim:

$aFooBazı seçeneklere sahip bir diziniz var ve onu bir komut dosyasına geçirmeniz gerekiyor.

$aFoo = array( 'option1' => $option1Value, 'option2' => $option2Value ); 

Satır içi komut dosyası kullanarak:

<script> 
    var oFoo = {};
    oFoo.option1 = <?php echo $aFoo['option1'] ?>;  
    oFoo.option2 = <?php echo $aFoo['option2'] ?>;            
    //do some stuff with oFoo
</script>

Kullanarak wp_localize_script():

wp_register_script( 'script_name', 'pathToScript/script.js', array( 'jquery' )); //if jQuery is not needed just remove the last argument. 
wp_localize_script( 'script_name', 'object_name', $aFoo ); //pass 'object_name' to script.js
wp_enqueue_script( 'script_name' );    

O zaman pathToScript/script.jsolur:

var oFoo = {};
oFoo.option1 = object_name.option1;   
oFoo.option2 = object_name.option2;            
//do some stuff with oFoo (no PHP needed)

Bu şekilde, daha sonra sıralı komut dosyalarına ihtiyacınız yoktur.


3

Scribu kesinlikle doğru. Neyse, biraz bilgi eklemek istiyorum:

Ne kadar sıklıkla çağırıldığına bakılmaksızın, fonksiyonumun bir kere senaryo yazmasını istiyorum. Bu, içerikle ilgili bir fonksiyondur, bu yüzden herhangi bir kanca için bekleyemem. Bunu ortaya çıkarmak için scribus infos ve WP çekirdeği hakkında bazı bilgiler kullandım:

function print_script_once() {
    if(!wp_script_is('my-handle', 'done')) {
        echo "<script>alert('once!');</script>";
        global $wp_scripts;
        $wp_scripts->done[] = 'my-handle';
    }
}
add_action('get_footer', print_script_once);

Bu yöntemi kullanarak bir kez satır içi komut dosyası yazdırabilirim. Benim durumumda, bir paylaşım butonu yaratan ve tüm butonlar için bir komut dosyası gerektiren bir fonksiyonum var. Ama sadece bir kez.


echoSatır içi komut dosyası yaklaşımı Yirmi yedi tema bir noktada en azından inşa edildi nasıl. Ve ben de bu tekniği kullanıyorum. Harika çalışıyor ve farklı yerlere bağlanmanıza izin veriyor.
Josh Habdas
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.