4
7

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

【Wordpress】javascriptでテーマディレクトリの絶対パスを取得する方法

Last updated at Posted at 2017-08-28

昔困ったことがあったので同じように困っている人がいれば...

#どういう時に必要になるか
例えば、Google Maps APIを使う時にピンをオリジナルの画像にしたい場合に、画像ファイルのパスを絶対パスで取得したい...!!
/wp-content/themes/とか書いてもいいんだけどメンテナンスを考えると宜しくない

#じゃあこうしよう
HTML5のカスタムデータ属性を使います
テーマディレクトリのパスをget_template_directory_uri()で取得します

header.php
<body id="l-body" data-tmpdir="<?php echo esc_url(get_template_directory_uri()); ?>/">

こうすればjsから参照できます

script.js
// map icon
var mapicon = $('#l-body').attr('data-tmpdir') + 'assets/images/mappin.png';
4
7
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
7

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?