luptanpitman

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

Close

Q: Vimeo Full Screen button on iweb - CHANGED

  • All replies
  • Helpful answers

  • by Wyodor,Helpful

    Wyodor Wyodor Dec 4, 2015 4:09 PM in response to luptanpitman
    Level 6 (19,748 points)
    Dec 4, 2015 4:09 PM in response to luptanpitman

    Vimeo doesn't know the answer, so they make up excuses :

     

    https://vimeo.com/forums/help/topic:277610

     

    The iframe webkitallowfullscreen mozallowfullscreen attributes are depricated :

     

    https://developer.mozilla.org/en/docs/Web/HTML/Element/iframe

     

    You may want to try JavaScript to make it work :

     

    http://www.google.com/search?q=javascript+iframe+allowfullscreen

     

    Since the HTML Snippet is an iframe too you have to find the parent iframe from within the HTML Snippet with JavaScript.

     

    Answer 27 helps to find the parent iframe :

     

    http://stackoverflow.com/questions/935127/how-to-access-parent-iframe-from-javas cript

  • by luptanpitman,

    luptanpitman luptanpitman Dec 4, 2015 4:18 PM in response to Wyodor
    Level 1 (0 points)
    Dec 4, 2015 4:18 PM in response to Wyodor

    Thanks Wyodor - you are absolutely right about Vimeo.

     

    Thanks for the suggestions - I followed all the way up to JavaScript suggestion but when it comes down to attempting to do that it's unfortunately beyond my capability. I can only handle super specific step by step type stuff since I don't know code/programming at all.

     

    However - I appreciate you sharing it all with me!

  • by Wyodor,Solvedanswer

    Wyodor Wyodor Dec 7, 2015 11:17 AM in response to luptanpitman
    Level 6 (19,748 points)
    Dec 7, 2015 11:17 AM in response to luptanpitman

    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 :

     

    1. Open the folder with your published website. Either on your disk or on the server.
    2. Open the Scripts folder.
    3. Open The Widgets folder.
    4. Open the HTMLRegion folder.
    5. 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!

  • by luptanpitman,

    luptanpitman luptanpitman Dec 7, 2015 10:59 AM in response to Wyodor
    Level 1 (0 points)
    Dec 7, 2015 10:59 AM in response to Wyodor

    Thank you so much for the simple step by step instructions - that was awfully kind of you to go to that trouble and take the time to type out.

     

    I just checked it out and unfortunately I don't have any folders (Scripts, Widgets, HTML.. ) within the published website folder. I only have a variety of files (see screen shot below).  There is one file that has .js extension but it doesn't have the line you mention. Perhaps I'm on a different version of iweb?

    Snapz Pro XScreenSnapz013.jpg

     

    I am going to try the second option now -

     

    Thanks so much again for humoring me in this endeavor!

  • by luptanpitman,

    luptanpitman luptanpitman Dec 7, 2015 11:19 AM in response to Wyodor
    Level 1 (0 points)
    Dec 7, 2015 11:19 AM in response to Wyodor

    WOW Wyodor

     

    OPTION 2 fixed the issue universally across my entire published website - like 60 videos so this was a far better option in my case!

     

    Thank you so much - I'm going to now share this with some other people who were having the same issue. What a relief not to have to migrate website to a different platform. Thank you thank you.

  • by extraperson,

    extraperson extraperson Jan 7, 2016 12:58 PM in response to Wyodor
    Level 1 (0 points)
    Jan 7, 2016 12:58 PM in response to Wyodor

    hey @Wyodor this sounds great, but I can't save the paste.js file

    - it tells me "You don’t have permission to write to the folder that the file “Paste.js” is in." 

    and "You can duplicate this document and edit the duplicate. Only the duplicate will include your changes."

     

    After quite some time searching around for answers, and some low-risk terminal efforts (mostly ignorant, i have no business messing around with that), i'm at a loss... Hoping to get iweb working again for Vimeo, thanks for any help!

  • by Steven Wacks,

    Steven Wacks Steven Wacks Jan 7, 2016 6:16 PM in response to extraperson
    Level 1 (5 points)
    Jan 7, 2016 6:16 PM in response to extraperson

    I am trying option 2 and have the paste.js page open in safari but I can not cut or paste anything to it.

  • by extraperson,

    extraperson extraperson Jan 13, 2016 7:24 AM in response to extraperson
    Level 1 (0 points)
    Jan 13, 2016 7:24 AM in response to extraperson

    Ok, finally figured it out. I 'got info' on the HTMLRegion file, before 'showing package contents', and changed permissions on Everyone to Read and Write. Once the changes to Paste.js were made I set it back to read only.

    Also - i noticed that when i opened paste.js in textedit, it created a copy, and it was that which was opened in textedit. So once the changes were made, I pulled the original to desktop as a backup, then renamed that copy by erasing the word 'copy' from its name in the finder.

     

    It works - once you republish at Iweb. Many thanks

  • by Richard Bosch,

    Richard Bosch Richard Bosch May 5, 2016 12:14 AM in response to Wyodor
    Level 1 (12 points)
    iLife
    May 5, 2016 12:14 AM in response to Wyodor

    Wyodor:  You are a genius.  I'm referring to the [relatively] easy solution on how to have the fullscreen icon appear again on Vimeo videos.  The only bugaboo for me was not opening the Paste.js file in textedit the first time around - it defaulted to opening in Safari.  It's hard to make text changes in Safari, ha, ha...

     

    Anyway, I owe you a pint.

     

    But the reason I'm writing is not to fill your head with praise, but to pick up on another iWeb topic.  You mentioned El Capitan.  I'm sure you were following the discussion earlier this year involving me and Ethmoid and lots of others about linked images [and text boxes] becoming invisible, once published.  This phenomenon seems to have arisen with El Capitan, causing me to keep one of my Mac's running Yosemite, so I can keep my 1,000 pages of iWeb safe.  I always felt that was a javascript issue as well, but I don't have your savvy.  So my question is: since you are using El Capitan does that mean you figured out a way to keep linked images from disappearing?

     

    Richard