【保存版】GoogleサイトでGAS(Google Apps Script)は使える?連携方法と注意点をわかりやすく解説!

「Googleサイトを使っていて、ここでGAS(Google Apps Script)を動かせたらもっと便利なのに…」と思ったことはありませんか?
結論から言うと、GoogleサイトでもGASを利用することは可能です!
ただし、スプレッドシートのように「シートの裏側に直接コードを書き込む(コンテナバインドスクリプト)」のとは少し仕組みが異なります。Googleサイトの場合は、「Webアプリとして公開したGASを、サイト内に埋め込む」という形をとるのが基本です。
この記事では、GoogleサイトでGASを活用する具体的な方法と、実装前に知っておくべき注意点を分かりやすく解説します。

GoogleサイトでGASを動かす2つの方法

Googleサイト上でGASやそれに類する自動化を実装するには、大きく分けて以下の2つのアプローチがあります。

1. GASを「Webアプリ」にして埋め込む(主流)

GASでHTMLやCSSを使って画面(UI)を作成し、それをGoogleサイト内に表示させる王道の方法です。

  • できることの例:
  • Googleサイト上に独自の入力フォームを作り、入力されたデータをスプレッドシートに自動保存する。
  • スプレッドシートのデータを読み込んで、Googleサイト上にオリジナルのグラフや一覧表を表示する。
  • 仕組み:
    GASのエディタでコード(HTML/GAS)を書き、「デプロイ」機能を利用してWebアプリとしてURLを発行します。その後、Googleサイトの「埋め込み」機能を使って、発行されたURLを貼り付けます。

2. 連携するGoogleサービスを埋め込む(ノンコード・推奨)

「GASを使ってサイトを動かしたい」という目的の多くは、実はGASのコードを一行も書かなくても、他のGoogleサービスを組み合わせるだけで解決することがあります。まずはこの方法で実現できないか検討するのがおすすめです。

  • フォームの設置: 「Googleフォーム」を作成してGoogleサイトに埋め込むだけ。データは自動的にスプレッドシートに蓄積されます。
  • データの表示: スプレッドシートの表や、「Looker Studio(旧データポータル)」で作ったダッシュボードを、そのままGoogleサイトに埋め込むことでリッチなデータ表示が可能です。

Googleサイト×GASの注意点(制限事項)

スプレッドシートのGAS(マクロ)に慣れている方がGoogleサイトでGASを使う際、壁になりやすいポイントがいくつかあります。

⚠️ 完全に自由なデザインは難しい

GoogleサイトにGASを埋め込むと、サイト内に「枠(iFrame)」が作られ、その独立した枠の中でGASが動く形になります。そのため、サイトのデザインと完全に一体化させたり、サイト全体のデザイン(背景やヘッダーなど)をGASのコードから直接書き換えたりすることはできません。

⚠️ 「ボタンを押したらマクロを実行」はひと工夫必要

スプレッドシートでおなじみの「図形にマクロを登録して、クリックしたらセルの値を書き換える」といった単純な動かし方は、Googleサイト上ではできません。ボタンなどの見た目も含めて、HTMLとGASを組み合わせて自作する必要があります。