Embedding Google Apps Script WebApp in WordPress Page - iframe

I've done a great deal of research on how to workaround Wordpress's iframe restrictions and I've been able to get it to work using various plugins with common services (google maps, youtube, etc.). However, all of these methods have not worked for embedding one of my published webApps. My most recent efforts have been using this plugin.
Here is an extremely simple 'Hello World' webApp that I would like to embed: LINK.
I was unable to simply use that URL as the 'src' for the iframe so I embedded the webApp in this google site then viewed the source of that iframe which I found to be:
<iframe src="https://sites.google.com/macros/s/AKfycbyAFo9aWOUw3FxiVZTGad6sgpcIbxZm1g9dS0yujV0tOBAI3582/exec?authuser=0&mid=ACjPJvEpRFnQA1LHa7qtEGta-zgj2r8oi_E2l-BUfSFUNBlxmagk2TXEd6msYIW1i7b4lfPTkEc9dZLm795dplLiaH7LZ3GchmiVtMYyXnBeeGhQ-NfS8a7-2n7NKzqPFibZ1fqr&bc=transparent&f=Georgia,+Times+New+Roman,+serif&tc=%23333333&lc=%230036b3" title="Apps Script Gadget" width="150" height="100" frameborder="0" scrolling="no" id="maestro_frame_1429669030"></iframe>
I then used that iframe code within the plugin's shortcode on the wordpress page and nothing is shown when published. The frame seems to be there but it's completely blank. When I try to view the frame source - it's blank. Please help?
I'm open to other ways to do this. I just need to somehow embed my published GAS webApps.

To save others digging for this answer, it is possible by using setXFrameOptionsMode:
https://developers.google.com/apps-script/reference/html/html-output#setxframeoptionsmodemode

The Inline Google Spreadsheet Viewer, despite the name, is a plugin for WordPress that can embed the output of any public Google Apps Script Web App without an iframe.

The Inline Google Spreadsheet Viewer doesn't work for Webapp.
I think the only way to communicate with google app script from your own website is to use this solution :
https://www.youtube.com/watch?v=JRGzVdliQOQ
Take a look at this discussion :
https://code.google.com/p/google-apps-script-issues/issues/detail?id=852
App Script HTMLService App in iFrame

Related

Problems publishing a DataStudio report in a wordpress Personal Plan website

I have a Personal Plan on wordpress.com. I try to insert a DataStudio report in my web page, with the code shown below.
<iframe width="600" height="338" src="https://datastudio.google.com/embed/reporting/1ASFCkRvzhHmT_kPLlT8npwKlJNS88ezz/page/hRet" frameborder="0" style="border:0" allowfullscreen></iframe>
I can see the report working in the editor html preview, but not in the page preview and of course not even if I publish it. I am quite sure the iframe from DataStudio is working as I tested it from JSFiddle.com. I am suspecting wordpress bans publishing iframes? I have tested with shortcode [embed] and the same thing happens.
There is no reference to the iframe in the webpage, not even the box...+
Thanks in advance for your help.
You are correct in your suspicion; for wordpress.com hosted sites, iframes are blocked/disallowed except for on the "Business Plan with Plugins" paid plan. Directly from https://en.support.wordpress.com/code/:
The following codes are not allowed on sites on our Premium Plan and below for security reasons:
embed
frame
iframe
form
input
object
textarea
and more
Your options are to either upgrade to the "Business" or "eCommerce" plan, or move your site off Wordpress.com.

How to Embed a Google Doc into a Wordpress Page

Can Someone please explain to me why my google doc is not embedding into wordpress?
picture of wordpress page
embedded code from publish to web on google:
<iframe src="https://docs.google.com/document/d/e/2PACX-1vQV4p--a7Ce0lwafCZme-_Gja8-jZ8W07WhDygdX5ziRDN-hELZmdK9NF3whSCH7JSGnWlJmLGRYMve/pub?embedded=true"></iframe>
Easiest way to embed Google Docs in WordPress is to use Embed Code provided by Google Docs.
Before you share, make sure the file is viewable by public.
Go to your Docs, File -> Publish on Web -> Embed and copy the code.
Now paste that code in HTML tab of your editor.
The iframe code you posted should work fine.

How is a Google amp-iframe different to a standard iframe? Will an iframe work on an AMP page (https://www.ampproject.org)

We are building a web app/widget for a publisher. We want the widget to be Google AMP ready (<amp-iframe> documentation).
Does anyone know if a standard iframe will work on an AMP page?
A regular Iframe will NOT work in an AMP page. If you want the widget to be google AMP ready you'll need to serve it through an AMP-IFRAME tag.
I'm guessing that your widget needs user authored javascript and possibly other JS libraries with it. If this is the case it all has to be pulled into an AMP-IFRAME tag in order to work. The other caveat to this is the AMP-IFRAME tag must make the call securely via HTTPS.
For example, our 8 news stations have a custom video player that requires a ton of external user authored JS that has to be pulled in to run our preroll, ads and tracking. We also use m3u8 url's which is not supported by the AMP-VIDEO tag or HTML5. So in a way or custom video player is basically a widget that allows you to play custom video with ads and preroll. Because of this we have an embed directory that we have served via HTTPS and the embed template that we hit via HTTPS will spit out our video player into the AMP-IFRAME tag. So everything for the widget is all served as a single call from an HTTPS directory.
This is a great resource for AMP page questions and understanding: Turn Your AMP Up To 11.
Hope this helps.
No, it won't work as stated in the documentation on their website here .

Box.com integration for WordPress

Does somebody know if there is a plugin for WordPress that can integrate the Box.com cloud service into a page/post? I am looking for a way to show my files from Box.com directly on a page in a sort of file browser.
I know that there are some plugins around that can do it for Dropbox or Google Drive. But I don't want to switch, so it would be nice if I can use my Box.com account.
Has somebody found a similar plugin for Box.com?
Have you looked at leveraging Box Embed or the Box File Picker?
Either of these will give you a small code snippet to embed Box into your site.

Google site page in an iframe

I'm building a quite large Flex application as our administration tools and I need build in documentation functionality. I want this documentation to be like a wiki and as we're using Google apps I though I'd use Google sites to host the wiki pages (why reinvet the weel...).
To include the wiki page in Flex I'm using the http://code.google.com/p/flex-iframe/ component that uses an iframe.
The problem is that it seem that google site uses some form of iframe javascript breakout script and that when i load the iframe the entire page is loaded with the wiki page.
You could try an anti-frame-busting script like the one on Jeff's site. Normally I wouldn't recommend that, but it seems like you have a legitimate need for it here.

Resources