Copy link to clipboard
Copied
I am having trouble placing a youtube video in the mobile version of a site. www.drumevents.de > Unser Angebot. It works fine on desktop/tablet and in the mobile version also everything else works OK. Just the videos = desaster.
Copy link to clipboard
Copied
You did neither create a responsive site nor an adaptive site in Muse.
So you´ll have to either create/add some breakpoint(s) or a phone version of your site.
Kind Regards,
Uwe
Copy link to clipboard
Copied
It should be pretty easy to add breakpoints at let´s say 768 (which is quite common for mobiles) with a minimum width of 320 (which is quite common for smallest devices).The youtube widget from Muse is responsive so you may reorganize the mobile version of your site.
Let me add that with responsive sites you may not really look for devices but for design "breaks" ( as an "Eselsbruecke" to breakpoint ).
Kind Regards,
Uwe
Copy link to clipboard
Copied
Hi Uwe, thank you! I did create a mobile version > http://drumevents.de/phone/unser-angebot.html
See Screenshot. In the seconnd screenshot you see the trouble
Copy link to clipboard
Copied
Uwe is right. The whole site is completely misconstructed. Did you ever look into these tutorials: https://helpx.adobe.com/de/muse/tutorials.html
You have an alternate layout for phones. If these pages are fixed width, browsers will adapt their width automatically.
If they are responsive, it is up to you, to set up the page elements correctly.
Personally I can’t image, why you are using a separate phone layout. Just create one responsive layout, with a few breakpoint.
Your site isn’t that complicated, so it should be not difficult to set it up correctly – if you are willing to have a close look into the tutorials.
(Yes, Nancy, we know, that Muse is EOL and there is no further development. )
Copy link to clipboard
Copied
Thank you Günter. The rest of the mobile version works fine. My questions is not wether anybody thinks the site is completely misconstructed (it is not) or wether somebody thinks it is better to build a responsive site (generally yes, in this case no for certain reasons) – the question is wether anybody knows why the youtube videos blow the layout. They do this wether I pin them to the middle, wether I apply responsive width or not. I would be happy if someone can give me a hint.
Copy link to clipboard
Copied
Watching it in develop mode in Safari, it seems that the youtube is placed somehow to the left while text seems to be placed centered:
Changing view to iPhone SE (320) the view is scrollable to the left. So one problem might be that the alternate view is stopping at 380
and you replace it and reset it at 320? You could change this in page- or siteproperties:
I recommend to set up the text layers to not be responsive but fixed.
Kind Regards,
Uwe
Copy link to clipboard
Copied
Thank you, Uwe. I'm on the run, will check it in the afternoon.
Best, K
Copy link to clipboard
Copied
Having a separate site for phones is counterproductive in my view. And it's not user friendly. Ideally, your site should be responsive to comfortably fit ALL devices.
I tossed this demo together in latest Dreamweaver CC 19.01 with a Prebuilt Bootstrap Layout while talking on the phone. It took 60 seconds .
Here's a live link you can try by resizing your browser viewport.
Bootstrap - Prebuilt Layout in Dreamweaver
Copy link to clipboard
Copied
https://forums.adobe.com/people/Nancy+OShea schrieb
I tossed this demo together in latest Dreamweaver CC 19.01 with a Prebuilt Bootstrap Layout while talking on the phone. It took 60 seconds .
Wow! 60 seconds in Dreamweaver! That’s magic!
No comparison to Muse! :
17 seconds!
Copy link to clipboard
Copied
Like it
Copy link to clipboard
Copied
https://forums.adobe.com/people/G%C3%BCnter+Hei%C3%9Fenb%C3%BCttel wrote
17 seconds!
I was talking on the phone and that slowed me down a little .
Copy link to clipboard
Copied
Copy link to clipboard
Copied
Responsive is the best choice, I know, yet in this case it was better to add the mobile version – the desktop version existing already for some years. I will redo the the whole site in Webflow sooner or later anyway. The youtube issue I solved (via trial and error) this way: Site 320 px (variable), no further breakpoints. Videos centerd and fixed, text and everything else scaled to full width. I know it's a workaround but for the time being it's OK. Thank you everybody for your input.
Copy link to clipboard
Copied
For adaptive design it's not only a workaround but the correct way. But with the existing website it's quite easy to add two more breakpoints with fixed width as well and would be no difference to your adaptive design. It's just "better" for SEO. That's all. Well done anyway.
Kind Regards,
Uwe
Copy link to clipboard
Copied
fotoroeder: Even if the site is set up as adaptive site, the „developer mode“ doesn’t show the viewport adaption of mobile devices. One should test it on a real device.
Setting the video to „responsive“ in whatever way won’t work, because the site itself isn’t responsive – even if it seems so, because the text elements are filling the screen width. But this is the case, because they are set to „Stretch to browser width“.
(You may try to set the video widget to „Stretch to browser width“ too.)