サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Topic starter
2019-01-27 01:18
ブログ内でビフォーアフターの画像を表示させたくて、
ビフォーアフターで画像を表示させるプラグイン「Twenty20 Image Before-After」を使用ようとしたのですが、記事内で画像が表示される場合と表示されない場合があります。
以下のトピックを見たのですが、原因が全くわからない状態です。
ビフォーアフター系プラグインが動作しない | 不具合報告 | Cocoon フォーラム
ビフォーアフター画像をうまく表示させれない状態を解決させたいです。
お手数ですが、解決するお知恵をいただければ幸いです。
よろしくお願いします。
2019-01-27 03:05
こんにちは。
どの記事のどれが表示されていてどれが表示されていないのかがわからなかったので詳しく説明をしていただいた方が回答しやすいかと思います。
とりあえず可能性がありそうと思った部分ですが、「Cocoon設定＞高速化」ページ「Lazy load設定＞遅延読み込み（β版）」の「Lazy loadを有効にする」のチェックを外しても表示されないでしょうか？
わいひら reacted
Topic starter
2019-01-27 16:11
草村 様
返信ありがとうございます。
画像表示の具体的な説明がなく申し訳ありません。
記事を制作する前の段階で、プレビュー確認してみたところ、表示されない画像があり、他の画像で試すと表示されるものが出たりとありました。
約20KB〜30KBほどの画像2枚を使用すると表示されましたが、約100KBの画像を使用してみたところ、表示がされませんでした。
そこで、約100KBの画像をを圧縮して約20KBにしたのですが、この場合も同様に表示がされませんでした。
表示の問題に関しまして、
お教えいただいた、「Lazy load設定＞遅延読み込み（β版）」の「Lazy loadを有効にする」のチェックを外したところ表示されました。
色々と試してみましたが、全ての画像で表示されています。
草村様、問題を解決していただき、ありがとうございます。
わいひら reacted
2019-01-27 17:41
問題が解決したようでよかったです！
不具合が再現される状況について詳しくありがとうございます。
Lazy loadが有効の時に表示されたりされなかったりするのは、もしかするとファイル名と代替テキストの長さに関係があるかもしれません。
imgタグの文字列(< img ~~~>)が1024バイト以上はLazy loadを適用しない仕様みたいなので、適用されていない画像のみがプラグインで表示出来たのかも…※推測です
CocoonのLazy loadは除外設定が可能なのでプラグインで使う画像に共通のファイル名(twentytwenty等)を含めるようにしてその文字列を除外すれば、プラグインが正常に動作するかもしれません。
もし遅延読み込みを有効にしたい場合は試してみてください。
わいひら reacted
Topic starter
2019-02-02 15:21
草村 様
問題解決できました。
本当にありがとうございます。
また、
遅延読み込みを有効にしたい場合の方法もお教えいただき
本当にありがたいです。
お時間を割いていただきましてありがとうございます！
質問を解決済みにさせていただきます。
2019-02-03 19:42
実際のURLを提示出来ないのですが、テスト環境でプラグインを試した時のものを書いておきます。
プラグイン「Twenty20 Image Before-After」の場合、
以下のようなショートコードを記述します。
[twenty20 img1="画像番号1" img2="画像番号2" offset="0.5"]
すると次のようなHTMLが出力されます。
わいひら reacted
2019-02-03 21:45
タグ例をありがとうございます！
imgタグには、クラス名は入らないんですね。
それだったら、確かに以下の方法で除外するしかないかもしれませんね。
CocoonのLazy loadは除外設定が可能なのでプラグインで使う画像に共通のファイル名(twentytwenty等)を含めるようにしてその文字列を除外すれば、プラグインが正常に動作するかもしれません。
草村 reacted
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。