ブログ フリースペースに写真リンクを張る
初心者に簡単解説
こんにちは、さぽちゃんこと、奥野るり子です。
ブログを効果的に使う一つの方法を説明させてもらいます。
今日やっと、ブログのフリースペースに、好きな写真とそれを好きなページにリンクさせることに成功しました。
忘れないうちに、初めての人にも解りやすいように、解説してみます。
ここではアメーバブログを例に書いてみます。
はじめに、管理画面に入ります。
次に「設定・管理」をクリックします。
次は、「フリースペースの編集」をクリックします。
すると、フリースペースの編集画面が表示されます。
このタブはそのままで、新しいタブを開きます。
タブを右クリックしてから、「タブを複製」を選んで、左クリックします。
次に、新しいタブを「マイページ」に戻して、「ブログを書く」を選びます。
このとき、「標準エディター」出ない場合は。「管理画面」の「設定・管理」で変更してください。
「ブログを書く」の「画像」を選ぶと「画像のアップロード」タブが開きます。
ファイルを選択を選ぶと、あなたのパソコンのファイル挿入画面が開きます。
挿入したいファイルを選び、「開く」を左クリックします。
アップロードしたいファイル名かどうか、確認してから、「アップロード」を右クリックします。
「アップロードが完了しました」と表示されたから、「画像の挿入画面」が表示されます。
「この画像を使う」を左クリックすると「ブログを書く」の画像に、エディターが挿入されます。
<a href="http://stat.ameba.jp/user_images/20141106/17/sapochan365/20/f9/j/o0457034213121155251.jpg"><img src="http://stat.ameba.jp/user_images/20141106/17/sapochan365/20/f9/j/t02200165_0457034213121155251.jpg" alt="フラワーセラピー" width="220" height="165" border="0" /></a>
と挿入されます。
<a href="
http://stat.ameba.jp/user_images/20141106/17/sapochan365/20/f9/j/o0457034213121155251.jpg
"><img src="
http://stat.ameba.jp/user_images/20141106/17/sapochan365/20/f9/j/t02200165_0457034213121155251.jpg
" alt="
フラワーセラピー
" width="220" height="165" border="0" /></a>
このようの分解して解説します。
<a href="
これは、「リンクしますよ」という意味です。
http://stat.ameba.jp/user_images/20141106/17/sapochan365/20/f9/j/o0457034213121155251.jpg
これは、「先ほど挿入した画像のアドレス」で、ここにリンクしています。
なので、ここを、リンクさせたいアドレスに変更します。
私のページのアドレス「http://hitotuninarou.blog.fc2.com/」に変更します。
このままだと、ウインドウが切り替わってしまうので、「新しいウインドウで開く」「" target="_blank"」という言葉を入れます。
「画像」と入力して、選択してから、「リンク」を選びます。
アドレスをコピペしていれて、「新しいウインドウ」を確認してから、「リンク」を左クリックします。
挿入された部分から、「" target="_blank"」をコピーして、挿入する。
このとき「"」が二つ重なったら、一つを消して下さい。
上の部分だけを選択してコピーします。
「フリースペース編集」のタブを開いて、貼り付けます。
「保存」を押して、ブログを確認してください。
もし、画像が大きすぎて、表示されていない場合は、画像のサイズを変更します。
width="220" height="165" border="0" /></a>
「220」から、1割の22を引いて「178」を入力し、
「165」から、1割の16を引いて「149」と入力します。
width="178" height="149" border="0" /></a>
何度か試してみて、自分の好きな大きさに調節してください。
どうですか？
出来ましたか？
何かわからないことがあったら、気軽にメッセージ下さい。
さぽちゃんでした。
詳しくはこちら