Mobile content isn’t displayed
-
Hi,
I were able to create a mobile version of the “Rollout” page which is showing the desired content, but when I open the “Rollout” page on a mobile device, it’s only showing the content from the desktop version.
Mobile version link:
https://test.idsgmbh.com/de/rollout-mobile/I would highly appreciate your help
Best,
NiklasThe page I need help with: [log in to see the link]
-
Hi @nluecke
on frontend you have to check only https://test.idsgmbh.com/de/rollout/ not https://test.idsgmbh.com/de/rollout-mobile/Only you who are logged-in can see https://test.idsgmbh.com/de/rollout-mobile/, all not logged-in users, and especially Search Engine Optimization robots can’t see https://test.idsgmbh.com/de/rollout-mobile/ and they must not see it. If they could see it, you may have problems with SEO.
When you load https://test.idsgmbh.com/de/rollout/ on a mobile device, Specific Content For Mobile will replace the desktop content with the content of https://test.idsgmbh.com/de/rollout-mobile/
In the backend, they are two different pages, but on the frontend, they are the same page and only https://test.idsgmbh.com/de/rollout/ exists.
Looking on https://test.idsgmbh.com/de/rollout/ I see that on the desktop it takes the content of the page having ID 2083, on mobile it takes the content of the page having ID 5125. So, it looks like it’s working.
If you have a plugin for cache, remember also to set the plugin to save different cache for desktop and mobile.
Hi @giuse,
I got the part with the -mobile/ now, thank you!
But I unfortunately still see the desktop version of the website, even tho I already disabled all caching plugins and set them to save different cache for desktop and mobile.
The mobile version of https://test.idsgmbh.com/de/rollout/ should only show “Just a Test” but is stil showing the whole desktop content, as you can see here:
Hi @nluecke
Inspecting elements I see the post ID is different on mobile, but I’m not aware of the differences you expect.
I suggest to create a testing page with only the text “This is desktop”.
Then create the mobile version of that page with the text “This is mobile”, and then please provide me the link.
Let’s see first if this simple page works as expected. On the desktop we have to see “This is desktop” and on mobile, we have to see “This is mobile”.Hi @giuse
the page I created is working fine:
https://test.idsgmbh.com/de/specific-content-for-mobile-test-page/So there’s probably some issue with the plugin(s) that are running on the Rollout-site. Is there any known issue with Elementor and/or King Composer?
Hi @nluecke
thank you for the link.On the Rollout page, I see that the page ID on mobile is different than the page ID on desktop, so this makes me suppose the plugin is working also on that page.
I suspect that on the page Rollout you are expecting something that this plugin can’t give you.
Before investigating eventual conflicts with other plugins, let’s be sure about what you expect to see as differences and how Specific Content For Mobile works.The content output of a page depends on
– The content itself as it is sent from the server to the browser (in the example of the simple testing page, the server sends to mobile devices the content “This is mobile” that is different than the content sent to desktop devices).
– How the browser shows that content, taking into account the CSS style rules and the screen viewport. Exactly the same content can be displayed e.g. in 2 columns, or 1 single column. With a red background or a yellow background… and so on.Specific Content For Mobile gives you the possibility to work only on the first point.
If you want to change content for mobile, you create the mobile version and change the content. Then how it is displayed on mobile devices depends on CSS.This plugin is to have different content on mobile, not for changing layout or style with the same content.
If for example on mobile you want a different text or to replace an image or move a block before another one… you can do it.To change the layout or style, you don’t need this plugin, but responsive design with CSS.
If you are using a page builder as Elementor or King Kommposer, you may see a different output when you edit the page in mobile mode, because you have a narrower viewport available for the content.
The viewport width + CSS gives you the appearance of the content.I’m not sure I’ve explained it clearly. In any case, what are the differences you are expecting on the page Rollout?
I suppose you would like to see on mobile the same appearance you see editing the mobile page with the page builder, right? If so, can you share a screenshot?
Hi @giuse
Your explanation was good and I don’t want the same content displayed as a mobile version, but a completely different page.
If you see the normal rollout page, you will see a Scrollmagic animation in the middle of the “5 Gründe”, which unfortunately is not responsive and should be “hidden” for the mobile variant. So I want to recreate the rollout page, but without the Scrollmagic animation in the middle.
I’ve changed the mobile version of the Rollout page, to what it should look like, you can see the screenshot via the below link:
But when I open the Rollout page on a mobile device, it’s still showing the desktop version, as I see the scrollmagic animation in the middle.
Hi @nluecke
thank you for the information.
Do you need both KingComposer and Elementor on the Rollout page? It looks the page content is displayed by KingComposer. Why do you have also Elementor?
Have you edited the Rollout page with KingComposer?
Excluding the content, what’s the difference between the simple testing page where the plugin works and the Rollout page?
Have you edited both pages with KingComposer, or the testing page was edited with Elementor?I will also have a look at my testing installation with KingComposer and Elementor both active to see if I can reproduce the same issue.
Hi @giuse
I actually only need KingComposer for the Rollout page. There were some features that I implemented with Elementor earlier on that page, but they were removed, at my page overview it still shows that the page is implemented with Elementor, I try to rebuild the page, only with KingComposer.
Yes, the Testpage were edited with KingComposer.
HI @giuse
so I “recreated” the Rollout page without Elementor, but the Problem still exists, so it seems like KingComposer is the actual trigger of the problem:
The new Rollout page:
https://test.idsgmbh.com/de/rolloutmobiletest/Desktop version is with the Scrollmagic animation and the mobile version without.
Hi @nluecke
I’ve tested KingComposer on my installation and it gives no problems.Not even your testing page https://test.idsgmbh.com/de/specific-content-for-mobile-test-page/ gives problems.
This makes me suspect the issue is related to the content of the Rollout page and how KingComposer manages this animation.
Please, in the mobile version of the page https://test.idsgmbh.com/de/rolloutmobiletest/ add a simple text as “This is the mobile version” and let’s see if we see that text on mobile.
Then create another testing page, only desktop, and put exactly the same content of the mobile version, so without animation, and let’s see if we see the output you would like to see on mobile on the Rollout page.
My doubt is this: you still see the animation because SCFM is taking the desktop version also on mobile, or because something is not working with that content itself?
Doing the suggested tests we will answer to this question.
Hi @giuse
the testing page https://test.idsgmbh.com/de/specific-content-for-mobile-test-page/ has been created without KingComposer or any kind of external Editor, just the standard WordPress Editor.
“This is the mobile version” has been added to the top of the mobile version of: https://test.idsgmbh.com/de/rolloutmobiletest/
Another testing page, only for desktop, has been created and can be found via: https://test.idsgmbh.com/de/rolloutmobiletest2/ and it show’s exactly what it should: https://imgur.com/a/wDWbTeZ
Seems like the content itself is working how it should, so as you assume, SCFM is taking the desktop version also on mobile
Thank you @nluecke
I’ve tried to reproduce the issue on my installation.
I tested your theme Envo Business + KingComposer + Elementor.
I’ve created the mobile version of the homepage. I’ve chosen the same page template as in your case (Homepage template).
I’ve tried editing the page with KingComposer, Elementor, Gutenberg.After all the tests, I was not able to reproduce the issue, and all works as expected.
So, in this situation, it’s not easy to understand what’s going on in your installation.
Maybe you have another plugin that interferes with the mobile version of the Rollout page.I suggest to installaFreesoul Deactivate Plugins and disable all the plugins (only in the testing page https://test.idsgmbh.com/de/rolloutmobiletest/) excluding SCFM and KingComposer that should be still active, and then check it again.
If it works, enable one plugin after the other, always only on that page, until you have again the problem.
Try also disabling all the plugins, including KingCommposer.If after disabling all the plugins, you still have the problem, I would need to see the installation directly with my eyes. I will not ask you access to your installation, this is also not allowed by the forum rules, but if possible, the exporting file of the website using All In One WP Migration.
If you can’t provide me the exported file, I totally understand it, in that case we can try doing other tests, but it will be a little harder arriving at the root cause.Hi @giuse
I installed the “Freesoul Deactivate Plugin” and even if I disable all plugins and the desktop version of https://test.idsgmbh.com/rolloutmobiletest/ is running completely without plugins, it’s still showing the desktop version with plugins. There’s no caching enabled at the moment, that’s super weird.
Could you provide me with an e-mail address to which I can send the exported file?
I would also like to thank you for your time and efforts in helping me, this is highly appreciated!
Hi @nluecke
you are welcome, thanks to you. I’m helping in solving the issue, but you are helping me to improve my plugin.
You can send me the link to my email [email protected]
Hi @giuse
sound like a classic win-win situation!
The file is currently uploading to WeTransfer, once the upload is done, you’ll receive a download link via Mail.
The topic ‘Mobile content isn’t displayed’ is closed to new replies.
