サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
トピックスターター 2018年6月23日 11:53
現在Cocoonを使わせていただいており、
詰まったので質問させていただきます。
CocoonはAMP時に画像のwidth,heightサイズを指定していないと
必ず300x300の画像サイズになってしまいます。
これを元の画像サイズで表示することは可能でしょうか？
解決方法あれば教えていただけると助かります
よろしくおねがいします。
2018年6月23日 12:55
これ 私も悩みどころでampに移行できない要因になってるのですが、基本的にampはwidthとheightを指定しないといけないらしいようです。
基本的にimgにwidthとheightを書き込めば、ampで正確に表示できると思います。
が、内部ファイルは頑張れば書き換えられるとしても、動的な外部ファイルは正直難しいですよね……
phpで読み込んでサイズ取得→タグに書き足し
とかなんですかね。
すみません。答えになってませんが
わいひら reacted
2018年6月23日 14:32
これを元の画像サイズで表示することは可能でしょうか？
例えばカエレバとか。画像のwidth・heightは元々入ってない仕様になるので、手作業で入れて対応していきます。
- やり方
１．画像のサイズをチェック。管理画面上・サイト上・カエレバ画像選択などで可能です。
要素の検証（詳細は検索すれば大量に出てきます。）画面、F12キーなどで開き、矢印ボタンを青くし、画像サイズを確認
２．画像を選択
管理画面上で画像を選択。そのままテキストエディタに
imgタグ内に width="" height=""と入れる
<img src="画像のパスjpg" />
↓ ↓ ↓
<img src="画像のパスjpg" width="160" height="268.06" />
全ページ・またはスマホ検索流入が多いページなどから、この作業を繰り返しをすれば、AMPでもキレイに画像が表示されます。
※カエレバを使うたびに指定すれば可能ですよ。
2018年6月23日 14:40
カエレバの画像（もしもアフィリエイト経由）の比率：縦長なものが正方形になりオカシイ件。と同様環境でカエレバ画像が小さい件。
これは、外部サイトにある画像の縦横幅は取得できないからです（やろうと思えばできるけど、画像をすべて外部サーバーから取り寄せて計測するので速さを犠牲にするので実装していないと言った方が正しいです。相手サーバにも負荷をかけることになりますし）。
なので、外部サイト画像の場合で、width、height属性が取得できない場合は、300x300サイズになります（カエレバはそのサイズのものをCSSで縮小表示されていると思われる）。
例えば、カエレバで取得できるIMGタグはこれです。<img src="https://images-fe.ssl-images-amazon.com/images/I/31-UZxlpDWL._SL160_.jpg" style="border: none;" />これに対してwidth、height属性があれば、それを利用するのですが、無いのでどうしようもありません。対応策としては、自前で属性を入力するか、カエレバにwidth、height属性を入れるように対応してもらうしかないです。
引用元：外部サイトにある画像の縦横幅は取得できない理由｜ｂｙ：MR.わいひら
※タイトルはリンク内容に変更
わいひら reacted
2018年6月23日 21:59
今思いついたんですが、AMP設定項目に以下の設定項目を追加すればよいのかなと。
- サイズを取得できない画像の横幅
- サイズを取得できない画像の縦幅
これを設定できたからといって、サイズが取得できないのには変わりないですが、サイズが取得できない不満点は、ほとんどの場合カエレバとかだと思うので、ある程度合わせたサイズには出来るのかもしません。
こういった機能があるとどうでしょう？
2018年6月23日 23:28
- 『サイズを取得できない画像の縦幅・横幅の件。』
あれば凄く便利ですよね！
- ただAmazonの画像とか『縦横の比率』を大事にしないとイケなかったように思うんですが？？
昔の情報かもしれませんし、Amazonの規約で見たのか？どこで見たか？忘れました…
Amazonとかに掲載する企業さんや店舗さんなども指定通りのサイズ（基準？サイズの例があればそれにならって？）にアップしてくれるとありがたいんですけどねっ。※規格外な縦長画像など、見た事があったので＾＾；
- 違反の部類でなかったばあい
この機能があれば便利そうですね！Amazon画像が縦長画像の場合は、手動でHTMLにwidth・heightを入れたものが、優先的に反映すればさらに嬉しいかもです。
わいひら reacted
2018年6月23日 23:34
https://affiliate.amazon.co.jp/help/topic/t15/a11
・商品画像を加工する。
商品画像の加工はおやめください。画像のサイズを変更される際には、元のサイズの縦横の比率を変更しないようにしてください。・商品画像をダウンロードして利用する。
商品画像を保存後、任意のAmazonではないサーバーにアップしなおしての利用はできません。Amazonが提供している商品画像URLを指定する形でご利用ください・Amazon.co.jpでキャプチャした画像を使用する。
Amazon.co.jpでの商品画像は随時変更されることがありますので、キャプチャした画像は使用しないでください。
Amazonアソシエイトのヘルプでありました。注意点としてお願いされてるようです。
わいひら and lightning2014 reacted
2018年6月24日 22:11
AMPでサイズを取得できない画像サイズを設定できたとしても、現在の仕様でもどっちでもダメっぽいですね。
どうしたものか…。
2018年6月25日 03:34
過去記事はやっぱり自力ですね・・
追記編集：
万が一採用され、実装された場合。
自力でwidth・heightを入れるか再設定が必要っぽいかも？
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。