Simplicityの特徴 › フォーラム › 不具合報告 › 「本文のみ(狭い)」に設定した記事のAMPページがスマホのwidthにならず右に突き抜ける
-
投稿者投稿
-
-
2018年4月28日 3:25 PM #59814
leda
ゲストわいひら様
お世話になります。
バージョン:2.6.0.9 をカスタマイズなしで使用させていただいております。現在、下記ページを
https://bitter-cinnamon.com/evidence/?amp=1「ページ設定」を、「本文のみ(狭い)」に設定して公開しております。
しかし、「ページ設定」を、「1カラム(狭い)」か、「本文のみ(狭い)」に
設定してAMPページをスマホで閲覧すると、
下記の画像のように、テキスト等がスマホ画面の幅で折り返さず、右側に突き抜けてしまいます。https://bitter-cinnamon.com/wp-content/uploads/2018/04/amppage01.jpg
https://bitter-cinnamon.com/wp-content/uploads/2018/04/amppage02.jpg「ページ設定」を、「デフォルト」、「1カラム(広い)」、「本文のみ(広い)」にすると直るようです。
この現象につきまして、もし、そちらのスマホでも再現性がありましたら、
ご対応いただきたくお願いいたします。「1カラム(狭い)」か、「本文のみ(狭い)」の場合、
AMPページでもPC用の width が有効になってしまってはいないでしょうか?
改行位置がPCとだいたい同じです。お手数をおかけして恐縮ですが、よろしくお願いいたします。
-
2018年4月28日 10:41 PM #59820
わいひらキーマスター親テーマフォルダ内のamp.cssに以下のように追記すれば改善されるかと思います。
@media screen and (max-width: 740px){ #header-in, #navi-in, #body-in, #footer-in{ width: auto; } }これでうまくいけば、次のバージョンで適用したいと思います。
-
2018年4月29日 11:56 AM #59823
leda
ゲストお世話になります。
上記のコードを amp.css の一番最後に追加しましたが、
表示は変わらないようです。とりあえず、私のサイトは閲覧者の90%以上がスマホなので、
PC表示は意図するものとは違いますが、
「本文のみ(広い)」で公開することにいたします。他に影響が出ていると困りますので
amp.css はこれから元に戻します。問題が修正された次のバージョンがリリースされたら使用させていただきます。
お忙しい中、ありがとうございました。
-
2018年6月10日 1:31 PM #60178
leda
ゲストお世話になります。
バージョンアップされた Simplicityを2.6.8 を使用させていただきました。
しかしながら、下記の画像のように、スマホのwidthにならない問題が改善されておりません。
https://bitter-cinnamon.com/wp-content/uploads/2018/06/IMG_0471-577×1024.png《上記記事のURL》
https://bitter-cinnamon.com/batuiti/?amp=16.「本文のみ(狭い)」に設定した記事のAMPページがスマホのwidthにならず右に突き抜ける不具合修正
と記載されていましたが、こちらの修正は反映されていないのでしょうか?
お手数をお掛けしますがご回答の程よろしくお願いいたします。 -
2018年6月10日 7:48 PM #60181
Akira
ゲスト親テーマの amp.css の後に、親テーマの css-custom.php が読み込まれているのが原因みたいです。
css-custom.php の下記の部分が amp.css より後に読み込まれているので、画面幅 740px 以下で #body-in の幅が 740px になっています。
<?php //ページタイプが狭いか if ( is_singular() && is_page_type_narrow() ): ?> #header-in, #navi-in, #body-in, #footer-in { width: 740px; } #sidebar, .top-sns-follows{ display: none; } <?php endif;//is_page_type_narrow ?>子テーマの amp.css に下記の CSS を追加すると、親テーマの対応を待たずにすぐに修正できます。
@media screen and (max-width: 740px) { #header-in, #navi-in, #body-in, #footer-in { width: auto; } } -
2018年6月11日 10:36 PM #60185
わいひらキーマスター一応、修正してみたものをアップしておきます。
https://wp-simplicity.com/wp-content/uploads/2018/06/simplicity2.zip
-
-
投稿者投稿
- このトピックに返信するにはログインが必要です。