• 締切済み

WordPress ウィジェットからの画像挿入

. WordPressでオリジナルテーマを作成しています。 ウィジェットのカスタムHTMLを使い画像を挿入したいのですが、メディアに入れた画像を<img src="/ドメイン/wp-content/uploads/hoge.png">で呼び出すことはできますが、テンプレートフォルダの配下につくったimgフォルダから呼び出すことはできますでしょうか? 以下のようにウィジェットのカスタムHTMLに記述しましたが画像は表示されませんでした。 <img src="<?php echo get_template_directory_uri(); ?>/images/hoge.png"> なにか良い方法がありましたら教えてください。 .

  • PHP
  • 回答数1
  • ありがとう数1

みんなの回答

回答No.1

実際に展開されたパスがあってますでしょうか? 特に、テンプレートといっても、階層の一部でしかないので、 画像だけ表示できないなどの制限はないので、パスが違うか、 パーミッション的にそこが見れない(403エラーなどならほぼこれ) パスが間違っている場合は、主に404エラーとなりますが。 その辺を確認してみてはいかがでしょうか?

milano-com
質問者

お礼

素早いご回答有り難うございます。 すいません、ちょっと勘違いしてまして、今回はオリジナルテーマでなく、子テーマからのテーマカスタマイズをやっておりました。すみません。 ですので、パスは以下のようになります。 <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/hoge.png"> 自分でつくったimgファイルから固定ページに呼び出せているコードをそのままコピーしているので、パス自体は問題なさそうですが、もう少し試行錯誤してみます。

milano-com
質問者

補足

<?php echo get_stylesheet_directory_uri(); ?>をやめて、以下のようにしたら表示され一応は解決いたしました。 <img src="https://hoge.com/wp-content/themes/hoge_child/images/hoge.png"> もし、なぜこちらだと表示されるのか理由をご存知でしたら教えてください。 お忙しい中、感謝します。解決のヒントになりました。ありがとうございました。

