グーグルのスプレッドシートのグラフを作ってウエブで公開したものの、スマホのサイズがはみ出してしまうと悩んでいるかと思います。
私もうまくいかず悩みましたが、Geminiに聞きながら2時間ほど格闘し下記のようにようやくできるようになりました。
スマホとPCで確認していただくとレスポンシブになっていることがご確認できるかと思います。
今回、スプレッドシートの埋め込みをレスポンシブに表示する方法をご紹介します。
frameborder=”0″ scrolling=”no”>
設定方法
WordPressの記事内にカスタムHTMLブロックを挿入し、下記のNoteからコードをコピーし先程のカスタムHTMLにペーストします。
さらにこのコードにおいて上から3行目の <iframe src=”ここにスプレッドシートのURL” を自分のグラフのものに変更して終了です。
まとめ
以上でパソコンとスマホの表示がそれぞれ別々に表示されるので、グラフがはみ出る悩みを解決できます。
すこしだけ手間がかかりますが、確実に表示することが可能です。
実際私のサイトもこの手法で対応しています。
グーグルが修正してしてくれるまでこの手法を使うといいと思います。
サイトやブログの収益化にはアフィリエイトを行うといいでしょう。詳細は下記を参考にしてください。
アフィリエイトサイトのおすすめは下記をどうぞ。
おすすめの商品リンクは下記の記事をどうぞ。
私のサイトの収益は下記に公開しています。




