
という疑問を解決します。
- WixでGoogleカレンダーを使う
- WixでGoogleカレンダーを導入する2つの方法

こんにちは、ろにぃ(@ronnie_2020)です。
これまでWixサイトを多数作り、
時々、制作代行、サイト修正などのお仕事を頂いています。
今回は 『WixサイトでGoogleカレンダーを表示する方法』 について解説していきます。
WixサイトへのGoogleカレンダー導入でお困りの方はぜひ最後までご覧ください。
Wixでgoogleカレンダーを使う

ホームぺージの活用方法について、例えばスケジュールの連絡ツールとして利用する場合、

なんてできたらわざわざメールをうつ必要もなく、自分でも管理がしやすくなり、とても便利ですよね。
しかもスマホで操作できれば、出先から簡単に更新することも可能
wixでGoogleカレンダーを導入する2つの方法

Wixサイトにgoogleカレンダーを導入するには『2つ』の方法があります。
- Wixアプリを使う
- HTML iframeを使う
以下の画像の左が『公式アプリ』、右が『HTML iframe』です。
どちらもメリット、デメリットがありますので、それぞれ説明します。
Wix公式アプリで導入

Wixにはカレンダーアプリがいくつかあり、全てgoogleカレンダーと同期することができます。
有料、無料それぞれのアプリがありますが、
『せっかく無料で使えるgoogleカレンダーを、わざわざ有料アプリで表示するのはもったいない』
ということで無料で使えるWix公式アプリについて解説を致します。
Wix編集エディターのアプリでカレンダーを検索するといくつかのアプリが出てきます。

赤枠で囲んだアプリが無料で使えるWix公式アプリです。
設定からgoogleカレンダーと接続すれば、スケジュールは全てリンクさせることができます。

Wixアプリ導入のメリット
Wixアプリ導入のデメリット

多くの予定を表示させたい方にとって、この2つのデメリットはかなり痛手です。
HTML iframe で導入

HTML iframeで導入する場合、まずgoogleカレンダー側での設定が必要です。
設定からカレンダー名横のメニューを開き、設定と共有をクリックします。

設定画面を下に進めるとアクセス権限の選択がありますので、必ず『チェック』を入れてください。

チェックを入れたら更に下に進め、カレンダーの統合のカスタマイズをクリックします。

カスタマイズではカレンダーをどのように表示するかを設定します

- 表示:必要な項目にチェックを入れます
- 高さ:表示サイズを設定します
- 背景色:ヘッダーの色を選択します
- 枠線:外枠を付けるか付けないかを選びます
- デフォルトのビュー:表示形式を切り替えます
- 週の開始日:左端の列を何曜日からにするか設定します
- 言語:表示言語を選びます
- タイムゾーン:予定を表示するタイムゾーンを選びます
- 表示するカレンダー:どのカレンダーを表示するか選び、表示したいものにチェックを入れます
- 表示されている埋め込みコードをコピーします
コードをコピーしたら、Wix編集エディターのHTML iframeに貼り付けて完成です。

HTML導入のメリット
HTML導入のデメリット

レスポンシブ対応にしたい
レスポンシブ対応にしたい場合の方法も解説しておきます。


Googleカレンダーの埋め込みコードの中に、
という表記があります。これを、
まとめ 【簡単】Wixでgoogleカレンダーを使いたい スマホ表示も解説します!
- WixでGoogleカレンダーを使う
- wixでGoogleカレンダーを導入する2つの方法
今回はWixサイトでgoogleカレンダーを使う2つの方法について解説しました。
WixアプリとHTML iframeどちらもメリット、デメリットがありますが、私の場合、スマホ表示がどのようになるかを重視し、デザイン性よりも利便性でHTMLを選んでいます。
見る人がどう感じるかが大切だと思いますので、ご自身の使用用途に合わせて使い分けてください。
googleカレンダーを導入することにより、ホームページの利用法も幅が広がるかと思います。
ぜひご活用ください!
コメント
コメント一覧 (1件)
[…] […]