mimi0323

瀬戸内ことりさん

不足していた情報を確認いたしましたので共有させていただきます。
実際の表示画面と、WordPress編集画面のスクリーンショットをあわせて添付いたします。

・使用しているプラグインの正式名称とバージョン：
3D FlipBook : DearFlip ライト版（バージョン 2.4.37）

・WordPressとテーマの名称・バージョン：
WordPressバージョン：7.1
テーマ：Inspiro Child（バージョン: 1.4.1.1631167551）

・関係する追加CSS： 808080 {

}
.bb-custom-wrapper, div[class*=”3d-flip-book”] {
}

・実際に使用されているショートコード：
[3d-flip-book id=”741″ ][/3d-flip-book]
（5つのカラムブロックの中に、それぞれ異なるIDのショートコードを1つずつ設置しています）

・添付したスクリーンショットと現在の状況について：

1. 1枚目（実際の表示崩れ画面）： パソコンで見ると正常ですが、スマホの実機（縦画面）で見ると文字やフリップブックの表示が不自然に縦に長く伸びてしまいます。また、一番左側のフリップブックだけが「Please wait… the Application is Loading」という表示のまま止まり、PDFが読み込まれません。
2. 2枚目（PC用編集画面）： 5つのカラムブロックの中に、それぞれ「ショートコード」と、その下に「説明文のテキスト」が縦に積み重なる形で並んでいる構造です。
3. 3枚目（モバイル用編集画面）： エディターを「モバイル」に切り替えた際の見た目です。ショートコードの枠（ボックス）自体が、横幅が極端に狭くなり、縦に細長く潰れて（引き伸ばされて）表示されてしまいます。

【確認手順が分からなかった項目】
「該当箇所の生成HTML」と、ブラウザコンソールの「Please wait…」となった際のエラーの詳細（Consoleタブ内の中身）については、知識不足のため上手く取り出すことができませんでした。

スクリーンショットの情報から、原因の切り分けや、スマホ表示を綺麗に1枚ずつ（単一ページ）で並べるための改善策（追加すべきCSSなど）についてアドバイスをいただけますと幸いです。どうぞよろしくお願いいたします。