写真と記事の境が同色とかで見分けにくい時は枠に入れると見やすい
写真のURLを知ることからスタート。
はてなブログだと、はてなフォトを開きアップロードしていく手もあるが
- 簡単なのは、ブログに写真をドラッグして、下書きのままでは写真が青くなって右クリック出来ないので、プレビュー画面にする。
- 写真の上で右クリック→プロパティをクリック
- すると真ん中辺にアドレス(URL)と出てるので、それをコピーする
間違いやすいのは、最初2行しか見えないが、3行ある時があるので、範囲指定をhttpから最後のjpgまでする事
- http://f.hatena.ne.jp/images/fotolife/r/r2okarain/20190420_～120.jpg
- はてなフォトで間違えやすいのは上のURL
- http://の後がh.hatenaになっているのは違う
- https://cdn-ak.f.st-hatena.com/images/fotolife/r/r2okarain/20190422132736.jpg
- http://の後がcdn-akから始まっているのをコピーすると良い
URLをメモ帳とかに記録しておく
HTML編集画面に変えて、下のコードを、枠を挿入したい位置にコピペする
<div style="border: 1px solid #cccccc; border-radius: 10px; padding: 10px; width: 80%;">
<p>ここに本文を入れる</p>
</div>
貼り付けたら、編集みたまま画面に戻る
先ほどの写真URLをコピーする
それを枠の中の「ここに本文を入れる」にコピペすると
この画面になるので
画像にチェックを入れて「選択された形式でリンクを挿入」をクリックする
すると枠の中に写真がリンクされて表示される
こんなに境界がハッキリしてる時は、意味ないけど・・・
