IMUZA.com

<<WordPress(ConoHa)<<はてなブログ

ホーム / php / WordPressでiframeが表示されない(解決)

WordPressでiframeが表示されない(解決)

2022/07/29 php, Wordpress

タイトルは正確ではありません。WordPressでの iframe 関連のトラブルではあるのですが、表示されないのではなく、表示が iframe で止まってしまい、それ以降表示されないトラブルです。また、かなり特殊なケースですので、仮に同じ症状が出る場合でもあまり参考にはならないかもしれません。

  • iframe 以降表示されない症状
  • 原因と解消方法
    • 原因
    • 解消方法

iframe 以降表示されない症状

次の記事があります。テキストブロックの間に GoogleMap のコードをカスタムHTMLで入れています。

問題なければ次のリンク先のように表示されるはずです。

  • 問題のない表示

ところが次のように GoogleMap 以降表示されません。スクロールバーも含めてキャプチャしましたので iframe で止まっていることがよくわかると思います。

原因と解消方法

以前から気づいていたのですが、調べている時間がなく、とりあえず GoogleMap はリンクで済ませていました。で、今回調査して解消しました。

原因

原因は自作の関数でした。

目次を自動で挿入するために記事をスクレイピングして見出しタグ h2〜 を取り出す作業をしているのですが、記事を XPath として評価する際に iframe が空要素となっている場合 <iframe **** /> と変換されてしまうためでした。

その関数の記事はこちらです。

WordPress:目次をプラグインなしで自動作成、自動表示する

なぜこれに気づかなかったかは、これまた原因不明なんですが、記事編集画面では <iframe ***></iframe> と終了タグがちゃんと入っているのです。なのに、公開記事のソースでは

<iframe src="https://www.google.com/maps/embed?pb=!1m10!1m8!1m3!1d46382.49424228554!2d3.6835437!3d43.3998964!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sja!2sjp!4v1658909195241!5m2!1sja!2sjp" width="650" height="366" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"/>

となっています。これもまた調べなくてはいけません。

解消方法

現在のところ消極的な方法ですが、<iframe></iframe> の間にテキストを入れて空要素を解消しています。

<iframe src="https://www.google.com/maps/embed?pb=!1m10!1m8!1m3!1d46382.49424228554!2d3.6835437!3d43.3998964!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sja!2sjp!4v1658909195241!5m2!1sja!2sjp" width="650" height="366" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"><a href="https://goo.gl/maps/eUknoGe3KERFhkof" target="_blank" rel="noreferrer noopener">Google Map</a></iframe>

たとえばこんな感じです。

関数の方でなにか解決方法を考えなくてはいけません。

[Amazon限定ブランド]ZOZOTOP クールリング 28℃自然凍結 アイスネックリング ネッククーラー 首掛けクール ...

[Amazon限定ブランド]ZOZOTOP クールリング 28℃自然凍結 アイスネックリング ネッククーラー 首掛けクール …

1,820円(08/09 04:00時点)
Amazon
WordPressのデータベースを入れ替える
Twitter
Facebook
ブックマーク
LINEで送る

最初のサイドバー

最新記事

2022/07/29

WordPressでiframeが表示されない(解決)

2022/07/14

WordPressのデータベースを入れ替える

2022/07/7

WordPress:テーマをゼロから作ってみる(3)

2022/06/26

WordPress:Aレコード変更でウェブだけ他サーバへ移転

2022/06/13

WordPress Popular Posts 他のプラグインに変えたほうがいいかも

最新記事を一覧で見る

よく読まれている記事

よく読まれている記事を一覧で見る

カテゴリー

  • はてなブログ212
  • WebTips108
  • javascript95
  • Joomla!88
  • Windows68
  • CSS62
  • Joomla!更新53
  • Linux49
  • はてなテーマ45
  • Wordpress37
  • Plamo33
  • Google32
  • はてなプラグイン25
  • php19
  • Node.js18
  • SASS16
  • Ubuntu16
  • laravel415
  • Chrome10
  • cms-style10
  • iPhone9
  • genesis6
  • Git入門6
  • ConoHa WING5
  • Python4
  • Android4
  • SSD3
  • Docker3
  • スマートフォン3
  • Facebook3
  • Firefox3
  • 静的サイトジェネレーター3
  • Blankslate3
  • Mactype2
  • GitHub2
  • rails入門1
  • はてなブクマ1
  • Twitter1
  • 映画1
  • youtube1

Footer

My Web Sites

  • @半径とことこ60分
  • そんなには褒めないよ。映画評
  • IMUZA.com
  • GitHub

Another Sites

  • WordPress公式
  • WordPress関数リファレンス
  • PHPマニュアル

Contact Us

  • お問い合わせフォーム
  • Twitter
  • Facebook
  • Feedly

Copyright © 2022 · IMUZA.com