web-dev-qa-db-ja.com

WordPress jsスクリプトファイルのパスURL

カスタムスクリプトを追加しました。

wp_enqueue_script('functions', get_bloginfo('template_url') . '/js/functions.js', 'search', null, false);

functions.js 私が持っています：

Reset.style.background = "url('../images/searchfield_clear.png') no-repeat top left";

かなりパーマリンクと.htaccessに変更するまで、これは以前は機能していました

フォルダ階層は次のようなものです。

themename/js themename/images（画像とjsフォルダーはthemenameフォルダーにあります）

../images-./image-/ imagesを試しました

通常、jsファイルがある場所は1レベル戻ります。..

フルパスを使用したくありません。

WordPressがjavascriptファイルで正しいパスを認識できる別の方法はありますか？

現在、私は自分が間違っていることを混乱させています。

javascriptwordpresswordpress-theming
44
Cam

wp_head()が呼び出される前にテンプレートのヘッダーにJS変数を設定して、テンプレートURLを保持することにより、フルパスのハードコーディングを回避できます。のような：

<script type="text/javascript">
var templateUrl = '<?= get_bloginfo("template_url"); ?>';
</script>

そして、その変数を使用して背景を設定します（これを行う方法はわかっていますが、他の人を助ける場合にのみこれらの詳細を含めます）。

Reset.style.background = " url('"+templateUrl+"/images/searchfield_clear.png') ";
65
AJJ

Wordpressのドキュメントによると、functions.phpファイルで wp_localize_script() を使用する必要があります。これにより、ヘッダーにJavascriptオブジェクトが作成されます。実行時にスクリプトで使用できます。

Codex を参照してください

例：

<?php wp_localize_script('mylib', 'WPURLS', array( 'siteurl' => get_option('siteurl') )); ?>

Javascript内でこの変数にアクセスするには、次のようにします。

<script type="text/javascript">
    var url = WPURLS.siteurl;
</script>
100
Chris
    wp_register_script('custom-js',WP_PLUGIN_URL.'/PLUGIN_NAME/js/custom.js',array(),NULL,true);
    wp_enqueue_script('custom-js');

    $wnm_custom = array( 'template_url' => get_bloginfo('template_url') );
    wp_localize_script( 'custom-js', 'wnm_custom', $wnm_custom );

およびcustom.jsで

alert(wnm_custom.template_url);
23
keithics

Javascriptファイルが管理ダッシュボードからロードされる場合、このjavascript関数はWordPressインストールのルートを提供します。管理ダッシュボードからajaxリクエストを行う必要があるプラグインを作成するときに、これをよく使用します。

function getHomeUrl() {
  var href = window.location.href;
  var index = href.indexOf('/wp-admin');
  var homeUrl = href.substring(0, index);
  return homeUrl;
}
2
Jam Risser

Genesisフレームワークを使用するユーザー向け。

子テーマに次を追加しますfunctions.php

add_action( 'genesis_before', 'script_urls' );

function script_urls() {
?>
    <script type="text/javascript">
     var stylesheetDir = '<?= get_bloginfo("stylesheet_directory"); ?>';
    </script>
<?php
}

そして、その変数を使用して、スクリプトで相対URLを設定します。例えば：

Reset.style.background = " url('"+stylesheetDir+"/images/searchfield_clear.png') ";
0
Toine Pel