Properly embed Google Apps Script URL into Google Site - google-apps-script

In Google Sites, it is possible to embed a Google Apps Script which has been published as a Web App. You just click "embed" and paste the URL of the Web App. It is possible to use the mouse to resize the iframe. However, I could not set the iframe to be of full width. Is that possible? Also, is it possible to make the whole page scrollable (instead of the iframe) when the Web App has some larger height as well? (I actually don't want to use any other functionalities of Google Sites except that it "hosts" my Google Apps Script with a custom URL and that it gets rid of the standard header warning that this Web App is not by Google).

Sorry
Unfortunately, AFAIK, this is not possible within Google sites.
I have experimented with various custom iframe HTML and CSS to try and find a workaround, but due to the way the site is rendered, it will always wrap your custom code in its own HTML and CSS. Any solution along these lines seems like it will be unreliable.
If you would like to see this specific functionality you can always submit a feature request.
My best workaround so far
Start a new site.
Delete all the elements, including the title.
Then add in your webapp embed.
It let me resize it vertically as far down as I wanted, it seems like full width since it is the only element on the page, and it doesn't present me with the warning.

Related

How can I force google docs embedded in iframes to open their links in the same window?

I'm currently making an educational resource with google drive.
I've currently got the "Publish to web" version of the google documents embedded in an iframe in an html document using
<iframe src="https://docs.google.com/document/d/e/2PACX-1vSaUZ2XolOoqc0M12v-VNTTMcz3dIAnAOO9gaCyifoAXhlWiKz114M2QYoQ5d-dNBEsgWDcXahKNMSD/pub" frameborder="0"></iframe>
I've inserted hyperlinks (using the built in hyperlink function) in the google docs, to link to other (published) google docs eg:
https://docs.google.com/document/d/1XnTTbjedXkL3OfeELMwzabeeL4FjnOjarmmWbKb97EY/pub
At the moment, all clicked links are opened in a new tab. This happens whether I link to other google docs, or to external sites. Naturally, this is quite frustrating for navigating the site.
I'd like to have them open either...
in the same iframe
or to another webpage that appears in the same tab (which I could then embed the target document in). I don't really mind which, as long as a new tab isn't created every time someone clicks a link.
I see from similar questions posted that in the past people seem to have had the opposite problem - trying to force the links to open in new tabs, so perhaps something has changed with the way links are handled?
For onlookers, the reason for the varying behavior is due to the query parameter that either is or isn't present as the src value:
You can see that the OP does not have ?embedded=true at the end (after /pub).
<iframe src="https://docs.google.com/document/d/e/2PACX-1vSaUZ2XolOoqc0M12v-VNTTMcz3dIAnAOO9gaCyifoAXhlWiKz114M2QYoQ5d-dNBEsgWDcXahKNMSD/pub" frameborder="0"></iframe>
Google doesn't document the differing functionality very well, but a URL like
https://docs.google.com/document/d/e/2PACX-1vSaUZ2XolOoqc0M12v-VNTTMcz3dIAnAOO9gaCyifoAXhlWiKz114M2QYoQ5d-dNBEsgWDcXahKNMSD/pub?embedded=true
will provide the desired behavior of keeping links opening in-iframe.

It is possible to use the Google´s sites full size with a Apps Script?

I have developed a site with Google´s Apps Script, however, I need to put this within a Google site, the problem is when I insert the Apps Script's URL in the Google´s site this is not allowing to the script takes the full size of the page. Is there any form to do this? Thank you very much for all the help and orientation that you can give me.
When you embed web app in Google Sites that is only an iframe, you can define the height and width, but you're still limited to the size of the page. You can always link directly to the web app URL.

Can I use Google Drive's editor interface embed in a website?

I want to use google drive to store the files, but allow the users of my website to be able to edit them transparently, so that they don't have to go to google drive's website.
Is this possible with the current API? Thus far I have only seen how to create an app for them to install in google drive, or doing something like DrEdit (https://developers.google.com/drive/examples/), which parses the files to JSON and uses the ACE editor, which is definitely not what I want.
EDIT:
I believe it is not possible to do this with Google Drive, I've decided to go with Zoho Docs instead.
Yes it's possible. The biggest consideration is how much formatting you want to support. Eg. if it's plain text, it's very simple. If you want to support character or layout formatting, it becomes more complex.
I don't believe its possible to embed the editor (or even embed a preview!) using an iframe, because if you look at how the google docs page loads, it first redirects you to the login page, and that automatically logs you in if you are already logged in, and redirects you back to the docs editor.
This means that the iframe would have to at least pass through the login page, even if the user doesn't need to enter anything. However, google's login page has the x-frame-option header set to SAMEORIGIN (or deny?), and thus, the browser refuses to display it, and thus you can't actually get logged in!
The only way I've found to enable just preview embedding (not editing), is to publish the document first (via the File->publish to web menu item).

How to build a chrome extension to add panel to gmail windows?

I want to build a chrome extension like rapportive.com. I'm new to Chrome extensions and Gmail Content Script. Can any one please suggest how to go about this?
Currently I'm reading Google's Gadget docs.
Here are some notes to get you started. There are more robust ways to build this, but this is the "hello world" of the functionality you are talking about:
You will need to define a content script that you add to the context of gmail. This part is pretty easy and can work with any of the content script examples available in the Google's documentation. You should read and learn about what it means to be a content script.
The content script will need to know where to look inside gmail for an email address. This address will be used to grab the social media information on the user. You message this email address from the content script to the extension's background page.
The background page will need to have social media integration that the user pre-configured. Basically, you need to plug the background page into Facebook's/Twitter's/LinkedIn's APIs and use their APIs to collect information about the email address.
The background page will then message the content script you added to gmail with the social media details for the email address
The content script then modifies gmail's user interface to contain your social media details.
The greatest long-term challenge you will face is that gmail's layout will change unexpectedly and break email discovery or the modified UI. Both issues either require some cleverness to solve, or will require you to stay up at night wondering whether Google will suddenly break your extension.
Good luck!
I don't know what google gadget is and link you provided gives 404 but I don't think you even need this.
What you need is a content script that is injected into gmail page where it adds a panel. So, start with reading about how to create a Chrome extension that is using content scripts.
There is a new SDK for modifying the DOM elements in gmail: https://www.inboxsdk.com/docs/
They have a useful API for adding buttons and other elements.

How can I get a chrome extension to affect the webpage itself? (not the popup)

I have been reading the dev guide but haven't been able to work out how to put my own codes into webpages
I know it is possible because AVG uses it (in it's link scanner), and FastestChrome extension uses it too (highlight something and a link to a search pops up).
I have a backgrounded page but I can't get it to effect the webpages I go on (permissions are correct as I can get css to effect)
I am probably missing something really simple :/
It's not intuitively presented in the documentation but your background page can not access the current webpage b/c they are in different contexts. In other words the background page is it's own separate page so it has no access to any other page's DOM.
If you want to affect the page the user is viewing in the browser you will need to use what is referred to as a "content script".
If you want to communicate between content scripts and the background page you will need to refer to the message passing API. Check out my extension's source code for reference. I do exactly that.
Just remember...
Background Page: used for general logic in your extension, not anything page specific.
Content Scripts: are loaded into every page the user sees, and can manipulate that specific page.
Those probably use Content Scripts to inject Javascript into webpages. These scripts run in the context of the web pages and can access the DOM.
You can either define a script to always run in a web page by declaring the script file in the extension manifest, or you can use your background page to inject a script when needed.