• ベストアンサー

リンクページがちゃんと画像表示されない

PHP5.0、Smartyで開発しています(個人サイト) リンクを押すと、リンクページ(自サイト)は表示されるのですが、 画像などが表示されないことがあります。 .tplファイルなので、↓の同じリンクをいくつものファイルに書きましたが、ふつうにちゃんと表示されるページもあれば、リンクページの画像落ちといったページにもなります。 これはどうしてでしょうか? </div><!--header--> <ul id="menu"> <li><a href="{$info.back_url}">TOP</a></li> <li><a href="{$info.http_url}">記事一覧</a></li> <li><a href="{$info.http_url}/archive">過去ログ</a></li> <li><a href="{$info.http_url}/search">記事検索</a></li> <li><a href="{$info.http_url}/rss">RSS</a></li> <li><a href="{$info.https_url}/admin">管理者用</a></li> </ul> <img src="./image/main_img.jpg" alt="" width="760" height="340" id="main-img" />

noname#102630
noname#102630
  • PHP
  • 回答数2
  • ありがとう数2

質問者が選んだベストアンサー

  • ベストアンサー
回答No.2

<li><a href="{$info.http_url}/archive">過去ログ</a></li> <li><a href="{$info.http_url}/search">記事検索</a></li> <li><a href="{$info.http_url}/rss">RSS</a></li> <li><a href="{$info.https_url}/admin">管理者用</a></li> もし、$info.https_urlが “/dir”など他の階層が含まれていたら、この4つに関しては、2階層になるので、 img src="../../image/main_img.jpg" とはなりますが、、、 $info.https_urlが単体だったら、ごめんなさい。

noname#102630
質問者

お礼

回答ありがとうございました。 おかげさまでできました。 すごいですね。 また、質問したときはよろしくお願いします。

その他の回答 (1)

  • Hardking
  • ベストアンサー率45% (73/160)
回答No.1

PHPファイルと画像ファイルの相対位置に誤りはないですか? (PHPファイルの保存場所の直下imageディレクトリー中にmain_img.jpgが存在するか)

noname#102630
質問者

お礼

回答ありがとうございました。 絶対指定したら、ちゃんと表示されましたが、 img src="./image/main_img.jpg" も img src="../image/main_img.jpg" も img src="../main_img.jpg" などもやってみましたが、だめでした。 一応、ルート構成を示しますと、 ルート index.php ├image-main_img.jpg └template-view.tpl と指定しております。 ちなみにメインのarticle.tplには、img src="../image/main_img.jpg" と記述していますが、okです。

