web-dev-qa-db-ja.com

体に荷を積む

私は現在、Google EarthツアーをショートコードでWP投稿/ページに埋め込むプラグインを開発しようとしています。

私が遭遇している問題は、ツアーをロードするために、onload="init()"を<body>タグに追加する必要があるということです。

特定のテンプレートファイルを変更できますが、これはリリース用なので、フックを使用して動的に追加する必要があります。何か案は？

hooksjavascriptplugins
5
Norcross

もう少し掘り下げて、それを機能させるための「より良い」方法を見つけました（グーグルは、彼らの気の利いたアースツアーを埋め込むことを難しくし、そして彼らのガジェットは機能しません）。

ショートコードとカスタムフィールドを組み合わせた プラグイン を作成しました。

0
Norcross

そして、これが（Mikeが最初のコメントで示唆したように）jQueryソリューションです。

function add_my_scripts() {
    wp_enqueue_script('jquery');
    wp_enqueue_script('my_init_script', SCRIPTSRC, 'jquery', '1.0');
}
add_action('init', 'add_my_scripts');

その後、これを行うスクリプトをプラグインに追加します。

jQuery.noConflict();

jQuery(document).ready(function($) {
    init();
}

これはjQueryを競合モードなしで起動し（まだ起動していない場合）、ドキュメントの準備ができたらinit()メソッドの呼び出しを追加します。 body onready()関数は1つのものしか呼び出せないため、onready()よりも安全な方法です。他のプラグインが邪魔をしないように、またはその逆になるように、できるだけプラグインを目立たないようにすることをお勧めします。

9
EAMann

これがアプローチです。あなたはあなたのフックの内側にadd_action()呼び出しを追加するでしょう、と私は思います。ここに含まれているJavaScriptはinit関数が既に定義されていることを前提としています。そうでなければ、これは失敗するでしょう、しかし私があなたを正しく理解しているならば、スクリプトを含むことはあなたが既に解決した問題のように思われます。必ずしもwp_footに追加する必要はありません。wp_headにも簡単に追加できます。

<?php

function mypluginprefix_onload_init() { ?>
<script language="text/javascript">
// check for the standards-compliant way to add onload events
if ( typeof(window.addEventListener) !== 'undefined' )
    window.addEventListener( "load", init, false );
// or the older msie nonstandard way
else if ( typeof(window.attachEvent) !== 'undefined' ) {
    window.attachEvent( "onload", init );
}
</script>
<?php }

// this goes in your hook
add_action('wp_foot', 'mypluginprefix_onload_event');
?>
4
artlung

JQueryでこれを行う可能性を無視することの1つは、template_includeフィルターをフックし、コールバックでob_start()を使用することです。次のコードのように、コールバックは'<body'で文字列検索を行い、それを'<body onload="init()"'で置き換えることができます。あなたはそれをあなたのプラグインに直接ドロップすることができるはずです、ちょうどあなたのプラグイン自身の命名規則に従うように名前を変更することを忘れないでください：

<?php
add_filter('template_include','start_buffer_capture',1);
function start_buffer_capture($template) {
  ob_start('end_buffer_capture');  // Start Page Buffer
  return $template;
}
function end_buffer_capture($buffer) {
  return str_replace('<body','<body onload="init()"',$buffer);
}

私があなたであれば、私は上記のコードがまだ完全に堅牢であるとは思いません。質問に答えるために一緒に投げただけなので、すべてのEdgeのケースを処理することはできませんが、最低限、通常のケースを達成する方法を示し、次にいくつかのユースケーステストですべてを処理できます。重要なEdgeのケース（'<BODY'が大文字の場合など）

2
MikeSchinkel

これは、jQueryの有無にかかわらず、ページロードにコールバックを動的に追加するためのJavaScriptです。

function add_onload() {
    ?>
    <script type="text/javascript">
    my_onload_callback = function() { alert('Hello!'); }; // test function

    if( typeof jQuery == "function" ) { 
        jQuery(my_onload_callback); // document.ready
    } else {
        document.getElementsByTagName('body')[0].onload = my_onload_callback; // body.onload
    }
    </script>
    <?php
}
add_action( 'wp_footer', 'add_onload' );

あなたの場合は、my_onload_callbacksをあなたのinitメソッドに置き換えるだけです。

1
Annika Backstrom