<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>dakkie blog</title>
	<atom:link href="http://dakkie.com/blog/feed/" rel="self" type="application/rss+xml" />
	<link>http://dakkie.com/blog</link>
	<description></description>
	<lastBuildDate>Sun, 06 May 2012 12:03:38 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3</generator>
		<item>
		<title>新しい財布を買った。</title>
		<link>http://dakkie.com/blog/daily/new-wallet/</link>
		<comments>http://dakkie.com/blog/daily/new-wallet/#comments</comments>
		<pubDate>Wed, 02 May 2012 14:41:45 +0000</pubDate>
		<dc:creator>dakkie</dc:creator>
				<category><![CDATA[daily]]></category>

		<guid isPermaLink="false">http://dakkie.com/blog/?p=2667</guid>
		<description><![CDATA[2010年に誕生したブランド『Relate &#8211; リレイト』の財布を買いました。 今まで使っていた財布がボロボロになってきていたので、そろそろ新しい財布がほしいと思って、昨年からずっと探してたんですが、なかなか気に入ったものが見つからず、めぐりあえるのずっと待っていました。 そんなときにふと立ち寄ったお店に&#8221;それ&#8221;はありました。 シンプルな見た目で手ざわりも良くて、またクリーム色と水色の組み合わせに惹かれて、値段にちょっと迷ったけど、見つけた翌日に買いました。 見つけた日に一緒にお店に並んでいたグリーンが翌日には売れていて、ブルーが残っていたことが幸いでした。まるで買ってくれるのを待っていたかのようです。 これから長く大事に使っていきたいと思います。]]></description>
			<content:encoded><![CDATA[<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/05/P50506001.jpg" alt="" title="" width="484" height="363" class="alignnone size-full wp-image-2702" /></p>
<p>2010年に誕生したブランド『Relate &#8211; リレイト』の財布を買いました。</p>
<p>今まで使っていた財布がボロボロになってきていたので、そろそろ新しい財布がほしいと思って、昨年からずっと探してたんですが、なかなか気に入ったものが見つからず、めぐりあえるのずっと待っていました。</p>
<p>そんなときにふと立ち寄ったお店に&#8221;それ&#8221;はありました。</p>
<p>シンプルな見た目で手ざわりも良くて、またクリーム色と水色の組み合わせに惹かれて、値段にちょっと迷ったけど、見つけた翌日に買いました。<br />
見つけた日に一緒にお店に並んでいたグリーンが翌日には売れていて、ブルーが残っていたことが幸いでした。まるで買ってくれるのを待っていたかのようです。</p>
<p>これから長く大事に使っていきたいと思います。</p>
]]></content:encoded>
			<wfw:commentRss>http://dakkie.com/blog/daily/new-wallet/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>鎌倉へドライブに行ってきた。</title>
		<link>http://dakkie.com/blog/daily/drive-to-kamakura/</link>
		<comments>http://dakkie.com/blog/daily/drive-to-kamakura/#comments</comments>
		<pubDate>Sun, 29 Apr 2012 05:13:29 +0000</pubDate>
		<dc:creator>dakkie</dc:creator>
				<category><![CDATA[daily]]></category>
		<category><![CDATA[photo]]></category>

		<guid isPermaLink="false">http://dakkie.com/blog/?p=2538</guid>
		<description><![CDATA[社会人2年目が始まって間もない4月の始めに大学時代の友達と鎌倉へドライブに行ってきました。 ドライブ前日の土曜日に夜行バスで名古屋を出発して、翌朝の日曜日の6時半ごろに新宿に到着しました。新宿に早く着き過ぎたこともあって、時間潰しのために新宿駅周辺をぶらぶら散策したあと、鎌倉を目指してドライブが始まりました。 大学時代の思い出に浸りながら、すっごく楽しいドライブでした。 予定では2時間くらいで着くはずでしたが、ちょうど鎌倉では『鎌倉まつり』が開かれていたために3時間くらいかかってやっとの思いで着きました。 鎌倉に来たことだし鶴岡八幡宮に行きたかったけど、着いたころにはもうお昼どき過ぎだったので、面白法人KAYACさんが運営している鎌倉どんぶりカフェ bowlsに行こうと思って行ってみたもののいつも通り行列ができていた。さすがbowlsですね。 残念だけど時間もあんまりなかったので、小町通りにある和彩 八倉で鎌倉名物のしらす丼を食べました。しかも大盛り。追加料金なしで大盛りにできるのはありがたい。とっても美味しかったです。 そして同じく小町通りにある鎌倉 いも吉館のあじさいソフトクリームと鎌倉壱番屋の手焼きせんべいも食べました。鎌倉ホント良いとこです。 小町通りをあとにして、今回のドライブの目的地だった湘南の海を見に行きました。 波も高くて風も強かったけど、やっぱり海は良い。 ただ眺めているだけでなんだか心が落ち着きますね。不思議です。 眺めているだけではもったいないので何枚か写真を撮ってきました。 我ながらなかなか良い感じに撮れた気がします。 PENのおかげかもしれませんけど。 海を堪能したあとは、記念撮影をしました。 このブログには掲載しませんが、素敵な写真を撮ってもらいました。通りすがりの人に感謝です。 湘南の海をあとにして、車を走らせ新宿へ戻って、少し飲んで終電で名古屋へ帰りました。 かなり時間の限られた中でのドライブだったけど、とっても楽しかったです。今年始まって以来の一番のイベントと言っても過言ではないくらい。大学生に戻ったような感じでした。巻き込んでくれた友達に本当に本当に感謝です。どーもありがとうございました。 またみんなで旅行っぽいことができると良いなと思います。]]></description>
			<content:encoded><![CDATA[<p>社会人2年目が始まって間もない4月の始めに大学時代の友達と鎌倉へドライブに行ってきました。</p>
<p>ドライブ前日の土曜日に夜行バスで名古屋を出発して、翌朝の日曜日の6時半ごろに新宿に到着しました。新宿に早く着き過ぎたこともあって、時間潰しのために新宿駅周辺をぶらぶら散策したあと、鎌倉を目指してドライブが始まりました。</p>
<p>大学時代の思い出に浸りながら、すっごく楽しいドライブでした。<br />
予定では2時間くらいで着くはずでしたが、ちょうど鎌倉では『鎌倉まつり』が開かれていたために3時間くらいかかってやっとの思いで着きました。<br />
<br />
鎌倉に来たことだし鶴岡八幡宮に行きたかったけど、着いたころにはもうお昼どき過ぎだったので、<a href="http://www.kayac.com/" target="_blank">面白法人KAYAC</a>さんが運営している<a href="http://bowls-cafe.jp/" target="_blank">鎌倉どんぶりカフェ bowls</a>に行こうと思って行ってみたもののいつも通り行列ができていた。さすがbowlsですね。</p>
<p>残念だけど時間もあんまりなかったので、小町通りにある和彩 八倉で鎌倉名物のしらす丼を食べました。しかも大盛り。追加料金なしで大盛りにできるのはありがたい。とっても美味しかったです。</p>
<p>そして同じく小町通りにある<a href="http://www.imoyoshi.com/" target="_blank">鎌倉 いも吉館</a>のあじさいソフトクリームと鎌倉壱番屋の手焼きせんべいも食べました。鎌倉ホント良いとこです。<br />
<br />
小町通りをあとにして、今回のドライブの目的地だった湘南の海を見に行きました。</p>
<p>波も高くて風も強かったけど、やっぱり海は良い。<br />
ただ眺めているだけでなんだか心が落ち着きますね。不思議です。</p>
<p>眺めているだけではもったいないので何枚か写真を撮ってきました。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/04/P4080534_s.jpg" alt="" title="" width="484" height="363" class="alignnone size-full wp-image-2540" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/04/P4080537_s.jpg" alt="" title="" width="484" height="363" class="alignnone size-full wp-image-2541" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/04/P4080552_s.jpg" alt="" title="" width="484" height="645" class="alignnone size-full wp-image-2542" /></p>
<p>我ながらなかなか良い感じに撮れた気がします。<br />
PENのおかげかもしれませんけど。</p>
<p>海を堪能したあとは、記念撮影をしました。<br />
このブログには掲載しませんが、素敵な写真を撮ってもらいました。通りすがりの人に感謝です。<br />
<br />
湘南の海をあとにして、車を走らせ新宿へ戻って、少し飲んで終電で名古屋へ帰りました。</p>
<p>かなり時間の限られた中でのドライブだったけど、とっても楽しかったです。今年始まって以来の一番のイベントと言っても過言ではないくらい。大学生に戻ったような感じでした。巻き込んでくれた友達に本当に本当に感謝です。どーもありがとうございました。</p>
<p>またみんなで旅行っぽいことができると良いなと思います。</p>
]]></content:encoded>
			<wfw:commentRss>http://dakkie.com/blog/daily/drive-to-kamakura/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HOLGA 135で写真を撮ってみた。</title>
		<link>http://dakkie.com/blog/daily/take-pictures-in-the-holga-135/</link>
		<comments>http://dakkie.com/blog/daily/take-pictures-in-the-holga-135/#comments</comments>
		<pubDate>Sun, 26 Feb 2012 14:15:21 +0000</pubDate>
		<dc:creator>dakkie</dc:creator>
				<category><![CDATA[daily]]></category>
		<category><![CDATA[photo]]></category>

		<guid isPermaLink="false">http://dakkie.com/blog/?p=2487</guid>
		<description><![CDATA[トイカメラのHOLGA 135でカラー写真を撮ってみました。 使用したフィルムはAGFA VISTA 35mm カラー ネガフィルム 36枚撮り ISO400-superheadzです。トイカメラとの相性が良いみたい。 今まで割とコントラストの強い写真のほうが好きだったんですが、こういうちょっと色あせた写真も良いですね。 ただ気になるのは、ただ撮っただけっぽい写真になってしまったことです。 もうちょっとトイカメラというカメラを意識して、特長を生かした写真を撮らないとだめだなあ。新しいフィルムを注文したので、次こそがんばります。 ちなみに今回、写真の現像とプリントは東京にある「monogram（モノグラム）」というところにお願いをしました。]]></description>
			<content:encoded><![CDATA[<p>トイカメラのHOLGA 135でカラー写真を撮ってみました。<br />
使用したフィルムは<a href="http://www.amazon.co.jp/dp/B001ANBQAO/ref=cm_sw_r_tw_dp_aMKspb0RZABQ2" target="_blank">AGFA VISTA 35mm カラー ネガフィルム 36枚撮り ISO400-superheadz</a>です。トイカメラとの相性が良いみたい。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/SCN_0001_s.jpg" alt="" title="" width="484" height="334" class="alignnone size-full wp-image-2495" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/SCN_0004_s.jpg" alt="" title="" width="484" height="334" class="alignnone size-full wp-image-2501" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/SCN_0009_s.jpg" alt="" title="" width="484" height="334" class="alignnone size-full wp-image-2503" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/SCN_0006_s.jpg" alt="" title="" width="484" height="334" class="alignnone size-full wp-image-2507" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/SCN_0010_s.jpg" alt="" title="" width="484" height="334" class="alignnone size-full wp-image-2504" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/SCN_0011_s.jpg" alt="" title="" width="484" height="334" class="alignnone size-full wp-image-2505" /></p>
<p>今まで割とコントラストの強い写真のほうが好きだったんですが、こういうちょっと色あせた写真も良いですね。</p>
<p>ただ気になるのは、ただ撮っただけっぽい写真になってしまったことです。<br />
もうちょっとトイカメラというカメラを意識して、特長を生かした写真を撮らないとだめだなあ。新しいフィルムを注文したので、次こそがんばります。</p>
<p>ちなみに今回、写真の現像とプリントは東京にある「<a href="http://www.monogram.co.jp/" target="_blank">monogram（モノグラム）</a>」というところにお願いをしました。</p>
]]></content:encoded>
			<wfw:commentRss>http://dakkie.com/blog/daily/take-pictures-in-the-holga-135/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>ポケットモンスターブラック2・ホワイト2</title>
		<link>http://dakkie.com/blog/daily/pokemon-black2-and-white2/</link>
		<comments>http://dakkie.com/blog/daily/pokemon-black2-and-white2/#comments</comments>
		<pubDate>Sun, 26 Feb 2012 06:30:35 +0000</pubDate>
		<dc:creator>dakkie</dc:creator>
				<category><![CDATA[daily]]></category>

		<guid isPermaLink="false">http://dakkie.com/blog/?p=2440</guid>
		<description><![CDATA[ついにあのポケットモンスターシリーズ最新作が発表されました。 その名も「ポケットモンスターブラック2・ホワイト2」。 タイトルにシリーズ初の2（ツー）という表記が入っています。 これは「ブラック・ホワイト」のマイナーチェンジではなく続編と考えて良いでしょう。 合わせてメインビジュアルが公開されましたが、その姿はゼクロム？レシラム？キュレム？ なんだかそれぞれ融合した感じですね。 ゲームフリークの増田さんによれば、この2体は「ブラックキュレム」、「ホワイトキュレム」というみたいです。ということはキュレムの新フォルムなのだろうか。 いろいろ思うところはあるけど、今作で今まで謎に包まれていたキュレムの正体が明らかにされるのは確実なはず。 以前から噂されていた「ポケットモンスターグレー」や「ポケットモンスタークリア」ではなかったけど、これは期待大です。続報が楽しみ。 『ポケットモンスターブラック2・ホワイト2』公式サイト http://www.pokemon.co.jp/ex/b2w2/]]></description>
			<content:encoded><![CDATA[<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/pokemon_black_and_white.jpg" alt="" title="" width="484" height="290" class="alignnone size-full wp-image-2444" /></p>
<p>ついにあのポケットモンスターシリーズ最新作が発表されました。<br />
その名も「ポケットモンスターブラック2・ホワイト2」。</p>
<p>タイトルにシリーズ初の2（ツー）という表記が入っています。<br />
これは「ブラック・ホワイト」のマイナーチェンジではなく続編と考えて良いでしょう。</p>
<p>合わせてメインビジュアルが公開されましたが、その姿はゼクロム？レシラム？キュレム？<br />
なんだかそれぞれ融合した感じですね。</p>
<p>ゲームフリークの増田さんによれば、この2体は「ブラックキュレム」、「ホワイトキュレム」というみたいです。ということはキュレムの新フォルムなのだろうか。</p>
<p>いろいろ思うところはあるけど、今作で今まで謎に包まれていたキュレムの正体が明らかにされるのは確実なはず。<br />
以前から噂されていた「ポケットモンスターグレー」や「ポケットモンスタークリア」ではなかったけど、これは期待大です。続報が楽しみ。</p>
<p>『ポケットモンスターブラック2・ホワイト2』公式サイト<br />
<a href="http://www.pokemon.co.jp/ex/b2w2/" target="_blank">http://www.pokemon.co.jp/ex/b2w2/</a></p>
]]></content:encoded>
			<wfw:commentRss>http://dakkie.com/blog/daily/pokemon-black2-and-white2/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>『しあわせのパン』を観に行ってきた。</title>
		<link>http://dakkie.com/blog/daily/shiawase-no-pan/</link>
		<comments>http://dakkie.com/blog/daily/shiawase-no-pan/#comments</comments>
		<pubDate>Sun, 05 Feb 2012 12:57:59 +0000</pubDate>
		<dc:creator>dakkie</dc:creator>
				<category><![CDATA[daily]]></category>

		<guid isPermaLink="false">http://dakkie.com/blog/?p=2222</guid>
		<description><![CDATA[昨日『しあわせのパン』を観に行ってきました。 しあわせってなんだっけ。 僕にはそう考えさせてくれた作品でした。 夏、秋、冬、そして春。季節ごとにちょっとワケありなお客さんたちが水縞夫妻が営むパンカフェ「マーニ」を訪ねて、そこでそれぞれのしあわせを見つけていく。 なにげない日常を描いてるだけかもしれないけど、今の僕にとっては観ているだけで心が温まって満足のできる映画でした。観終わったとき、心がすーっと落ち着きました。 月浦の美しい自然と風景、おいしそうなパンや料理、ちょっと変わった常連さん、そして水縞夫妻。。。ちょっとワケありなお客さんの立場で物語を観ていたこともあり、全てがほんとうにしあわせな気持ちにさせてくれました。自分が物語の登場人物になっていて、その全てがしあわせを見つけさせてくれた感じです。 素敵な映画でしたね。北海道に行きたくなりました。 最後にこの作品で気に入っているシーンを。原田知世さんキレイで可愛らしいです。 本作品の映像の撮り方や色合いがあまりにも自分好みだったために、ビジュアルブックも買ったのでした。素敵な写真がいーっぱい詰まってます。 映画『しあわせのパン』公式サイト http://shiawase-pan.asmik-ace.co.jp/]]></description>
			<content:encoded><![CDATA[<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/shiawase_no_pan_s.jpg" alt="" title="" width="484" height="677" class="alignnone size-full wp-image-2381" /></p>
<p>昨日『しあわせのパン』を観に行ってきました。</p>
<p>しあわせってなんだっけ。<br />
僕にはそう考えさせてくれた作品でした。</p>
<p>夏、秋、冬、そして春。季節ごとにちょっとワケありなお客さんたちが水縞夫妻が営むパンカフェ「マーニ」を訪ねて、そこでそれぞれのしあわせを見つけていく。</p>
<p>なにげない日常を描いてるだけかもしれないけど、今の僕にとっては観ているだけで心が温まって満足のできる映画でした。観終わったとき、心がすーっと落ち着きました。</p>
<p>月浦の美しい自然と風景、おいしそうなパンや料理、ちょっと変わった常連さん、そして水縞夫妻。。。ちょっとワケありなお客さんの立場で物語を観ていたこともあり、全てがほんとうにしあわせな気持ちにさせてくれました。自分が物語の登場人物になっていて、その全てがしあわせを見つけさせてくれた感じです。</p>
<p>素敵な映画でしたね。北海道に行きたくなりました。<br />
<br />
最後にこの作品で気に入っているシーンを。原田知世さんキレイで可愛らしいです。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/shiawase_no_pan_photo_s.jpg" alt="" title="" width="484" height="322" class="alignnone size-full wp-image-2400" /></p>
<p>本作品の映像の撮り方や色合いがあまりにも自分好みだったために、ビジュアルブックも買ったのでした。素敵な写真がいーっぱい詰まってます。</p>
<p>映画『しあわせのパン』公式サイト<br />
<a href="http://shiawase-pan.asmik-ace.co.jp/" target="_blank">http://shiawase-pan.asmik-ace.co.jp/</a></p>
]]></content:encoded>
			<wfw:commentRss>http://dakkie.com/blog/daily/shiawase-no-pan/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>FC2ブログにカスタマイズしたTwitter ウィジェットを表示する。</title>
		<link>http://dakkie.com/blog/css/twitter-widget-customize-for-fc2-blog/</link>
		<comments>http://dakkie.com/blog/css/twitter-widget-customize-for-fc2-blog/#comments</comments>
		<pubDate>Sat, 04 Feb 2012 12:50:46 +0000</pubDate>
		<dc:creator>dakkie</dc:creator>
				<category><![CDATA[css]]></category>
		<category><![CDATA[twitter]]></category>

		<guid isPermaLink="false">http://dakkie.com/blog/?p=2212</guid>
		<description><![CDATA[昨年6月に書いた「Twitter ウィジェットをカスタマイズする。」という記事にコメントをいただきました。質問の内容はFC2ブログにカスタマイズしたTwitter ウィジェットを表示するにはということでした。 ただ文章だけで説明するのは難しいと思い、記事として書くことにしました。 1．プロフィールウィジェットをカスタマイズするページにアクセスする。 Twitterのホーム画面です。上の画像の赤く囲ってある部分に「素材」という項目があるのでクリックします。 「素材」ページにアクセスすると、「Twitterボタン」、「ロゴとアイコン」といったものがありますが、その中にある「ウィジェット」を選択します。 「自分のサイト」を選択します。 「検索ウィジェット」、「お気に入りウィジェット」、「リストウィジェット」といったものがありますが、今回は「プロフィールウィジェット」を選択します 2．プロフィールウィジェットをカスタマイズする。 ＜設定＞ ■ Twitterのユーザー名 ＜Preferences（カスタマイズ）＞ ■ 最新データを取得するか ■ スクロールバーを表示するか ■ ツイートの表示方法（一定間隔で更新するか、全ツイートを取得するか） ■ 表示するツイート数（1~30） ■ プロフィール画像を表示するか ■ 投稿時刻を表示するか ■ ハッシュタグを表示するか ＜Appearance（デザイン）＞ ■ ウィジェットの色（外枠の背景、外枠の文字、ツイート投稿欄の背景、ツイートの文字、リンク） ＜サイズ＞ ■ ウィジェットのサイズ（横幅、高さ） ここで設定しておくべきことはウィジェットのサイズ設定で「横幅の自動調整」にチェックを入れておくことかと思います。 FC2ブログのテンプレートによってプロフィールや最新記事などを表示しているサイドバーの幅が異なるので、それぞれのテンプレートに合わせるには自動で幅を調整させることが必要です。 それぞれの設定をし、「Finish &#038; Grab Code（完了&#038;コード取得）」ボタンを押すと、下記のようなHTMLコードが表示されます。 &#60;script charset=&#34;utf-8&#34; src=&#34;http://widgets.twimg.com/j/2/widget.js&#34;&#62;&#60;/script&#62; &#60;script&#62; new TWTR.Widget({ 　　version: 2, 　　type: 'profile', 　　rpp: 4, 　　interval: 30000, 　　width: [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/twitter_kakeru_fc2.png" alt="" title="" width="484" height="130" class="alignnone size-full wp-image-2254" /></p>
<p>昨年6月に書いた<a href="http://dakkie.com/blog/css/twitter-widget-customize/">「Twitter ウィジェットをカスタマイズする。」</a>という記事にコメントをいただきました。質問の内容はFC2ブログにカスタマイズしたTwitter ウィジェットを表示するにはということでした。</p>
<p>ただ文章だけで説明するのは難しいと思い、記事として書くことにしました。</p>
<h3>1．プロフィールウィジェットをカスタマイズするページにアクセスする。</h3>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/twitter_fc2_1_2.png" alt="" title="" width="484" height="363" class="alignnone size-full wp-image-2258" /></p>
<p>Twitterのホーム画面です。上の画像の赤く囲ってある部分に「素材」という項目があるのでクリックします。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/twitter_fc2_2.png" alt="" title="" width="484" height="263" class="alignnone size-full wp-image-2262" /></p>
<p>「素材」ページにアクセスすると、「Twitterボタン」、「ロゴとアイコン」といったものがありますが、その中にある「ウィジェット」を選択します。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/05/twitter_widget_3.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-1940" /></p>
<p>「自分のサイト」を選択します。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/05/twitter_widget_4.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-1941" /></p>
<p>「検索ウィジェット」、「お気に入りウィジェット」、「リストウィジェット」といったものがありますが、今回は「プロフィールウィジェット」を選択します</p>
<h3>2．プロフィールウィジェットをカスタマイズする。</h3>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/05/twitter_widget_5.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-1943" /></p>
<h4>＜設定＞</h4>
<p>■ Twitterのユーザー名</p>
<h4>＜Preferences（カスタマイズ）＞</h4>
<p>■ 最新データを取得するか<br />
■ スクロールバーを表示するか<br />
■ ツイートの表示方法（一定間隔で更新するか、全ツイートを取得するか）<br />
■ 表示するツイート数（1~30）<br />
■ プロフィール画像を表示するか<br />
■ 投稿時刻を表示するか<br />
■ ハッシュタグを表示するか</p>
<h4>＜Appearance（デザイン）＞</h4>
<p>■ ウィジェットの色（外枠の背景、外枠の文字、ツイート投稿欄の背景、ツイートの文字、リンク）</p>
<h4>＜サイズ＞</h4>
<p>■ ウィジェットのサイズ（横幅、高さ）</p>
<p>ここで設定しておくべきことはウィジェットのサイズ設定で「横幅の自動調整」にチェックを入れておくことかと思います。<br />
FC2ブログのテンプレートによってプロフィールや最新記事などを表示しているサイドバーの幅が異なるので、それぞれのテンプレートに合わせるには自動で幅を調整させることが必要です。</p>
<p>それぞれの設定をし、「Finish &#038; Grab Code（完了&#038;コード取得）」ボタンを押すと、下記のようなHTMLコードが表示されます。</p>
<p><code>&lt;script charset=&quot;utf-8&quot; src=&quot;http://widgets.twimg.com/j/2/widget.js&quot;&gt;&lt;/script&gt;<br />
&lt;script&gt;<br />
new TWTR.Widget({<br />
　　version: 2,<br />
　　type: 'profile',<br />
　　rpp: 4,<br />
　　interval: 30000,<br />
　　width: 'auto',<br />
　　height: 300,<br />
　　theme: {<br />
　　　　shell: {<br />
　　　　<strong>background: '#333333'</strong>,<br />
　　　　color: '#666666'<br />
　　　　},<br />
    　　tweets: {<br />
　　　　　<strong>background: '#000000'</strong>,<br />
　　　　　color: '#666666',<br />
　　　　　links: '#ff6600'<br />
　　　　}<br />
　　},<br />
　　features: {<br />
　　scrollbar: false,<br />
　　loop: false,<br />
　　live: false,<br />
　　behavior: 'all'<br />
　　}<br />
}).render().setUser('Twitterのユーザー名').start();<br />
&lt;/script&gt;</code></p>
<p>この表示されたHTMLコードの中にあるbackgroundプロパティに&#8217;transparent&#8217;と指定しておくと良いです。これによって背景が透明になるので、どのようなテンプレートにも合わせることができます。</p>
<h3>3．FC2ブログにTwitter ウィジェットを表示する。</h3>
<p>先のHTMLコードをコピーしておきます。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/fc2_blog_cotrol_panel.png" alt="" title="" width="484" height="474" class="alignnone size-full wp-image-2298" /></p>
<p>FC2ブログの管理ページにアクセスし、左サイドバーの中にある「環境設定」から「プラグインの設定」を選択します。上の画像の赤く囲ってある部分にあります。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/fc2_blog_cotrol_panel_plugin.png" alt="" title="" width="484" height="263" class="alignnone size-full wp-image-2305" /></p>
<p>「PC用」の行にある「公式プラグイン追加」を選択します。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/fc2_blog_cotrol_panel_plugin_2.png" alt="" title="" width="484" height="552" class="alignnone size-full wp-image-2311" /></p>
<p>「基本プラグイン」、「お役立ちプラグイン」、「SNSプラグイン」、「FC2プラグイン」といったものがありますが、「拡張プラグイン」の中から「フリーエリア」の「追加」をクリックします。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/fc2_blog_cotrol_panel_plugin_3.png" alt="" title="" width="484" height="430" class="alignnone size-full wp-image-2314" /></p>
<p>今回「タイトル」を「Twitter」にし、「フリーエリア内容の変更」にコピーしたHTMLコードを貼り付け、「追加」をクリックします。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/twitter_fc2_3.png" alt="" title="" width="484" height="322" class="alignnone size-full wp-image-2318" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/twitter_fc2_3_2.png" alt="" title="" width="484" height="300" class="alignnone size-full wp-image-2319" /></p>
<p>すると、FC2ブログの左サイドバーにTwitter ウィジェットが表示されました。</p>
<h3>4．Twitter ウィジェットをカスタマイズする。</h3>
<p>左サイドバーの中にある「環境設定」の「テンプレートの設定」を選択します。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/twitter_fc2_4.png" alt="" title="" width="484" height="263" class="alignnone size-full wp-image-2326" /></p>
<p>「HTML CSS」の列にある「編集」をクリックします。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/twitter_fc2_5.png" alt="" title="" width="484" height="434" class="alignnone size-full wp-image-2329" /></p>
<p>「テンプレート名 のスタイルシート編集」の枠の中に下記のコードを入力します。一番下に入力するのが良いかと思います。</p>
<p><code>/* ————————————————–<br />
  Twitter<br />
 ————————————————– */<br />
.twtr-widget {<br />
font : normal normal normal 75%/1.8 "ヒラギノ角ゴ Pro W3", "HiraKakuPro-W3", "Osaka", "Helvetica", "Arial", "ＭＳ Ｐゴシック", sans-serif !important;<br />
}<span class="block">.twtr-widget .twtr-tweet {<br />
border-bottom: 1px solid #c9c7c7 <strong>!important</strong>;<br />
}</span><span class="block">.twtr-widget .twtr-tweet-wrap {<br />
padding: 6px 0<strong> !important</strong>;<br />
}</span><span class="block">.twtr-hd, .twtr-ft {<br />
display: none;<br />
}</span><span class="block">.twtr-widget .twtr-tweet:last-child {<br />
border: none <strong>!important</strong>;<br />
}</span></code></p>
<p>FC2ブログにカスタマイズしたTwitter ウィジェットを表示させるために重要なことは「!important」を付けることです。</p>
<p>昨年6月に書いた<a href="http://dakkie.com/blog/css/twitter-widget-customize/">「Twitter ウィジェットをカスタマイズする。」</a>という記事ではTwitter独自のwidget.cssというCSSを読み込ませたあとに、自分で書いたCSSで上書きをするというかたちを取っていました。</p>
<p>でも、今回のFC2ブログではその方法を取ることができません。そのため今回は、「!important」を全てに付けて最優先にスタイルを適用させる方法を取ります。</p>
<p>これによって下の画像のようなカスタマイズしたTwitter ウィジェットを表示することができるのです。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/twitter_fc2_6.png" alt="" title="" width="484" height="281" class="alignnone size-full wp-image-2351" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/02/twitter_fc2_6_2.png" alt="" title="" width="484" height="300" class="alignnone size-full wp-image-2355" /></p>
<p>ただTwitter独自のwidget.cssで英語フォントのスタイルに対して「!important」が付けられているために、英語フォントだけは今、紹介したように自分で書いたCSSで上書きをすることができません。</p>
<p>でも、無理矢理ではありますが、以下のコードを&lt;/body&gt;タグの直前に入れることによって上書きすることができます。</p>
<p><code>&lt;style type=&quot;text/css&quot;&gt;<br />
&lt;!--<br />
.twtr-widget {<br />
  font-family: &quot;ヒラギノ角ゴ Pro W3&quot;,&quot;HiraKakuPro-W3&quot;,&quot;Osaka&quot;,&quot;Helvetica&quot;,&quot;Arial&quot;,&quot;ＭＳ Ｐゴシック&quot;,sans-serif !important;<br />
}<br />
--&gt;<br />
&lt;/style&gt;</code></p>
<p>今回、紹介したコードのフォントやリンクの色などは「sakanaテンプレート」に合わせたコードになっているので、それぞれのテンプレートに合わせたコードに一部変更をしてください。よろしくお願いします。<br />
<br />
※追記（2012.02.09）※<br />
「テンプレート名 のスタイルシート編集」の枠の中に入力するコードに脱字がありました。<br />
申し訳ございません。現在は修正を済ませています。</p>
]]></content:encoded>
			<wfw:commentRss>http://dakkie.com/blog/css/twitter-widget-customize-for-fc2-blog/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>小林賢太郎演劇作品『うるう』を観に行ってきた。</title>
		<link>http://dakkie.com/blog/daily/kkp-8-uruu/</link>
		<comments>http://dakkie.com/blog/daily/kkp-8-uruu/#comments</comments>
		<pubDate>Sun, 29 Jan 2012 13:44:52 +0000</pubDate>
		<dc:creator>dakkie</dc:creator>
				<category><![CDATA[daily]]></category>

		<guid isPermaLink="false">http://dakkie.com/blog/?p=2154</guid>
		<description><![CDATA[小林賢太郎演劇作品『うるう』を観に行ってきました。 小林賢太郎プロデュース公演、通称「K.K.P」の8作目になる今作品。 もともと「ラーメンズ」というお笑いコンビを知ったのをきっかけに小林賢太郎さんを知り、2010年ソロコントプロジェクトである「POTSUNEN -ポツネン-」を初めて観に行ったのです。それから彼の笑いのセンスや面白さに惹かれて、尊敬する人物の一人になりました。 ということで小林賢太郎の公演は必ず観に行きたいと思うようになり、今回観に行ってきました。 今年がうるう年ということにちなんだ今作品『うるう』。 世界でたったひとりの余った人間「うるうびと」の物語。 お芝居、言葉遊び、演出、歌（?）。どれをとっても素敵でした。とっても面白かったです。POTSUNENとはまた違った面白さでしたね。 やはり生で観ると素の演技がたまに観れるのが良いですね。緊張感というのもありますが。 この日は名古屋公演の千秋楽だったせいか、かなりはしゃいでいました。 小林賢太郎さん、素敵なパフォーマーです。 また公演があるときは必ず観に行きます。]]></description>
			<content:encoded><![CDATA[<p><img src="http://dakkie.com/blog/wp-content/uploads/2012/01/uruu.jpg" alt="" title="小林賢太郎演劇作品『うるう』" width="484" height="685" class="alignnone size-full wp-image-2158" /></p>
<p>小林賢太郎演劇作品『うるう』を観に行ってきました。<br />
小林賢太郎プロデュース公演、通称「K.K.P」の8作目になる今作品。</p>
<p>もともと「ラーメンズ」というお笑いコンビを知ったのをきっかけに小林賢太郎さんを知り、2010年ソロコントプロジェクトである「POTSUNEN -ポツネン-」を初めて観に行ったのです。それから彼の笑いのセンスや面白さに惹かれて、尊敬する人物の一人になりました。</p>
<p>ということで小林賢太郎の公演は必ず観に行きたいと思うようになり、今回観に行ってきました。</p>
<p>今年がうるう年ということにちなんだ今作品『うるう』。<br />
世界でたったひとりの余った人間「うるうびと」の物語。</p>
<p>お芝居、言葉遊び、演出、歌（?）。どれをとっても素敵でした。とっても面白かったです。POTSUNENとはまた違った面白さでしたね。</p>
<p>やはり生で観ると素の演技がたまに観れるのが良いですね。緊張感というのもありますが。<br />
この日は名古屋公演の千秋楽だったせいか、かなりはしゃいでいました。</p>
<p>小林賢太郎さん、素敵なパフォーマーです。<br />
また公演があるときは必ず観に行きます。</p>
]]></content:encoded>
			<wfw:commentRss>http://dakkie.com/blog/daily/kkp-8-uruu/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>デザインあ</title>
		<link>http://dakkie.com/blog/website/design-ah/</link>
		<comments>http://dakkie.com/blog/website/design-ah/#comments</comments>
		<pubDate>Fri, 17 Jun 2011 16:02:21 +0000</pubDate>
		<dc:creator>dakkie</dc:creator>
				<category><![CDATA[website]]></category>

		<guid isPermaLink="false">http://dakkie.com/blog/?p=2077</guid>
		<description><![CDATA[NHK Eテレで今年の4月から「デザインあ」という番組が放送されています。その中で出てくる『「あ」のうた』がWebコンテンツとして登場しました。 「あ」のうた 画面に「あ」と書くと、その「あ」が動き出すというコンテンツになっています。 テレビで見ていただけだったものがWeb上で体験できます。 面白くてすごいです。 自分の書いた文字が動き出すというのは楽しいですね。 他にも「あ」以外に書いてみました。画数が3であれば大丈夫です。 みなさんもぜひ体験してみてください。 「あ」のうた http://www.nhk.or.jp/design-ah/ah-song/]]></description>
			<content:encoded><![CDATA[<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/06/design_ah.png" alt="" title="design_ah" width="484" height="180" class="alignnone size-full wp-image-2411" /></p>
<p>NHK Eテレで今年の4月から「<a href="http://www.nhk.or.jp/design-ah/" target="_blank">デザインあ</a>」という番組が放送されています。その中で出てくる『「あ」のうた』がWebコンテンツとして登場しました。</p>
<h3><a href="http://www.nhk.or.jp/design-ah/ah-song/" target="_blank">「あ」のうた</a></h3>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/06/design_ah_2.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-2092" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/06/design_ah_10.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-2100" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/06/design_ah_11.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-2102" /></p>
<p>画面に「あ」と書くと、その「あ」が動き出すというコンテンツになっています。<br />
テレビで見ていただけだったものがWeb上で体験できます。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/06/design_ah_3.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-2095" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/06/design_ah_5.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-2103" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/06/design_ah_6.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-2105" /></p>
<p>面白くてすごいです。<br />
自分の書いた文字が動き出すというのは楽しいですね。</p>
<p>他にも「あ」以外に書いてみました。画数が3であれば大丈夫です。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/06/design_ah_12.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-2111" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/06/design_ah_7.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-2113" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/06/design_ah_8.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-2114" /></p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/06/design_ah_9.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-2115" /></p>
<p>みなさんもぜひ体験してみてください。</p>
<p>「あ」のうた<br />
<a href="http://www.nhk.or.jp/design-ah/ah-song/" target="_blank">http://www.nhk.or.jp/design-ah/ah-song/</a></p>
]]></content:encoded>
			<wfw:commentRss>http://dakkie.com/blog/website/design-ah/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Twitter ウィジェットをカスタマイズする。</title>
		<link>http://dakkie.com/blog/css/twitter-widget-customize/</link>
		<comments>http://dakkie.com/blog/css/twitter-widget-customize/#comments</comments>
		<pubDate>Sat, 11 Jun 2011 14:36:15 +0000</pubDate>
		<dc:creator>dakkie</dc:creator>
				<category><![CDATA[css]]></category>
		<category><![CDATA[twitter]]></category>

		<guid isPermaLink="false">http://dakkie.com/blog/?p=1839</guid>
		<description><![CDATA[Twitterのツイートを自分のブログやサイトに表示させるために便利なTwitter ウィジェットというものが公式から出ています。 その公式のウィジェットは、ある程度カスタマイズができるようになっていますが、できるものはどれも同じような見た目になってしまって、何だか物足りません。それに自分のブログやサイトに合ったデザインになりません。 そんな人のためにとっておきの方法を紹介します。 実は、このウィジェットはCSSによってカスタマイズすることができるんです。 今回、紹介するのは一番使われることが多いと思われる「プロフィールウィジェット」をカスタマイズする方法です。 1．プロフィールウィジェットをカスタマイズするページにアクセスする。 Twitterのホーム画面です。上の画像の赤く囲ってある部分に「素材」という項目があるのでクリックします。 「素材」ページにアクセスすると、「フォローボタン」、「ツイートボタン」、「Twitterロゴとアイコン」といったものがありますが、その中にある「ウィジェット」を選択します。 「自分のサイト」を選択します。 「検索ウィジェット」、「お気に入りウィジェット」、「リストウィジェット」といったものがありますが、今回は「プロフィールウィジェット」を選択します。 2．プロフィールウィジェットをカスタマイズする。 ＜設定＞ ■ Twitterのユーザー名 ＜カスタマイズ＞ ■ 最新データを取得するか ■ スクロールバーを表示するか ■ ツイートの表示方法（一定間隔で更新するか、全ツイートを取得するか） ■ 表示するツイート数（1~30） ■ プロフィール画像を表示するか ■ 投稿時刻を表示するか ■ ハッシュタグを表示するか ＜デザイン＞ ■ ウィジェットの色（外枠の背景、外枠の文字、ツイート投稿欄の背景、ツイートの文字、リンク） ＜サイズ＞ ■ ウィジェットのサイズ（横幅、高さ） 初期のままだと下記のようなコードになっています。 &#60;script src=&#34;http://widgets.twimg.com/j/2/widget.js&#34;&#62;&#60;/script&#62; &#60;script&#62; new TWTR.Widget({ 　　version: 2, 　　type: 'profile', 　　rpp: 4, 　　interval: 6000, 　　width: 250, 　　height: 300, 　　theme: [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/06/twitter_widget_customize.png" alt="" title="" width="484" height="130" class="alignnone size-full wp-image-2705" /></p>
<p>Twitterのツイートを自分のブログやサイトに表示させるために便利な<a href="http://twitter.com/about/resources/widgets" target="_blank">Twitter ウィジェット</a>というものが公式から出ています。</p>
<p>その公式のウィジェットは、ある程度カスタマイズができるようになっていますが、できるものはどれも同じような見た目になってしまって、何だか物足りません。それに自分のブログやサイトに合ったデザインになりません。</p>
<p>そんな人のためにとっておきの方法を紹介します。<br />
実は、このウィジェットはCSSによってカスタマイズすることができるんです。</p>
<p>今回、紹介するのは一番使われることが多いと思われる「プロフィールウィジェット」をカスタマイズする方法です。</p>
<h3>1．プロフィールウィジェットをカスタマイズするページにアクセスする。</h3>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/05/twitter_widget.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-1934" /></p>
<p>Twitterのホーム画面です。上の画像の赤く囲ってある部分に「素材」という項目があるのでクリックします。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/05/twitter_widget_2.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-1936" /></p>
<p>「素材」ページにアクセスすると、「フォローボタン」、「ツイートボタン」、「Twitterロゴとアイコン」といったものがありますが、その中にある「ウィジェット」を選択します。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/05/twitter_widget_3.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-1940" /></p>
<p>「自分のサイト」を選択します。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/05/twitter_widget_41.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-1942" /></p>
<p>「検索ウィジェット」、「お気に入りウィジェット」、「リストウィジェット」といったものがありますが、今回は「プロフィールウィジェット」を選択します。</p>
<h3>2．プロフィールウィジェットをカスタマイズする。</h3>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/05/twitter_widget_5.png" alt="" title="" width="484" height="272" class="alignnone size-full wp-image-1943" /></p>
<h4>＜設定＞</h4>
<p>■ Twitterのユーザー名</p>
<h4>＜カスタマイズ＞</h4>
<p>■ 最新データを取得するか<br />
■ スクロールバーを表示するか<br />
■ ツイートの表示方法（一定間隔で更新するか、全ツイートを取得するか）<br />
■ 表示するツイート数（1~30）<br />
■ プロフィール画像を表示するか<br />
■ 投稿時刻を表示するか<br />
■ ハッシュタグを表示するか</p>
<h4>＜デザイン＞</h4>
<p>■ ウィジェットの色（外枠の背景、外枠の文字、ツイート投稿欄の背景、ツイートの文字、リンク）</p>
<h4>＜サイズ＞</h4>
<p>■ ウィジェットのサイズ（横幅、高さ）</p>
<p>初期のままだと下記のようなコードになっています。</p>
<p><code>&lt;script src=&quot;http://widgets.twimg.com/j/2/widget.js&quot;&gt;&lt;/script&gt;<br />
&lt;script&gt;<br />
new TWTR.Widget({<br />
　　version: 2,<br />
　　type: 'profile',<br />
　　rpp: 4,<br />
　　interval: 6000,<br />
　　width: 250,<br />
　　height: 300,<br />
　　theme: {<br />
　　　　shell: {<br />
　　　　background: '#333333',<br />
　　　　color: '#ffffff'<br />
　　　　},<br />
　　　　tweets: {<br />
　　　　background: '#000000',<br />
　　　　color: '#ffffff',<br />
　　　　links: '#4aed05'<br />
　　　　}<br />
　　},<br />
　　features: {<br />
　　　　scrollbar: false,<br />
　　　　loop: false,<br />
　　　　live: false,<br />
　　　　hashtags: true,<br />
　　　　timestamp: true,<br />
　　　　avatars: false,<br />
　　　　behavior: 'all'<br />
  　　}<br />
}).render().setUser('Twitterのユーザー名').start();<br />
&lt;/script&gt;</code></p>
<p>上記のコードをちょっと変更したものが下記のコードです。</p>
<p><code>&lt;script src=&quot;http://widgets.twimg.com/j/2/widget.js&quot;&gt;&lt;/script&gt;<br />
&lt;script&gt;<br />
new TWTR.Widget({<br />
　　version: 2,<br />
　　type: 'profile',<br />
　　rpp: 5,<br />
　　interval: 6000,<br />
　　width: 200,<br />
　　height: 300,<br />
　　theme: {<br />
　　　　shell: {<br />
　　　　background: 'transparent',　&lt;!-- 背景透明 --&gt;<br />
　　　　color: '#222222'<br />
　　　　},<br />
　　　　tweets: {<br />
　　　　background: 'transparent',　&lt;!-- 背景透明 --&gt;<br />
　　　　color: '#222222',<br />
　　　　links: '#0066cc'<br />
　　　　}<br />
　　},<br />
　　features: {<br />
　　　　scrollbar: false,<br />
　　　　loop: false,<br />
　　　　live: false,<br />
　　　　hashtags: true,<br />
　　　　timestamp: true,<br />
　　　　avatars: false,<br />
　　　　behavior: 'all'<br />
  　　}<br />
}).render().setUser('Twitterのユーザー名').start();<br />
&lt;/script&gt;</code></p>
<p>ここで重要なことは、backgroundプロパティにtransparentを指定することです。<br />
これによって背景が透明になるので、どのような背景にも合わせることができます。</p>
<h3>3．プロフィールウィジェットをCSSでカスタマイズする。</h3>
<p>JavaScriptの読み込みやパーマリンクの記述などがありましたが、コードが長くなってしまうので一部を省略して、CSSに関わる部分だけを残しました。</p>
<p><code>&lt;div class=&quot;textwidget&quot;&gt;<br />
&lt;div id=&quot;twtr-widget-1&quot; class=&quot;twtr-widget twtr-widget-profile&quot;&gt;<br />
&lt;div style=&quot;width: 200px;&quot; class=&quot;twtr-doc&quot;&gt;<br />
<span class="block">&lt;div class=&quot;twtr-hd&quot;&gt;<br />
　&lt;a class=&quot;twtr-profile-img-anchor&quot; href=&quot;http://twitter.com/intent/user?screen_name=Twitterのユーザー名&quot; target=&quot;_blank&quot;&gt;&lt;img src=&quot;プロフィール画像&quot; class=&quot;twtr-profile-img&quot; alt=&quot;profile&quot;&gt;&lt;/a&gt;<br />
　&lt;h3&gt;Twitterの名前&lt;/h3&gt;<br />
　&lt;h4&gt;&lt;a href=&quot;http://twitter.com/intent/user?screen_name=Twitterのユーザー名&quot; target=&quot;_blank&quot;&gt;Twitterのユーザー名&lt;/a&gt;&lt;/h4&gt;<br />
&lt;/div&gt;</span><br />
&lt;div class=&quot;twtr-bd&quot;&gt;<br />
&lt;div style=&quot;height: auto;&quot; class=&quot;twtr-timeline&quot;&gt;<br />
&lt;div class=&quot;twtr-tweets&quot;&gt;<br />
<span class="block">&lt;div class=&quot;twtr-reference-tweet&quot;&gt;&lt;/div&gt;<br />
&lt;div id=&quot;tweet-id-5&quot; class=&quot;twtr-tweet&quot;&gt;<br />
&lt;div class=&quot;twtr-tweet-wrap&quot;&gt;<br />
&lt;div class=&quot;twtr-avatar&quot;&gt;<br />
&lt;div class=&quot;twtr-img&quot;&gt;&lt;a href=&quot;http://twitter.com/intent/user?screen_name=Twitterのユーザー名&quot; target=&quot;_blank&quot;&gt;&lt;img src=&quot;プロフィール画像&quot; alt=&quot;Twitterのユーザー名 profile&quot;&gt;&lt;/a&gt;<br />
&lt;/div&gt;<br />
&lt;/div&gt;<br />
&lt;div class=&quot;twtr-tweet-text&quot;&gt;<br />
&lt;p&gt;<br />
　&lt;a class=&quot;twtr-user&quot; href=&quot;#&quot; target=&quot;_blank&quot;&gt;Twitterのユーザー名&lt;/a&gt;<br />
　ツイート部分<br />
&lt;em&gt;<br />
　&lt;a href=&quot;#&quot; time=&quot;時刻&quot; class=&quot;twtr-timestamp&quot; target=&quot;_blank&quot;&gt;0 hours ago&lt;/a&gt; · &lt;a href=&quot;http://twitter.com/intent/tweet?in_reply_to=78808835170643968&quot; class=&quot;twtr-reply&quot; target=&quot;_blank&quot;&gt;reply&lt;/a&gt; · &lt;a href=&quot;#&quot; class=&quot;twtr-rt&quot; target=&quot;_blank&quot;&gt;retweet&lt;/a&gt; · &lt;a href=&quot;#&quot; class=&quot;twtr-fav&quot; target=&quot;_blank&quot;&gt;favorite&lt;/a&gt;<br />
&lt;/em&gt;<br />
&lt;/p&gt;<br />
&lt;/div&gt;<br />
&lt;/div&gt;<br />
&lt;/div&gt;<br />
&lt;!-- &lt;div id=&quot;tweet-id-4&quot;&gt;&lt;/div&gt;~&lt;div id=&quot;tweet-id-1&quot;&gt;&lt;/div&gt; 省略 --&gt;<br />
&lt;!-- tweets show here --&gt;<br />
</span><br />
&lt;/div&gt;<br />
&lt;/div&gt;<br />
&lt;/div&gt;<br />
<span class="block">&lt;div class=&quot;twtr-ft&quot;&gt;<br />
&lt;div&gt;<br />
　&lt;a href=&quot;http://twitter.com&quot; target=&quot;_blank&quot;&gt;<br />
　&lt;img src=&quot;http://widgets.twimg.com/i/widget-logo.png&quot; alt=&quot;&quot;&gt;<br />
　&lt;/a&gt;<br />
　&lt;span&gt;<br />
　&lt;a href=&quot;http://twitter.com/dakkie10&quot; style=&quot;color:#222222&quot; class=&quot;twtr-join-conv&quot; target=&quot;_blank&quot;&gt;Join the conversation&lt;/a&gt;<br />
　&lt;/span&gt;<br />
&lt;/div&gt;<br />
&lt;/div&gt;</span><br />
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;</code></p>
<p>上のソースを簡単にまとめると下の画像みたいな感じです。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/05/twitter_widget_6.png" alt="" title="" width="484" height="400" class="alignnone size-full wp-image-2046" /></p>
<p>ウィジェットにはTwitter独自の<a href="http://widgets.twimg.com/j/2/widget.css" target="_blank">widget.css</a>というCSSが読み込まれているので、これを上書きするかたちでカスタマイズしていきます。CSSを読み込む位置はwidget.cssを上書きするので、&lt;/body&gt;タグの直前が良いかと思います。</p>
<p><strong>＜外枠を消す＞</strong></p>
<p>外枠というのは、上の画像でいうと1と3の部分です。外枠を消す、つまりツイート部分のみを表示させます。</p>
<p><code>.twtr-hd {<br />
　　display: none;<br />
}<br />
<span class="block">.twtr-ft {<br />
　　display: none;<br />
}</span></code></p>
<p><strong>＜フォントを変更する＞</strong></p>
<p>自分のブログやサイトと同じフォントにするにはウィジェットに対して新たに指定してあげる必要があります。<br />
widget.cssでフォントの指定に「!important」が使われているために「!important」を付け加えないと上書きができないので、必ず付け加えてください。</p>
<p><code>.twtr-widget {<br />
　　font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Meiryo", "メイリオ", Verdana, Helvetica, sans-serif !important;<br />
　　font-size: 93% !important;<br />
　　line-height: 1.7 !important;<br />
}</code></p>
<p><strong>＜リンクスタイルを変更する＞</strong></p>
<p>widget.cssでマウスオーバー時にテキストにアンダーラインが表示されるようになっているので、これをなくします。</p>
<p><code>.twtr-doc a:hover {<br />
　　text-decoration: none !important;<br />
}</code></p>
<p>今回、このブログで使用しているものを紹介しましたが、それ以外にもTwitter独自のwidget.cssを上書きすることによって、簡単にウィジェットをカスタマイズすることができます。</p>
<p>ただどのCSSがどこに使われているのかがわかりづらいので、Firefoxを使っている人であれば<a href="https://addons.mozilla.org/ja/firefox/addon/firebug/" target="_blank">Firebug</a>というアドオンをおすすめします。どのCSSがどこに使われているのかを簡単に見つけることができます。</p>
<p>ぜひみなさんも試してみてください。</p>
]]></content:encoded>
			<wfw:commentRss>http://dakkie.com/blog/css/twitter-widget-customize/feed/</wfw:commentRss>
		<slash:comments>12</slash:comments>
		</item>
		<item>
		<title>iPhoneのキーボードをすばやく切り替える。</title>
		<link>http://dakkie.com/blog/iphone/iphone-keyboard-change/</link>
		<comments>http://dakkie.com/blog/iphone/iphone-keyboard-change/#comments</comments>
		<pubDate>Sat, 21 May 2011 13:41:23 +0000</pubDate>
		<dc:creator>dakkie</dc:creator>
				<category><![CDATA[iphone]]></category>

		<guid isPermaLink="false">http://dakkie.com/blog/?p=1835</guid>
		<description><![CDATA[iPhoneのキーボードはデフォルトだと「日本語テンキー」「日本語ローマ字」「絵文字」「English（US）」の4種類ありますが、キーボードを切り替えるときは左下にある地球みたいなマークをタップします。 でも、「English（US）」にキーボードを切り替えるときに地球みたいなマークを3回もタップしなければいけません。 何か良い方法はないのだろうかと思っていたところ、地球みたいなマークを長押しすることによって下の画像のように表示されることがわかりました。これによってすばやくキーボードを切り替えることができます。 実はこの方法はMobile Safariのブックマークにデフォルトである『iPhoneユーザガイド』の「各国キーボード」から「キーボードを切り替える」という項目に載っています。 説明書は一通り読んでおいたほうが良いと思った出来事でした。]]></description>
			<content:encoded><![CDATA[<p>iPhoneのキーボードはデフォルトだと「日本語テンキー」「日本語ローマ字」「絵文字」「English（US）」の4種類ありますが、キーボードを切り替えるときは左下にある地球みたいなマークをタップします。</p>
<p>でも、「English（US）」にキーボードを切り替えるときに地球みたいなマークを3回もタップしなければいけません。</p>
<p>何か良い方法はないのだろうかと思っていたところ、地球みたいなマークを長押しすることによって下の画像のように表示されることがわかりました。これによってすばやくキーボードを切り替えることができます。</p>
<p><img src="http://dakkie.com/blog/wp-content/uploads/2011/05/iphone_keyboard.png" alt="" title="" width="242" height="363" class="alignnone size-full wp-image-1841" /></p>
<p>実はこの方法はMobile Safariのブックマークにデフォルトである『iPhoneユーザガイド』の「各国キーボード」から「キーボードを切り替える」という項目に載っています。</p>
<p>説明書は一通り読んでおいたほうが良いと思った出来事でした。</p>
]]></content:encoded>
			<wfw:commentRss>http://dakkie.com/blog/iphone/iphone-keyboard-change/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

