ウサヲブログ  HOME

ウェブ制作に関わる備忘録などを綴ります

このページの位置: HomeWordpress「固定ページにGoogle calenderを埋め込む」の記事

固定ページにGoogle calenderを埋め込む

ウサヲです。

wordpressの固定ページにGoogle calenderを埋め込む処理は以前もやったのですが、今後も何度かでてきそうな勢いです。色々ややこしいこともあるので、メモしておくことにしました。未来のウサヲのために。

1 まず

当然ですが、必要なものはgoogleのアカウントです。ログインしたらGoogle Calenderを表示させます。

(ウサヲが手がける処理はなぜか圧倒的に英語の処理が多いので、英語のgoogle calenderページの用語で解説します)

2 次に新規でカレンダーを作成します。

タイトルと日付などを必要に応じて編集し、大事なことは「Make this calendar public」をオンにすること。そして保存します。

3 編集します

カレンダー画面より、左側の「My Calender」の中の「settings」をクリックして、該当のカレンダーをさらにクリック。

「Customize the color, size, and other options」をクリックすると、色や大きさ、タイトル等のオプション表示の有無などの編集が可能です。

4 wordpressに貼り付けます

<iframe>タグをマルッとコピッってペッと該当ページに貼り付けます。もちろんビジュアル画面ではなくテキスト側に。

5 レスポンシブ化する

実はこれで表示だけはされるのですが、レスポンシブ対応にならないのです。

なので、「Web Design Leaves」さまのサイトを参考にさせていただき、divを追加してcssで調整することでレスポンシブ化されました。大変感謝しております。ありがとうございます!

・・・ざっくりだなぁ。でも未来のウサヲはきっと感謝するに違いない・・。

 

コメントを残す

日本語でお願いします。「テスト投稿」のような短い文は無視されます。

TOP