画像を本文の幅に合わせて表示＆別ウインドウで拡大画像をポップアップしたい (thread) | Questions List | ココログサポート Top

basic infomations

• ご利用中のOSは？:Windows 7
• ご利用中のブラウザーは？:Google Chrome
• ご利用中のプランは？:フリー＋広告ライトオプション

質問者です。
具体的には下記の記事の画像挿入のようにしたいです。

以前のブログで作成した記事です。

http://miya-wadachi.cocolog-nifty.com/blog/2016/10/post-1a07.html

画像の移行ができると、元のブログサイトからいわれて引越してきましたが、
後日、それが間違いだったといわれ、画像の貼り替えが必要となってきました。
（来年3月末にそのサイトが閉鎖されると、リンクされている画像が表示されなくなるため）

どうぞよろしくお願いします。

こんにちは。

画像のサイズや設定を変えて何度かテストしてみましたが、
ココログの設定では「画像を本文の幅に合わせて表示」と「別ウインドウで拡大画像をポップアップ」は両立しないようです。

※「画像を本文の幅に合わせて表示」を選択した時点で他の項目の選択肢はすべてグレーアウトして選択できなくなります。
これは既に選択したものが有効になっているのではなく、「他の項目は選択できない」ということのようです。

ココログの標準設定では同じことは出来ない仕様のようですので、取り敢えず現在の設定の中でご希望に近い状態にする方法について書いておきます。

【「画像を本文の幅に合わせて表示」で画像を挿入し、作成されたタグに別窓で開くためのタグを追加挿入する】

「画像を本文の幅に合わせて表示」を選択して画像を挿入すると下記のようなタグが挿入されます。

<a href="★クリック後の画像アドレス★"><img class="image-full" alt="画像の名前" title="画像の名前" src="☆ブログ記事表示用画像のアドレス☆" border="0" /></a>
※ 「★クリック後の画像アドレス★」と「☆ブログ記事表示用画像のアドレス☆」はアドレス自体は同じです。

このタグの<a href="★クリック後の画像アドレス★">に、別窓で開くためのタグ（下記）を追加します。

onclick="window.open(this.href, '_blank', 'width=xxx,height=xxx,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"

【変更後】
<a href="★クリック後の画像アドレス★" onclick="window.open(this.href, '_blank', 'width=xxx,height=xxx,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img class="image-full" alt="画像の名前" title="画像の名前" src="☆ブログ記事表示用画像のアドレス☆" border="0" /></a>

※追加するタグ中の「width」（幅）と「height」（高さ）にはクリックしたあとに表示したいウィンドウのサイズを半角の数字で指定します。
（上記では「xxx」で代用している部分です）

以上の処理で一応ご希望の表示方法になるはずですが、手間がかかりますしタグをいじるとミスの原因になるというリスクもあります。
オススメはしませんが、こうした方法もあるというご参考まで。

一応、自分のテスト用ブログで上記の処理をやってみた結果も置いておきます。
※後日削除するかもしれません。
http://nana-sea.cocolog-nifty.com/blog/2016/12/post.html

以上、また長文になってしまい申し訳ありません。
何かのヒントになれば幸いです。

no-nameさま

今回もわかりやすい説明、ありがとうございます！
ブログの引越でいろいろ面倒なことが多い中、
このようにアドバイスしていただける方がいらっしゃると
ココログに引っ越してきてよかったと思えます。

やはりできないのですね。
no-nameさまに確認いただいて、納得できました。

HPでタグも多少いじっているので、とても興味深かったです。
no-nameさまのブログでの実験？も確認させていただきました！
できればこのようにしたかったのですが、
ややこしいので欲は出さないで、ココログでできる範囲にとどめておきます。

と言いつつ、ちょっとやってみたい気もしているんですが（笑）

とりあえずココログですぐにできるやり方で画像を挿入。
その後、教えていただいたタグを、記事中のそのタグの下に貼り、指示通りに書き換えたらキレイにできました。

旅行記など、できればタイトルにあるやり方でしたかったし、思いのほか簡単だったので、活用させていただきます！

重ねてありがとうございました！