Googleカレンダーのデザインをカスタマイズして埋め込む方法 | 東京上野のWeb制作会社LIG
こんにちは、デザイナーのサリーです。 LIGが運営するシェアオフィス「いいオフィス」では連日イベントが行われており、お客様からイベントに関するお問い合わせも多く頂くようになりました。 そこで、いいオフィスサイトにイベントカレンダーを表示しよう！ということに。 しかし、Googleカレンダーのデザインが、サイトのデザインに合わなかったんです(´･_･`) Googleカレンダーは2011年に新しいデザインになりましたが、埋め込むときは青い枠のついた旧デザインしか選べません。あまり時間もかけられないし、難しいことはせずCSSだけ上書きしたい……。 何かいい方法はないかググってみたところ、「gcalendar-wrapper.php」というスクリプトを見つけたので使ってみたら、まさに求めていた挙動を実現できました！ 今回は、gcalendar-wrapper.phpの使い方についてご紹介します。
Google カレンダーをレスポンシブ対応に | Web Design Leaves
ウェブサイトに埋め込む ウェブサイトに埋め込む（https://support.google.com/） Google ID を取得してすでにカレンダーを利用していることを前提。 Google カレンダーにログイン（下の画像） 右上の歯車のような（設定の）アイコンをクリックして「設定」を選択（下の画像） 以下のような画面が表示される。 左上の「カレンダー」のタブをクリック。（上の画像） カレンダーを誰でも閲覧できるようにするには、カレンダーを一般公開する必要があるので、（上の画像）「共有」の下の「このカレンダーを共有」をクリックして、表示される画面（下の画像）で「このカレンダーを一般公開する」にチェックを入れて保存（詳細を非表示にするにはその下のチェックボックスにもチェックを入れる）。 カレンダーを一般公開する（https://support.google.com/） 左上の「カレンダーの
embedresponsively.com
Great news! The embed codes offered by these services are already responsive: Scribd (select 'Autosize') SoundCloud Storify Twitter Know of more? New embed type giving you problems? Please report any issues on GitHub. embedresponsively.com helps build responsive embed codes for embedding rich third-party media into responsive web pages. The code here is based on research and work by Theirry Koblen
How to embed a Google Calendar in a responsive way?
Customize with code
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
