NoCodeのSEO対策(bubble)

はじめに

今回のノーコードツールの「bubble」を使ってノーコードハッカソンのサイトを作成しました。
実際のサイトはこちらになります。


スクロール時のアニメーションの部分に関しては、自分でJavaScriptのコードを記述したのですが(プラグイン使うと有料なので。。)それ以外はノーコードで実装できました。

興味ある方は是非ご参加ください。

今回はBubbleでサイトを公開した時に、SEO対策したい方向けに「Google Analytics」「Google Search Console」の設定方法を共有したいと思います。

Google Analytics

Google Analyticsの設定

analyticsの管理ボタンから プロパティの作成の作成をクリックします。

スクリーンショット 2020-06-07 2.32.06.png

今回はウェブサイトなので ウェブを選択

ウェブサイトの名前URL業種レポートのタイムゾーン(日本)を設定したら作成ボタンを押す。

作成が完了すると、Tracking IDが出現するので、それをBubble側で設定します。

bubble側の設定

bubble側でプラグインをインストールします。

左メニューの Plugins => Add Plugins を押すとプラグインを検索できるようになるので、analytics を打ち込むと下記画像の Google Analytics プラグインが出てくるのでそれをインストールします。

インストールが終わったら、自分のプラグインページに戻り、先ほど設定したTracking IDを入力します。

本番公開した後、Google Analytics側で取得できていれば成功です。

Google Search Console

Google Search Consoleの設定

続いてGoogle Search Consoleの設定です。
ページに入ったら、プロパティの追加 => URLプレフィックスでサイトのurlを入力します。

スクリーンショット 2020-06-07 2.36.35.png

HTMLタグ を選択して、メタタグをコピーしてください。この状態で確認ボタンを押しても、bubble側で記述していないのでエラーになります。

bubble側の設定

再びbubble側の設定を行います。
左メニューの Settings から SEO/metatags を選択します。
そうすると、Script/meta tags in header と書かれた部分があるので、そのinput部分に、先ほどコピーしたメタタグをペーストしましょう。本番公開したら、Google Search Consoleに戻ります。

再度確認ボタンを押すと、うまくいっていれば所有権を証明しましたと出てきます。

以上、bubbleに「Google Analytics」と「Google Search Console」の導入方法を紹介させていただきました。

1 Like