とりあえずHP の使い方

Googleカレンダーを記事に埋め込もう記事にGoogleカレンダータグを埋め込む

ご確認ください

以下のいずれかに該当する方は、新管理画面をご利用のため、解説とは部分的に異なる箇所があります。

  • 2023年12月18日以降に、とりあえずHPの無料体験をお申し込みした方
  • 「新管理画面への移行完了のお知らせ」の通知を受け取っている方
このページは上級編となります。まずは初級編・中級編をマスターしてからご覧頂くことをおすすめいたします。焦らずじっくりと取り組んでいこう!

とりあえずHPではGoogleカレンダーを記事ボックスに埋め込むことができます。

※埋め込み用タグを作成する方法は下記をご覧ください。

埋め込み用Googleカレンダータグを作成しよう

管理画面のメニューの「各ページの編集」をクリックします。
左メニュー[各ページの編集]画面
Googleカレンダーを表示させたいページを選択します。

「ページの選択」から、Googleカレンダーを埋め込みたいページをクリックして選択します。

Googleカレンダーを埋め込みたいページ選択画面
Googleカレンダーを表示させたい記事ボックスの[HTML]アイコンをクリックします。

HTMLソースエディタが別ウインドウで開きます。

[HTML]ボタンのクリック画面
HTMLソースエディタに作成した埋め込み用タグを貼り付けます。

HTMLソースエディタに埋め込み用タグを貼り付け、「OK」をクリックします。

※埋め込み用タグを作成する方法は下記をご覧ください。
埋め込み用Googleカレンダータグを作成しよう

HTMLソースエディタでの 埋め込みコードを貼り付け画面

※HTMLソースエディタには‹s›〜‹/s›や‹br /›といった「HTMLソース」が 表示されています。削除しないようお気をつけください。

[上記の内容で設定]ボタンのクリック画面

Googleカレンダーが正しく表示されていることを確認したら、 忘れずに[上記の内容で設定]ボタンをクリックしましょう。

ホームページを確認します。

[ホームページを確認]ボタンをクリックして、 実際にGoogleカレンダーが表示されているかを確認してみましょう。

Googleカレンダーの表示確認サンプル画面

※ご注意※
Googleカレンダー側の「設定と共有」の設定で、「一般公開」の状態に設定していない場合、自分以外の人には予定が表示されません。
予約状況などの予定を表示したい場合、Googleカレンダーの「アクセス権限」から、「一般公開して誰でも利用できるようにする」にチェックを入れてご利用ください。

※以下ページでもGoogleカレンダーの操作を確認いただけます。
Googleカレンダーヘルプ|一般公開の Google カレンダーを作成、管理する(外部サイト)

※GoogleカレンダーはGoogle社のサービスです。そのためGoogleアカウントの作成や、Googleカレンダーでの具体的な作り方などは「とりあえずHP」のサポート外となっております。あらかじめご了承ください。

ロゴマークを表示させる

Googleビジネスプロフィールに登録しよう

外部フォームを利用する

Googleタグマネージャーを設置する

アクセス解析を見る

無料オンラインサポート実施中

\ホームページを作る前に知っておきたい/

ホームページの作り方 動画講座

動画URLを無料で入手

\ホームページ制作のプロに個別相談/

とりあえずHP無料個別レッスン

個別レッスンの詳細

PAGE TOP