現在Googleアナリティクスのanalytics.jsを自社サイトに埋め込んでいるが（いつ、どのように埋め込んだかまったく記憶にないのだが…）、analytics.jsはサポート終了になるのでgtag.jsに切り替えろと、Googleアナリティクスの画面を見るたびに注意されるポップアップ画面が五月蠅い…。
そこで
Gatsby.jsにgtag.jsスクリプトを埋め込む方法
「GA4設定アシスタントに移動」の青いボタンをクリックすると次ページに遷移し、データの収集欄に「サイトにGoogle タグを追加して、イベントデータを収集します。（開始していません）」との記述あり。そこをクリックすると、
「タグの実装手順を表示する」ページまで誘導される。
「タグの実装手順を表示する」の茶色いボタンをクリックすると、埋め込むべきスクリプトが表示される。
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-XXXXXXXXX');
</script>
「このタグをコピーして、ウェブサイトのすべてのページのコード（<head> 要素の直後）に貼り付けてください。」とのことである。
理想的な方法
プラグイン王国Gatsbyならではの本道がある。
gatsby-plugin-google-gtagをインストールし、gatsby-config.jsに記述すれば良いだけ。
参考：Gatsby.js に Google Analytics を導入する
非常に簡単だが・・・
しかしこの方法はGatsbyバージョン4以上でないと不可能
当方バージョン2.4であり、依存性の問題でgatsby-plugin-google-gtagをインストールできない。
手動での埋め込み
マニュアルでの埋め込みを試すしかない。
すべてのページに埋め込め、となるとlayout.jsに張り付けるしかあるまい。したがってlayout.jsにHelmetで埋め込む。
・・・省略・・・
import { Helmet } from "react-helmet"
const Layout = ({ children }) => {
return (
<>
{/* <!-- Google tag (gtag.js) --> */}
<Helmet>
<script
async
src="https://www.googletagmanager.com/gtag/js?id=G-RWBXELGG0V"
></script>
<script>
{`
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-RWBXELGG0V');
`}
</script>
</Helmet>
・・・省略・・・
</>
)
}
export default Layout
しかしこのスクリプトは、「すべてのページの（<head> 要素の直後）に貼り付けろ」との記述あり。<head> の直後、となると<body>タグの先頭か。Helmetタグを使う場合、<head>タグの内側に埋め込まれてしまう。
結果
これ以外に手はないようなのでとりあえずこれでアップロードし、analytics.jsがEOLとなる7月1日以降、どうなるか様子見とする。Googleアナリティクスはデータを拾ってくれるだろうか・・・