- ベストアンサー
ブログ画像のURLが分からない!?画像のURLを見つける方法を教えてください!
- ブログ画像のURLが分からない!ブログ本文に貼ってある画像ではなく、表示されている画像のURLが分からない場合の対処法を教えてください。
- 通常なら右クリックから画像を保存できますが、この場合はリンク先を保存するしかできません。ソースからもURLを見つけることができません。
- 自分のブログでも同様の問題が発生しており、古いブログの画像URLを見つけることができません。どのような方法でURLを見つけることができるのでしょうか?
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
ソースの中にはタイトル画像のアドレスは書かれていないのです。 テンプレートのCSSの中に書かれています。 ページソース(HTML)とCSSは別ものです。 ただし、ソースの中に、CSSのアドレスが書かれています。 ですから、まずソースを見て、テンプレートCSSのアドレスが書かれているところ探します。 で、amabaの場合、テンプレートCSSのアドレスは http://usrcss.ameblo.jp/skin/templates/***********/***********/*******.css です。 で、ここからですが、CSSを開きます。firefoxでしたら、そのままCSSの部分をクリックすれば開けると思います。 そこから、ヘッダー部分(タイトル画像)のアドレスを探すことになります。 ソースの中からbackground:を探すのではなく、CSSの中から探してください。 background:よりも#header探したほうが見つかりやすいかと思います。
その他の回答 (2)
- kiyoto-777
- ベストアンサー率74% (133/178)
1.ヘッダー画像の多くは背景画像なので、右クリックしても画像のURLは 調べられません。 2.背景画像のURLを知るには、CSSファイルの中身を見て確認する。 3.デザインするなら、FireFoxのブラウザでFirebugのアドオンを入れれば 右クリックしてFirebugで要素を調査すれば、その部分の CSS、HTMLがすべて表示されます。 4.IEでもF12を押して開発者ツールを開いて開発者ツールのツール部分の 矢印(左斜め上に向いている矢印)をクリックしてページの調べたい 部分をクリックすれば表示されますが、使い方は難しいと思います。 5.FireFoxのブラウザは無料です。1つのPCに複数のブラウザを入れられます。 同時に動かせます。Firebugも無料です。 6.Firebugのアドオン(プラグイン)はFirefox以外に、IEやクロームの ブラウザ用のものもありますが、FireFoxのFirebugが一番使いやすい
お礼
回答有難う御座います 勝手に関係無いだろうと判断して書かなかったんですが ブラウザにはFirefoxを使用してます ただ…御指摘のアドオンを調べましたが 現在私は古いバージョンを使用しておりいれられませんでした バージョンは9なんですが、これに合うバージョンは 存在するでしょうか? バージョンをアップさせてない理由は 以前にバージョンアップさせた時 ブラウザが重くかった為に戻したからで 但し、いつ迄も古いバージョンを使用出来る訳じゃないんで 近いウチに変える予定ですが 思い理由や解決方法に関しては、長文の恐れが考えれるんで ここではカットさせて頂きます それと…これはアドオンで見てからの話だと思いますが そのアドオンが無しの場合、やはりCSS等を見つけるのは大変ですか?
- mikinon
- ベストアンサー率56% (613/1076)
自分のブログならCSSを確認すれば、すぐ分かります。 他の人のものでも、ページのソースを見て、CSSを見ればわかります。 http://ameblo.jp/yua-shinkawa/ ですと、ソースからテンプレートのCSSを探します。 21行目 <link rel="stylesheet" media="screen,print" type="text/css" href="http://usrcss.ameblo.jp/skin/templates/fe/a4/10014577868.css" charset="UTF-8" /> とあります。 http://usrcss.ameblo.jp/skin/templates/fe/a4/10014577868.css がテンプレートのCSSになります。 CSSをみて、#header部分のbackground:を探します。 /* ---------- header : ブログタイトル部分 ----- */ #header{ background:transparent url(http://stat100.ameba.jp/p_skin/official_a/yua-shinkawa/img/header.jpg) no-repeat scroll center top; とありますので、 画像のURLは http://stat100.ameba.jp/p_skin/official_a/yua-shinkawa/img/header.jpg
お礼
回答有難う御座います ただ…申し訳ありません 言われてる事は何となく分ったんですが まずテンプレートのCSSを探すと書かれてますが これは、どういう理由からですか? と言うのも、そこから “#header部分のbackground:を探します” と書かれてるんですが、その探したURLには テンプレートURL(?)の文字が判断出来ないんです つまり、テンプレートのCSSでは http://usrcss.ameblo.jp/skin/templates/fe/a4/10014577868.css と書かれてますが、画像のURLでは http://stat100.ameba.jp/p_skin/official_a/yua-shinkawa/img/header.jpg と書かれており、共通する部分は .ameblo.jp/skin/の部分しか無いですが これが該当する部分を探せという事でしょうか? それと “#header部分のbackground:を探します。” と書かれてますが これは、どうやったら簡単(?)に見つかるでしょうか? と言うのも、全ソースを見たんでは莫大なタグ等の量の為 ソースをメモ帳に貼り付け background:で検索したんですが全くヒットしなかったんです
お礼
回答有難う御座います “ページソース(HTML)とCSSは別ものです。” ハイ…詳細迄は把握してませんが 別物だという事迄は知ってました ただ、今回の件は結論から言うと成功しました まず今回教えて頂いたブログのURLに関しても テンプレートCSSのアドレスが見つかり そのURLをクリックすると画面が切り替わりました そしてヘッダーって言いましたか? 検索を使用して、#header{を入れ そこからバックグランドを見つけ その画像URLをブラウザに貼り付けたら 前回の回答でアップして頂いた画像URLが出ました そこで…今度は、もう1つのアメブロで試した所 これも問題無く画像URLを見つけられました ただ…御指摘のURLと少し違ったのが 御指摘のURLでは #header{ background:transparent url でURLが出て来ました しかし、もう1つの方は #header{ background:url とtransparentの文字が入ってなかったんですが それでもURLをブラウザに貼り付けると 問題無くトップの画像が出て来たんで成功したと判断しました ただ…ここで、もう1つ質問します これは私の今後の勉強として…なんですが 今回のアメブロのURLは教えて頂きました 従って、今後アメブロで似た様な事だったら分るだろうと思います しかし、問題(?)なのは 今後違うブログやHPで同じ様な物を見つけた場合なんですが これは、どうやって見つければ良いか?… つまり、見つけるポイントは何か?…という事です 今回の場合で例えると、私は最初の回答から <link rel="stylesheet" media="screen,print" type="text/css" href="http://usrcss.ameblo.jp/skin/templates/fe/a4/100 … charset="UTF-8" /> の中で、link relの項目内で"stylesheet""screen,print""text/css" の3つに注目 それが共通する行(?)で/skin/templates/の文字が入ってる物… そう推測してました しかし、今回の回答では http://usrcss.ameblo.jp/skin/templates/********* … との御指摘で、/skin/templates/に注目しました ただ…これはアメブロでの設定で 他のブログやHPでは違って来ると思います そこで聞きたいのが、これらで共通するポイントは何かという事 あるいは、それらを解説してるHP等を御存知なら それを教えて頂くか?又は、それらを見つけるには どんな言葉で検索すればヒットし易いかを教えて頂けないでしょうか?