関連するQ&A

  • 画像にリンクを張ったら、レイアウトが崩れました。

    ホームページを制作しているのですが、リストにして並べた画像にリンクを張ったら、レイアウトが崩れてしまいました。 まず、リンクを張らずにやってみました。 HTML部分 <ul id="main_center"> <li id="1"><img src="http://***.jpg" /></li> <li id="2"><img src="http://***.jpg" /></li> <li id="3"><img src="http://***.jpg" /></li> </ul> CSS部分 #main_center #1,#2,#3 { display: block; width: 220px; height: 20px; list-style-type: none; margin-bottom: 10px; } タグは以上の通りでやったところ、問題なく画像が綺麗に並んだのですが、 <ul id="main_center"> <li id="1"><a href="http://***/"><img src="http://***.jpg" /></a></li> <li id="2"><a href="http://***/"><img src="http://***.jpg" /></a></li> <li id="3"><a href="http://***/"><img src="http://***.jpg" /></a></li> </ul> といった感じで、画像にリンクさせたところ上下に余分なスペースが出来てしまいました。 リンクを張っただけで、レイアウトが崩れてしまうということはあるのでしょうか。 または、なにかタグが間違っているのでしょうか。 どなたかアドバイスをお願いいたします。

    • ベストアンサー
    • HTML
  • 画像リンクの上に文字リンクを乗せる方法は?

    画像(アイコン)リンクの上にテストで、文字リンクを貼りつけたいのですが、どのようにしたらよいでしょうか? ちなみに、リンク先はphpで読み込ませています。 ソースは <li><a href="<!--{$smarty.const.URL_DIR}-->abouts/index.php"><img src="<!--{$TPL_DIR}-->img/side/about_on.jpg" width="166" height="30" alt="当サイトについて" style="border: none" name="about" id="about" /></a></li> のようになっています。現在、画像(アイコン)リンクはこれで表示できています。 どなたかよろしくお願い致します。

  • 自社Webページ内の階層リンクへ飛ばない

    自社Webページ内の階層リンクへ飛ばなくなり困っています。 ドリームウィーバーでページを構築していますが、気づいたら同サイト内のリンクに飛ばなくなっていました。 <div id="menu"> <ul> <li><a href="#">トップページ</a></li> <li><a href="houjin.html">●●</a></li> <li><a href="tenpo.html">●●</a></li>     </ul> </div> div#menu ul { margin:0 auto; padding:10px 0; } div#menu li { font-size:85%;/* 12px相当 */ color:#2e2930; text-align:center; list-style-type:none; } div#menu li a { display:block; width:200px; color:#2e2930; line-height:60px; } /* マウスオーバー時 */ div#menu li a:hover { color:#f1f1f1; background:#2D2D2D url("img/bg_menu.gif") 0 0 repeat; } </li>が抜けていたので付け足しても変わりません。 他のページへのリンク(別窓で開く)は有効です。 考えられる原因を教えていただけると幸いです。 どうぞよろしくお願い致します。

    • ベストアンサー
    • CSS
  • シンプルな画像ギャラリー

    シンプルな画像ギャラリー シンプルな画像ギャラリーを探しています。ひとまず定番?のjqueryで探してみましたが見つからなかったので質問させてください。 多かったのが縮小画像をクリックすると拡大画像が表示されるものがほとんどでした。 実行したい事はテキストリンクをクリックすると拡大画像を表示する形式です。 具体的に表すと下記のような感じです。 <div id="main_image">※最初は01の画像を表示させたい</div> <ul id="galleryNavi"> <li><a href="img/01.jpg" class="current">01の画像</a></li> <li><a href="img/02.jpg">02の画像</a></li> <li><a href="img/03.jpg">03の画像</a></li> </ul> この状態で02の画像をクリックするとmain_imageの箇所に02の画像がフェードインしながら表示されa属性の01のclass="current"を消し02にclass="current"を付与させたいと思っております。 いくつかサンプルを見てみましたが画像をクリックするたびにURLの末尾にファイル名がつくものがありましたがURLは変えたくないです。 このような事を実現する場合どのように書けばいいのでしょうか?参考になるライブラリのサンプルでも構いませんので方法を教えてください!

  • Dreamweaverテンプレート内のナビ画像を、ページに合わせて変更

    グローバルナビを画像(img src)で作成し、Dreamweaverでナビをテンプレート化しています。以下のような構造です。 <ul id="Navi"> <li><a href="link1.html"><img src="link1.gif" /></a></li> <li><a href="link2.html"><img src="link2.gif" /></a></li> <li><a href="link3.html"><img src="link3.gif" /></a></li> <li><a href="link4.html"><img src="link4.gif" /></a></li> <li><a href="link5.html"><img src="link5.gif" /></a></li> </ul> 疑問なのですが、上記のナビゲーションをdwtでテンプレ化すると、各HTMLファイルではナビ部分はロックがかかって編集できなくなりますが、その状態で、 「ナビ内の、今いる階層に対応したボタンの色を変える(=別の画像にする)」 方法は何かありますでしょうか? (例:会社概要のページにいる時はナビ内の「会社概要」ボタンの色を変える) コーディングのTips、.jsライブラリ、どんな解決策も大歓迎です。 ユーザビリティの確保+作業の効率化のため、是非解決したい問題ですので、宜しくお願い致します。

    • 締切済み
    • CSS
  • リンクがうまくできません。

    リンクがうまくできません。 ホームページのテンプレートをダウンロードし、メモ帳で編集しているところです。 ダウンロードしたものの中にindex.html(トップページ)とpage1.html(リンク先)が入っています。 トップページにリンクを他にも作りたいので、page2,page3,・・とつくったのですが、 <UL id="menu"> <LI><A href="page1.html">about</A></LI> <LI><A href="page2.html">photo</A></LI> <LI><A href="page3.html">blog</A></LI> <LI><A href="page4.html">link</A></LI> <LI><A href="page5.html">mail</A></LI> </UL> こうした場合に、page1.htmlはちゃんとリンクできるのですが、それ以外のリンクが出来ません。 何か間違えているんでしょうか? それとも、他に何かしなくてはならないことがあるんでしょうか? 初歩的な質問かもしれませんが、よろしくお願いします。

  • 画像にリンクを張ると画像がずれるのを解消したいです

    ホームページ作成初心者です。 ある個所の画像にリンクを張ると画像がずれて、表示がおかしくなります。 CSSで横幅を設定した中に同じサイズの画像を配置しています。 詳細をご覧いただきアドバイス頂けたら幸いです。よろしくお願いいたします。 html <div id="sidenavi2"> <ul> <li id="midashi2"><img src="image/os_side.jpg" width="200" height="56"></li> <li><a href#">あああ</a></li> <li><a href#">あああ</a></li>     <li><a href#">あああ</a></li>     <li><a href#">あああ</a></li> </ul> <p><img src="image/message.jpg" width="200" height="65" border="0"></p> <p><img src="../open_service/siryo_seikyu.jpg" width="200" height="62"></p> </div> css #contents #sidenavi2 { padding: 0px; float: right; height: auto; width: 200px; margin-right: 5px; margin-bottom: 0px; margin-left: 0px; } 情報が不足する点があるかもしれませんが、よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • リンクの色を保持

    iframeに表示されたページが、main.htmlのどのリンクを表示しているか分かるよう、main.htmlのページが表示された時に、リンク1の背景に色をつけたいと思っています。そして、リンク2がクリックされた時は、リンク2をクリックしていることが分かるよう、リンク1の背景の色をなくしリンク2の背景に色をつけたいと思っています。 つまり、 (1)main.htmlのページが表示された時に、リンク1の背景に色をつける (2)リンク2がクリックされた時は、リンク1の背景の色をなくしリンク2の背景に色をつける (3)リンク3がクリックされた時は、リンク2の背景の色をなくしリンク3の背景に色をつける をしたいと思っています。どのようにすればいいでしょうか?よろしくお願いします。 <--test.html--> <html> <head> <Meta Http-equiv="content-type" Content="text/html; charset=Shift_JIS"> <Title>テスト</Title> </Head> <body> <ul> <li><a href="main.html">main</a></li> </ul> </body> </html> <--/a.html--> <Html Lang="ja"> <Head> <Meta Http-equiv="content-type" Content="text/html; charset=Shift_JIS"> <Title>テスト</Title> </Head> <Body> <iframe src="http://yahoo.co.jp" name="test"></iframe> <ul> <li><a href="http://yahoo.co.jp" target="test">リンク1</a></li> <li><a href="http://www.goo.ne.jp/" target="test">リンク2</a></li> <li><a href="http://www.biglobe.ne.jp/" target="test">リンク3</a></li> </ul> </Body> </Html>

  • phpでカテゴリページ別に記事を表示

    例えば以下のようなカテゴリメニューがあり、 りんごをクリックすると、ringo.phpにりんごカテゴリに属する記事をすべて表示する。 っといったようなことをする場合、wordpressを使わずにやるにはどうすれば良いのでしょうか? <ul> <li><a href="ringo.php">りんご</a></li> <li><a href="mikan.php">みかん</a></li> <li><a href="budou.php">ぶどう</a></li> </ul> 一番簡単そうなのはカテゴリメニューに以下のようなidをつけて、 もしidが1ならばりんごの記事をすべて書き出すのようにすれば良いのかと思いますが、 このようなやり方をしているサイトはあまり見かけません。 皆さんはブログやCMSでは一般的にどのようなやり方をされているのでしょうか? <ul> <li><a href="ringo.php?id=1">りんご</a></li> <li><a href="mikan.php?id=2">みかん</a></li> <li><a href="budou.php?id=3">ぶどう</a></li> </ul>

    • ベストアンサー
    • PHP
  • ブログのメニューバー内に画像表示をしたいのですが

    どうかお助け下さい。 以下の画像のように、メニューバー内のテキスト隣に画像表示をしたいのですが・・・ http://blog-imgs-54.fc2.com/p/a/c/pachislo777question/2012y06m13d_134350964.jpg http://news4vip.livedoor.biz/ どうしてもうまくいきません。 以下のURL先にあるメニューバー表示方法を使ったのですが・・・ http://10plate.blog44.fc2.com/blog-entry-176.html どうしても↓のようにズレが出てしまいます。 http://blog-imgs-54.fc2.com/p/a/c/pachislo777question/2012y06m13d_134411361.jpg 具体的には以下のように設定しました。 ▼HTMLタグ <ul id="menu_bar"> <li><a href="<%url>" style="width:120px;">トップページ</a></li> <li><a href="http://pachislo777question.blog.fc2.com//?xml" style="width:70px;"><Img Src="http://blog-imgs-54.fc2.com/p/a/c/pachislo777question/RSS.png" Width="30" Height="30">RSS</a></li> <li><a href="<%url>" style="width:120px;">???</a></li> <li><a href="<%url>" style="width:120px;">???</a></li> <li><a href="<%url>" style="width:120px;">???</a></li> <li><a href="<%url>" style="width:120px;">???</a></li> </ul> 画像に対してAlignタグでテキストを回り込ませると、”RSS”のテキストが自動で中央中段表示になっているようで、どうしても崩れてしまいます。 又、ボタン自体を画像表示させようとも考えたのですが、やはり崩れるようで諦めました・・・ どのようにすればメニューバー内に画像を表示させる事ができるでしょうか? どうぞよろしくお願いします。

専門家に質問してみよう