「グーグル・カレンダー」の編集履歴(バックアップ)一覧はこちら
「グーグル・カレンダー」(2009/06/17 (水) 09:11:49) の最新版変更点
追加された行は緑色になります。
削除された行は赤色になります。
***予定表
#google_calendar(){{
<iframe src="http://www.google.com/calendar/embed?height=600&wkst=1&bgcolor=%23ffffcc&src=m.k.ibaraki.it%40gmail.com&color=%232952A3&ctz=Asia%2FTokyo" style=" border-width:0 " width="455" height="450" frameborder="0" scrolling="no"></iframe>
}}
「予定表」兼「活動記録」として、グーグル・カレンダーを設置してみました。設置の方法は、以下に示しますが、概ね、
+グーグルのアカウントを取得して「マイ・カレンダー」をもらい、
+そのカレンダーを表示するHTMLソースを、Wikiの入力支援プラグインを利用して、編集画面にはりつけるだけ、
と、非常に簡単です。
-----
***グーグルカレンダーを取得する
まずはグーグルにいき、右下の「&spanstyle(color:navy){サービス一覧}」をクリック。
#html2(){{
<div style="text-align:center;"><a href="http://www.google.co.jp/"><img src="http://img.simpleapi.net/small/http://www.google.co.jp/" alt="" width="240" border="0" /></a></div>
}}
右側の上から3つ目のリンク「&spanstyle(color:navy){カレンダー}」をクリック。
#html2{{<div style="text-align:center;"><a href="http://www.google.co.jp/intl/ja/options/"><img src="http://img.simpleapi.net/small/http://www.google.co.jp/intl/ja/options/" alt="" width="240" border="0" /></a></div>
}}
Googleアカウントのない方は、「&spanstyle(color:navy){アカウントを作成}」へ。ある方はログインしてください。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=google-login.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_google-login.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
ログインができれば、いきなり下図のようなカレンダーが表示されます。このカレンダーを別のHP(Wiki)に、取り込めるようにするには、左側の「&spanstyle(color:navy){マイカレンダー}」の「&spanstyle(color:navy){設定}」を変更する必要があります。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=calender1.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_calender1.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
この画面の右の方にある、「&spanstyle(color:navy){共有:設定を編集}」をクリック。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=calender2.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_calender2.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
この画面中断にある、「&spanstyle(color:navy){このカレンダーを公開する}」にチェックをいれ、下のほうにある「&spanstyle(color:navy){保存}」をクリックします。できたら、再び「&spanstyle(color:navy){マイカレンダー}」の「&spanstyle(color:navy){設定}」をクリックすると、上図の画面に戻りますので、その画面の&spanstyle(color:navy){メールアドレスが書かれているリンク}をクリックします。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=calender3.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_calender3.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
すると、下図の画面に「&spanstyle(color:navy){このカレンダーを埋め込む}」が表示され、右側にHTMLタグが出力されます。これをコピーして、別のHP(Wiki)に貼り付けることで、このカレンダーをあたかも自分のコンテンツのように扱うことができます。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=calender4.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_calender4.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
-----
***@ウィキにカレンダーを貼り付ける
カレンダーを取り込むHTMLソースをコピーできたら、@ウィキに貼り付けます。普段、「ウィキモード」で編集をしているので、HTMLソースをそのまま出力してくれるプラグインを利用します。
まずは@ウィキにログインして、「&spanstyle(color:navy){編集}」-「&spanstyle(color:navy){このページを編集}」をクリックします。
つぎに入力画面の中に、カレンダーを貼り付けたい場所にカーソルを移動して、&spanstyle(color:navy){プラグイン}をクリック。すると、下図のようなサブウインドウが開きます。左側に列挙されている中から、「&spanstyle(color:navy){編集サポート}」を選択します。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=edit1.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_edit1.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
サブウインドウの内容が書き換わりますので、右側の列挙から「&spanstyle(color:navy){htmlをそのまま表示(複数行)(html2)}」をクリックします。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=edit2.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_edit2.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
ここで大きな入力エリアが表示されますので、先に取得しコピーしたグーグルマップのHTMLソースをペースト(貼り付け)し、「&spanstyle(color:navy){入力}」をクリックします。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=edit3.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_edit3.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
以上の作業で、サブウインドウは消えて、Wikiの編集画面に下図のように入力されていれば、成功です。最後に「&spanstyle(color:navy){ページ保存}」をしておきましょう。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=edit4.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_edit4.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
このままでも使用上は問題ありませんが、貼り付けるHPによっては、カレンダーの横幅が大きすぎる場合がありますので、微調整をします。
先ほど貼り付けたHTMLソースの中の「&spanstyle(color:navy){width=~}」の数値を変更して、お好みの横幅にしてください。選択しているデザインにもよりますが、このページでは、「455」にしたところ大体良いようです。
-----
***予定表
#google_calendar(){{
<iframe src="http://www.google.com/calendar/embed?height=600&wkst=1&bgcolor=%23ffffcc&src=m.k.ibaraki.it%40gmail.com&color=%232952A3&ctz=Asia%2FTokyo" style=" border-width:0 " width="450" height="450" frameborder="0" scrolling="no"></iframe>
}}
「予定表」兼「活動記録」として、グーグル・カレンダーを設置してみました。設置の方法は、以下に示しますが、概ね、
+グーグルのアカウントを取得して「マイ・カレンダー」をもらい、
+そのカレンダーを表示するHTMLソースを、Wikiの入力支援プラグインを利用して、編集画面にはりつけるだけ、
と、非常に簡単です。
-----
***グーグルカレンダーを取得する
まずはグーグルにいき、右下の「&spanstyle(color:navy){サービス一覧}」をクリック。
#html2(){{
<div style="text-align:center;"><a href="http://www.google.co.jp/"><img src="http://img.simpleapi.net/small/http://www.google.co.jp/" alt="" width="240" border="0" /></a></div>
}}
右側の上から3つ目のリンク「&spanstyle(color:navy){カレンダー}」をクリック。
#html2{{<div style="text-align:center;"><a href="http://www.google.co.jp/intl/ja/options/"><img src="http://img.simpleapi.net/small/http://www.google.co.jp/intl/ja/options/" alt="" width="240" border="0" /></a></div>
}}
Googleアカウントのない方は、「&spanstyle(color:navy){アカウントを作成}」へ。ある方はログインしてください。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=google-login.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_google-login.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
ログインができれば、いきなり下図のようなカレンダーが表示されます。このカレンダーを別のHP(Wiki)に、取り込めるようにするには、左側の「&spanstyle(color:navy){マイカレンダー}」の「&spanstyle(color:navy){設定}」を変更する必要があります。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=calender1.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_calender1.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
この画面の右の方にある、「&spanstyle(color:navy){共有:設定を編集}」をクリック。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=calender2.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_calender2.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
この画面中断にある、「&spanstyle(color:navy){このカレンダーを公開する}」にチェックをいれ、下のほうにある「&spanstyle(color:navy){保存}」をクリックします。できたら、再び「&spanstyle(color:navy){マイカレンダー}」の「&spanstyle(color:navy){設定}」をクリックすると、上図の画面に戻りますので、その画面の&spanstyle(color:navy){メールアドレスが書かれているリンク}をクリックします。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=calender3.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_calender3.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
すると、下図の画面に「&spanstyle(color:navy){このカレンダーを埋め込む}」が表示され、右側にHTMLタグが出力されます。これをコピーして、別のHP(Wiki)に貼り付けることで、このカレンダーをあたかも自分のコンテンツのように扱うことができます。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=calender4.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_calender4.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
-----
***@ウィキにカレンダーを貼り付ける
カレンダーを取り込むHTMLソースをコピーできたら、@ウィキに貼り付けます。普段、「ウィキモード」で編集をしているので、HTMLソースをそのまま出力してくれるプラグインを利用します。
まずは@ウィキにログインして、「&spanstyle(color:navy){編集}」-「&spanstyle(color:navy){このページを編集}」をクリックします。
つぎに入力画面の中に、カレンダーを貼り付けたい場所にカーソルを移動して、&spanstyle(color:navy){プラグイン}をクリック。すると、下図のようなサブウインドウが開きます。左側に列挙されている中から、「&spanstyle(color:navy){編集サポート}」を選択します。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=edit1.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_edit1.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
サブウインドウの内容が書き換わりますので、右側の列挙から「&spanstyle(color:navy){htmlをそのまま表示(複数行)(html2)}」をクリックします。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=edit2.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_edit2.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
ここで大きな入力エリアが表示されますので、先に取得しコピーしたグーグルマップのHTMLソースをペースト(貼り付け)し、「&spanstyle(color:navy){入力}」をクリックします。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=edit3.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_edit3.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
以上の作業で、サブウインドウは消えて、Wikiの編集画面に下図のように入力されていれば、成功です。最後に「&spanstyle(color:navy){ページ保存}」をしておきましょう。
#html2(){{{
<div style="text-align:center">
<a href="http://www19.atwiki.jp/wiki-kouza1?cmd=upload&act=open&pageid=12&file=edit4.JPG" target="blank"><img src="http://www19.atwiki.jp/wiki-kouza1/pub/sumbnail/sum_edit4.jpg" style="margin:auto;" title="クリックで拡大" /></a>
</div>
}}}
このままでも使用上は問題ありませんが、貼り付けるHPによっては、カレンダーの横幅が大きすぎる場合がありますので、微調整をします。
先ほど貼り付けたHTMLソースの中の「&spanstyle(color:navy){width=~}」の数値を変更して、お好みの横幅にしてください。選択しているデザインにもよりますが、このページでは、「455」にしたところ大体良いようです。
-----
表示オプション
横に並べて表示:
変化行の前後のみ表示: