WordPress.comにGoogleカレンダーを貼る(改)

以前、記事「WordPress.comにGoogleカレンダーを貼る」を書いたのですが、Google カレンダーの仕様が古いものになっているので、改訂版を作ることにしました。

サンプルとしては、私のカレンダーはスカスカなので、勝手ながら、替りにレンタルサーバ等にインストールするタイプの WordPress のホームページからアクセスできる

adfadfdas
WordPress › 日本語

Google カレンダーを使わせてもらいます。

adfadf
WordPress イベントカレンダー

右下にあるこのボタンをクリックすると、

asdfadf

最終的にこんな感じでカレンダーを取り込めます。

asdfafads

次に WordPress.com の方へ貼る HTML タグを取得します。まず、「カレンダー設定」をクリック。

asdgfads

すると、右の方に HTML タグが表示されるのでコピーし、

asdfafdas-1

WordPress.com の記事に貼り付け(「ビジュアルモード」、「テキストモード」どちらでも OK でしたが、個人的には「テキストモード」推奨。)、記事の更新等を行うと、

adfadfads

編集画面上ではショートコード「googleapps」に切り替わり、

adfadfa-1

ブログ上では、以下のような感じで Google カレンダーが表示されるようになります。

adfadfasd

リンク「色やサイズなどをカスタマイズします」の

sdfafads

「デフォルトビュー」のところの設定を変更すると、

adsdfafads

週表示にしたり、

adfadfads-3

リスト表示にしたりすることができました。

adfafasd-2

ここからは少々、主観が入らざるをえないのですが、私がいろいろと確認した限りでは、ざっくりと言って、Google カレンダーは iPad や iPhone ではちゃんと表示されません(記事「[WordPress.com] Google カレンダーのレスポンシブ対応についての考察」参照、2013 年 7 月 23 日現在。)。

上記の記事のとおりにすれば iPad や iPhone でも表示の調整はある程度できますが、この場合、WordPress.com のアップグレードが必須となります。

そういうわけで、CSS が追加できるようにアップグレードされている方は上記の方法で概ね OK かと思いますが、そうでないかたは、Google カレンダーへアクセスできるリンクやボタンをつけることで十分ではないかと思います。

参考

 

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト /  変更 )

Google フォト

Google アカウントを使ってコメントしています。 ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト /  変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。