Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Open Site with New Window using Google Apps Script

Open Site with New Window using Google Apps Script

This is a sample script for opening a site with new window using Google Apps Script. It is possible to open the site inside the opened dialog box using iframe. But in my situation, I had to open the site as new window. So I created this. As a sample application, it can think of like this. When the special keyword was inputted, open sites and files in Google Drive as a help window. In this case, the trigger installed onEdit() is required to be used. I think that there are some other applications.

Demo :

Sample script :

function myFunction() {
  var js = " \
    <script> \
      window.open('https://tanaikech.github.io/', '_blank', 'width=800, height=600'); \
      google.script.host.close(); \
    </script> \
  ";
  var html = HtmlService.createHtmlOutput(js)
    .setHeight(10)
    .setWidth(100);
  SpreadsheetApp.getUi().showModalDialog(html, 'Now loading.'); // If you use this on Spreadsheet
//  DocumentApp.getUi().showModalDialog(html, 'Now loading.'); //  If you use this on Document
//  SlidesApp.getUi().showModalDialog(html, 'Now loading.'); //  If you use this on Slides
}

Note :

  • This sample script uses getUi().showModalDialog(). So you can also use this script at not only Spreadsheet, but also Document and Slides.
    • For Spreadsheet
      • SpreadsheetApp.getUi().showModalDialog(html, 'Now loading.');
      • SpreadsheetApp.getActiveSpreadsheet().show(html);
    • For Document
      • DocumentApp.getUi().showModalDialog(html, 'Now loading.');
    • For Slides
      • SlidesApp.getUi().showModalDialog(html, 'Now loading.');
  • When you use this, please be careful for X-Frame-Options:SAMEORIGIN.
@raschmitt
Copy link

raschmitt commented Apr 2, 2019

Is it possible to use this piece of code without the dialog box?

@tanaikech
Copy link
Author

tanaikech commented Apr 2, 2019

For example, is it a sidebar?

@raschmitt
Copy link

raschmitt commented Apr 2, 2019

@tanaikech Opening the link on a new tab after clicking on a custom menu item on Google Documents, straight, without the dialog box message.

For example after clicking this button for opening the link:

buttom

And opening it on a new tab without this dialog box appearing:

image

@tanaikech
Copy link
Author

tanaikech commented Apr 2, 2019

Thank you for replying. I could understand about the result you want. Unfortunately, the custom menu cannot run Javascript. So in the current stage, that cannot be achieved yet. I apologize for this situation.

@raschmitt
Copy link

raschmitt commented Apr 2, 2019

Thank you for replying. I could understand about the result you want. Unfortunately, the custom menu cannot run Javascript. So in the current stage, that cannot be achieved yet. I apologize for this situation.

Seems like I will have to wait for future implementations, still by now your code is a nice way to work around it somehow.

@tanaikech
Copy link
Author

tanaikech commented Apr 2, 2019

Thank you for your reply.

@JacobSSagi
Copy link

JacobSSagi commented Jan 30, 2021

@tanaikech I've benefited greatly from many of your posts - thank you. Concerning this particular one, when implementing this script I get a request for verification (the usual "Google hasn’t verified this app" message). This will limit the usability of this feature. I've tried playing with the scopes, with preambles like @NotOnlyCurrentDoc, and have yet to find a way to de-escalate the authentication issue. It seems silly that I can place a live link directly in a sheet cell without requiring verification but I can't do the same within a script-driven message. Is there a workaround?

@rajatha-imandev
Copy link

rajatha-imandev commented Mar 5, 2021

@tanaikech While implemeting the same, How to capture the postmessage from the recently opened 3rd party URL
Here is what I have tried,
Could you please let me know where I am going wrong?
function openNewTab() {
var url = ‘third party URL’;
var js = "
<script>
var windowRef = window.open('" + url +"');
console.log(windowRef );
window.addEventListener('message', handleMessage, false);
function handleMessage(e) {
console.log(e);
windowRef.top.window.close();
}
console.log('Window ref');
</script>
var html = HtmlService.createHtmlOutput(js)
.setHeight(10)
.setWidth(100);
DocumentApp.getUi().showModalDialog(html, 'Now loading.');
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment