Q: Vimeo Full Screen button on iweb - CHANGED
Vimeo just changed their code so that if you have a website built with iweb, and embed a vimeo video, you no longer can have the "full screen" arrow button viewable in the menu bar under a video that is playing.
PROBLEM: They suggested that the reason is as follows: iweb strips the full screen attributes that are included in the embed code: webkitallowfullscreen mozallowfullscreen allowfullscreen
Below is the full code for the vimeo embed iframe within iweb.
<iframe src="https://player.vimeo.com/video/106756892" width="849" height="478" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
SOLUTION: They suggested that we need to add the fullscreen attributes to the Vimeo Player iframe, and to any parent iframe that may wrap ours.
Does anyone have any suggestions as to how to go about doing that?
THANKS IN ADVANCE!
MacBook Pro, Mac OS X (10.6.8)
Posted on Dec 4, 2015 11:18 AM
The solution in iWeb is rather simple after all. And Vimeo was right, but gave the impression to blame it on the users if it didn't work.
Option one :
- Open the folder with your published website. Either on your disk or on the server.
- Open the Scripts folder.
- Open The Widgets folder.
- Open the HTMLRegion folder.
- Open file Paste.js in a plain text editor.
Locate this line :
'scrolling="no" marginheight="0" marginwidth="0" allowTransparency="true"></frame>';
Change it to :
'scrolling="no" marginheight="0" marginwidth="0" allowTransparency="true" webkitallowfullscreen mozallowfullscreen allowfullscreen></frame>';
by adding :
webkitallowfullscreen mozallowfullscreen allowfullscreen
Save the file.
Clear the Browsercache and reload the page with the vimeo video.
The Fullscreen icon will show.
Option two :
To make it permanent, copy the line below :
/Applications/iWeb.app/Contents/Resources/Widgets/
In the Finder do Command-Shift-G and paste the line. Hit Return.
Right-click file HTMLRegion.iwdgt and choose Show Package Content.
Open file Paste.js.
Make the changes as explained above.
If you did not use Option one, you need to republish the page, to make iWeb put the Paste.js file on the server.
Verify.
Without the changes, the Fullscreen icon did show in newer browsers. With the changes older browsers still will not show the Fullscreen icon.
And here's the result :
http://elcapitan.byethost17.com/ElCapitan/Vimeo.html
And for all those ElCapitan users, the pages were published by iWeb's FTP with ElCapitan on a 8 year old Alu iMac.
Good Old iWeb, still running strong. Awesome!
Posted on Dec 7, 2015 11:17 AM
