- 「フォーラムガイドライン」に必ず目を通してください。
- バージョンアップデート後に表示がおかしくなった場合は、
「SWELL設定」>「リセット」からキャッシュクリアを先にお試しください。 - フォーラム内検索で過去に同じようなトピックがないか検索してみてください。
フォーラム
カスタムHTMLにインスタグラムの埋め込みURLを入れて更新していますが、PCには普通に反映されて問題なく見れるのに、携帯で記事を見ても、インスタグラムの部分は表示されません。
CocoonからSWELLに移行してからの症状です。過去の埋め込みのある記事に関しても、新しく作った記事に関しても同様です。アドバイスくださいますと幸いです。
一例ですが以下のURLでインスタグラムの埋め込みをしています。
https://odekake.de/erdbeeren_duesseldorf/
https://odekake.de/grossmarkt/
Akismet Anti-Spam (v.4.2.4)
All-in-One WP Migration (v.7.61)
Category Order and Taxonomy Terms Order (v.1.6.1)
Complianz | GDPR/CCPA Cookie Consent (v.6.2.4)
Contact Form 7 (v.5.6)
Google Language Translator (v.6.0.15)
Regenerate Thumbnails (v.3.1.5)
Revision Control (v.2.3.2)
SEO SIMPLE PACK (v.2.4.2)
Site Kit by Google (v.1.77.0)
WP Fastest Cache (v.1.0.2)
WP Multibyte Patch (v.2.9)
XML Sitemap & Google News (v.5.3.3)
【SWELL】乗り換えサポート from Cocoon (v.1.1.2)
ご自身で以下の CSS を設定しているようです。
599px 以下の場合には非表示にするという設定ですね。こちらを解除しましょう。
@media (max-width: 599px) { .instagram-media, .twitter-tweet { box-sizing: border-box!important; display: none!important; max-width: 88vw!important; min-width: 0!important; width: 100%!important; } }
試しにスマホを横向きにしてみて下さい。おそらく表示されると思いますよ。
自分でカスタマイズしているコード等がある場合は、トピックを立てる前に確認することをおすすめします。
お仕事のご依頼は https://web.analogstd.com/request/contact からお願いします。
WordPress プラグインも開発しています。
Image Quality Control ・・・ 画像最適化のプラグイン
Combine Social Photos ・・・ Instagram 埋め込みブロックのプラグイン
あ、すみません。
どうやらこの CSS は SWELL に組み込まれているようでした。大変失礼しました。
外観 → カスタマイズ → 追加 CSS に打ち消すような CSS を書けば表示されます。
(読込順は、追加 CSS が後ろなので .post_content はなくてもいいですが、念のため)
@media (max-width: 599px) { .post_content .instagram-media { display: block!important; } }
元々 display: none; が指定されているので表示されると何か不具合があるのかもしれません。
その他の表示などに影響がないかよくご確認をお願いします。
お仕事のご依頼は https://web.analogstd.com/request/contact からお願いします。
WordPress プラグインも開発しています。
Image Quality Control ・・・ 画像最適化のプラグイン
Combine Social Photos ・・・ Instagram 埋め込みブロックのプラグイン
アドバイスありがとうございます!!!
CSSの事は全くわからない素人のため、本当に助かりました!
SWELLでも携帯で表示できてる人もいるようだったので、不思議に思っていましたが、
色々検索しても見つけられず。。。
ご教示いただいた、CSSを追加したら携帯でも表示できるようになりました。
本当にありがとうございます。
モバイルだと(ラッパーをoverflow:hiddenにしてても)画面幅を超えて表示されてしまうことがあったため、instagram-media-renderedが付く前はdisplay:noneにしています。
レンダリング後のinstagram-media-renderedに対してはdisplay:blockで上書きするようにしていますので、そのCSSは関係ないかと思います。
本日、一時的にインスタの接続に不具合があったみたいなので、その影響で表示されなかったのかもしれません。
SWELL開発者です。
ご確認ありがとうございます。
今みたら instagram-media-rendered クラスがちゃんと付与されて打ち消されていますね。
失礼しました!
@odekake
Instagram の不具合の影響だった可能性があるようです。
現在は、追加 CSS がなくても表示されましたので、一度ご確認をお願いします。
お仕事のご依頼は https://web.analogstd.com/request/contact からお願いします。
WordPress プラグインも開発しています。
Image Quality Control ・・・ 画像最適化のプラグイン
Combine Social Photos ・・・ Instagram 埋め込みブロックのプラグイン