関連するQ&A

  • Wordpressでウィジェットに画像挿入したい

    Wordpressでウィジェットに画像挿入しようと、まずWordpressのメデイアに 画像を新規追加して、その画像をクリックしてその画像がでているhttp以下の アドレス(A)をコピーして、つぎに<img src="http://A.jpg"/>と書いて保存を して、Wordpressを見ましたら画像が插入されていなくて、小さいなにか絵の ようなものがあるだけで画像がないのですが、なにが不都合なのでしょうか? お教えよろしくお願いします。 28.7.10

  • WordPressの画像投稿のための設定方法

    WordPressで、画像をうまく投稿することができません。 お詳しい方、教えてください。お願いします。 ちなみに、現在の状況は、「public_html」フォルダの下に 「wordpress」→「wp-content」→「uploads」→年フォルダ →月フォルダ、となっています。本当は、月フォルダが自動 生成された中にアップロードした写真が入り、サイトに表示 されるはずが、エラーが出てアップロードできず、「uploads」 の外にこぼれた画像ファイル(つまり「wp-content」の中に 「uploads」フォルダと同列にある)だけが表示できる状態に なっています。フォルダ属性は、いずれも「707」になってい ます。

  • WordPressの固定ページに使う画像のパス

    WordPressの固定ページに画像を追加する際に管理画面の「メディアを追加」からimgタグを埋め込むと、src属性の値が絶対パスになると思います。 現状、わたくしがいま扱っているものはxampp環境下でホームのURLがlocalhost/wordpressとなっています。画像のsrc属性も http://localhost/wordpress/wp-content/uploads/~ となっています。 実際の本番環境にアップした場合、このままだと画像のファイルパスがエラーになるかと思いますが、開発環境下でも本番でもどちらでも表示できるような相対パスでの設定の仕方はあるのでしょうか。

    • ベストアンサー
    • HTML
  • Wordpressのソースについて質問です。

    Wordpressで知り合いのお店のサイトを作成しています。 (ページは20ページ程度で、お知らせとブログを設置しています) 今まで HTML+CSSでサイトを作っていたため、 Wordpressのソースコードが汚いというか ごちゃついて気になっています。 もっと整理して簡素化したいです。 例えば、【画像までのパスの場合】 任意の名前/wp-content/themes/任意の名前/img/sample.png この部分を img/sample.png のようにカットすることは可能でしょうか? 出来れば、サイトのソースを見られた時に 「Wordpressで作成された」ということを分からないようにするには どうしたらいいでしょうか。 何か方法はありませんか? よろしくお願いいたします。

    • ベストアンサー
    • CSS
  • z-indexについて...

    今回添付画像のように画像の上にアイコンを置きたかったのですがうまくいきません。 http://snapkidz.biz/wp/ cssのz-indexを使って熊のアイコンをpngで表示させればうまくいくのかな?と思ったのですが、うまく表示できませんでした。 ソースです。 <div id="header"> <ul class="haeder_bak"> <li><img src="http://snapkidz.biz/wp/wp-content/uploads/2011/12/blk_03.jpg" /> <li><img src="http://snapkidz.biz/wp/wp-content/uploads/2011/12/blk_04.jpg" /></li> <li><img src="http://snapkidz.biz/wp/wp-content/uploads/2011/12/blk_05.jpg" /></li> <li><img src="http://snapkidz.biz/wp/wp-content/uploads/2011/12/blk_06.jpg" /></li> <li><img src="http://snapkidz.biz/wp/wp-content/uploads/2011/12/blk_07.jpg" /></li> </ul> <div class="header_slider"> <img src="http://snapkidz.biz/wp/wp-content/uploads/2011/12/blk_09.jpg" /> </div> <div class="header_bear"> <img src="http://snapkidz.biz/wp/wp-content/uploads/2011/12/blk_03.png" /> </div> </div> CSSです。 #header{ width:100%; margin-top:15px; position :relative; z-index:0; } #header li{ float:left; } #header ul{ list-style-type:none; } .haeder_bak{ poaition:abosolute; z-index:10; } .header_slider{ poaition:abosolute; z-index:20; } .header_bear{ poaition:abosolute; z-index:30; } どうすれば添付画像のようにいきますか?

    • ベストアンサー
    • CSS
  • HTMLをWordPress化 CSSをどこに?

    HTMLをWordPress化にするための勉強をしています。 HTML側 CSS ヘッダー内 <link rel="stylesheet" href="css/test.css"> <link rel="stylesheet" href="css/test2.css"> JS ヘッダー内ではなく一番下</body>の前に配置 <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> <script src="js/test1.js"></script> <script src="js/test2.js"></script> ★これをfunctions.php に記述するにはどうすれば良いのでしょうか? function sample_scripts() {   // CSSの読み込み   wp_enqueue_style( 'jdsa-style', get_template_directory_uri().'/css/test.css', array(), '1' );   wp_enqueue_style( 'jdsa-style', get_template_directory_uri().'/css/test2.css', array(), '1' );   // jqueryの読み込み wp_deregister_script( 'jquery' ); wp_enqueue_script( 'jquery', get_template_directory_uri().'https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js', array(), '1.10.3', true );   // サイト内のjsの読み込み   wp_enqueue_script( 'jdsa-script', get_template_directory_uri().'/js/test1.js', array(), '1', true );   wp_enqueue_script( 'jdsa-script', get_template_directory_uri().'/js/test2.js', array(), '1', true ); }//ここまで 結果 ヘッダー内にtest.cssのみ記載、test2.cssは記載していない。 jsはどこにも記載していませんでした。 どこが間違っておりますか? 宜しくお願いします。

    • ベストアンサー
    • PHP
  • wordpressのjqueryが動かない

    wordpress3.8.1で作業しています。 会社のHPの作成用途でwordpressを使用しています。 何度か作成経験がありphpもなんとなく分かっているのですが、ここだけ解決せずです。 トップページにスライドショーのプラグインを入れたのですが動きません。 プラグインはWP-Cycleというプラグインです。 function.phpにはまだ何も記載していません。 header.phpはこんな感じの記載です。 ******************************************* <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html <?php language_attributes(); ?>> <head> <meta charset="<?php bloginfo( 'charset' ); ?>" /> <meta name="description" content="<?php bloginfo( 'description' ); ?>"> <title><?php bloginfo('name'); ?> <?php if ( is_single() ) { ?> &raquo; Blog Archive <?php } ?> <?php wp_title(); ?></title> <link rel="shortcut icon" href="<img src="<?php bloginfo('template_url'); ?>/images/favicon.ico" /> <link href="<?php bloginfo('stylesheet_url'); ?>" rel="stylesheet" type="text/css" /> <?php wp_head(); ?> </head> <body> <a name="pagetop_here"></a> <div class="wrap"> <div class="header"> <h1 class="h_logo"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><img src="<?php bloginfo('template_url'); ?>/images/h_logo.png"/></a></h1> <ul class="h_nav"> <li><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><img src="<?php bloginfo('template_url'); ?>/images/h_01.png"/></a></li> <li><a href="<?php echo esc_url( home_url( '/news' ) ); ?>"><img src="<?php bloginfo('template_url'); ?>/images/h_02.png"/></a></li> <li><a href="<?php echo esc_url( home_url( '/about' ) ); ?>"><img src="<?php bloginfo('template_url'); ?>/images/h_03.png"/></a></li> <li><a href="<?php echo esc_url( home_url( '/works' ) ); ?>"><img src="<?php bloginfo('template_url'); ?>/images/h_04.png"/></a></li> <li><a href="<?php echo esc_url( home_url( '/faq' ) ); ?>"><img src="<?php bloginfo('template_url'); ?>/images/h_05.png"/></a></li> <li><a href="<?php echo esc_url( home_url( '/company' ) ); ?>"><img src="<?php bloginfo('template_url'); ?>/images/h_06.png"/></a></li> <li><a href="http://ameblo.jp/ecoblue-smile/" target="_blank"><img src="<?php bloginfo('template_url'); ?>/images/h_07.png"/></a></li> <li><a href="<?php echo esc_url( home_url( '/contact' ) ); ?>"><img src="<?php bloginfo('template_url'); ?>/images/h_08.png"/></a></li> </ul><!--h_nav--> </div><!--header--> ******************************************* <?php wp_head(); ?>を無効にして外部の jqueryを読み込むにすると、スライドはおろか、縦に並んでしまいます。(cssが効いていないみたいです。) どこが原因なのかも分からないです。 ただ過去に同じheader.phpで同じプラグインが実装しています。 よろしくお願い致します。

    • ベストアンサー
    • PHP
  • jqueryでdata-の画像サイズの取得方法

    通常の場合、 <img src="hoge.png" /> $("img").on("load",function(){ var w = $(this).width(); var h = $(this).height(); $(this).css({"width":w +"px", "height":h +"px"}); }); でサイズは取得できますが、 <img src="hoge.png" data-src="hoge2.png" /> の場合でhoge2.pngの画像サイズを取得する方法を探しています。 分かる方がいらしたら教えてください。 よろしくお願いします。

  • WordPress 新しいディレクトリから画像表示させたい

    初歩的な質問すいません WordPressで、デザインとファイル構成をカスタマイズしようとしています そこで、初めからあるthemes配下のimagesなどに画像を入れると、パス指定で表示されるのですが 同じ階層に別のディレクトリを作り、そこに画像を置いて指定すると、画像が表示されません。パスはあっていると思います。 <img src="images/aaa.jpg"/> <img src="新設したディレクトリ/images/bbb.jpg"/> 上は表示されるが、下は表示されないという具合です。 ディレクトリはエクスプローラで、コンテンツ分追加して管理したいと思っています。 アドバイスよろしくお願いします。。

    • ベストアンサー
    • PHP
  • WordPress メディアライブラリ 変更

    WordPress移管のため、FTPソフトを使用してバックアップをし、新しいサーバにuploadsをアップロードしました。 ファイルのURLが http://新しいURL/wp/wp-content/uploads/2019/07/test01.jpg ↓ http://新しいURL/wp/wp-content/uploads/2019/07/test01-1.jpg ファイル名が「test01.jpg」→「test01-1.jpg」に変更してしまっています。 FTPソフトでuploadsフォルダを削除し、改めてアップロードしても「test01-2.jpg」 となってしまいます。 そのファイルは存在しないので、表示されません。 WordPressメディアライブラリを開いてファイル名を「test01-1.jpg」→「test01.jpg」に変更する方法があれば教えてください。 宜しくお願いします。

    • ベストアンサー
    • PHP

専門家に質問してみよう