画像を使ったカスタマイズをする時

ヘッダーや記事欄、その他細かいところのカスタマイズにも画像は必須！

画像を作成するソフトについては以前ご紹介しました♡

→画像編集のために使っているソフトとか。


画像を使ってカスタマイズをする際、

必ずタグに（画像URL）という部分があります。


この（画像URL）という部分には使用する画像のURLを貼りつけるのですが、


アメブロの場合、

PC内の画像のURLをそのまま貼りつけても表示されません。



一度アメブロの画像フォルダへアップロードして、

そのアメブロ画像フォルダの画像ＵＲＬが必要なんです。

画像のアップロードの仕方

アップロードは簡単にできます！


マイページの右上にあるメニューボタン をクリックし、

メニュー内から「画像フォルダ」をクリック。

そこからアップロードできます♪

もしくは


マイページから「ブログを書く」をクリックし、

ブログ記入ページ内の「画像をアップロードする」からもできます♪

 

画像URL取得の仕方

次に画像URLの取得の仕方です。


利用者が多いと思われる

Internet Explorer・Firefox・GoogleChrome

に限定して説明していきます。

safariはWindows版が提供終了してしまったためスミマセン。




先ほど画像のアップロードをしたのと同じく

マイページのメニューボタン から画像ファイルに飛び、

URLを取得したい画像をクリック。

（まずは左クリックです！ここで右クリックするとURLが変わってしまいます）

 
大きくプレビュー画像が表示されます。


ここまではどのブラウザも同じ。


ここからお使いのブラウザによって少し変わってきます。



Internet Explorerの場合

大きく表示されたプレビュー画像の上で右クリック
＆
「プロパティ」をクリック！

プロパティの中にURLが表示されていますので

一語一句逃さずにコピーして、

メモ帳に保存するなり、CSSに貼り付けるなりしてください。

 
 
 Firefox ・Chromeの場合 
 
 大きく表示されたプレビュー画像の上で右クリック
＆
「画像のURLをコピー」をクリック！

 これでURLがコピーできてますので、

メモ帳に保存するなり、CSSに貼り付けるなりしてください。

ブラウザを問わないURL取得方法

 ここまで説明しておいてアレですが…

ブラウザ関係なく取得する方法もあります。



※ブログの基本設定が

「新エディタ」または「タグ編集エディタ」

になっていることが前提です。




まずはマイページの

「ブログを書く」をクリック！

次にブログ記述欄の右側にある

画像一覧からURLを取得したい画像を選んでクリック！


 

画像が貼り付けられるので、

ブログ記述欄の上部にある「HTML表示」をクリック！

 
すると

ずらーっとHTMLが表示されるので、

その中からピンクでマーカーした部分をコピーしてください。

（ｈttp://stat.ameba.jp/user_images/～～～～.pngまたはgif）

たくさんのアルファベットに囲まれているのでわかりづらいですが、

一文字抜かしたり、

「 ” 」など余計なものまでコピーしてしまわないよう

十分気をつけてください！



ブログのカスタマイズで

「CSSはちゃんとコピペしたのに画像が表示されません！」

という方は

よくこの画像のURLをPC内のURLのまま貼り付けていたりします。


画像のURLの取得はカスタマイズをするにあたって

避けては通れません！


がんばりましょう～♡