コトノハ Roll をブログに貼り付けて自分流カスタマイズを【その１】

2006-09-10T03:40:45+09:00

Tag: blogparts, CSS, design, kotonoha, コトノハ

オオヒダさんがコトノハという○と×をつけて楽しむ Web サービスをつくりだして、もはや１年が経とうとしています。

私にとってこのコトノハは、趣味で Web デザインの勉強をしていたなかで、リニューアルデザインを携わることになったサービスでもあり、その思い入れは特別のものがあります。

「コトノハ - ○×ソーシャル」とは

人生の経験値というチェックリストをヒントにオオヒダさんがつくった、 ○と×をつけて遊ぶとても軽快なサービスです。

その軽快さゆえに、回答するときのコメントが誰にあてるわけでもなく、どこに文章を書くよりもふとした感情を出せる気がして、ひとつひとつの「コト」に対するコメントの欠片が集まった「コトリスト」こそ、とても素直な自己紹介になってしまっているように思います。

そんなコトリストの一部をブログにはりつけることもできます（コトノハ Roll といいます）。すでにコトノハをお楽しみの方で、ブログにコトノハ Roll を貼付けている方もいらっしゃることと思いますが、このたびコトノハ Roll がパワーアップしました！！

今回、コトノハ Roll がパワーアップしたところ

柔軟なカスタマイズがしやすくなりました。○と×の色分けや、細かい設定が可能です。
今までコト名と回答数だけが表示されていたところを、コメントの表示ができるようになりました。

使い方は今まで通り、すでにコトノハユーザ登録している場合は、コトノハ - コトノハRoll に記載の「魔法の呪文」スクリプトを HTML に貼り付けるだけで表示が可能です（まだ何も回答していない場合は表示されません）。

コトノハ Roll を自分流にカスタマイズしてみましょう

今回、コトノハ Roll では各要素に class 指定をしてあるので、CSS を使っていろいろな魅せ方ができるようになりました。実際、このブログでも、○と×の色分けや、このブログのデザインにあわせて表示できるようになりました。

コトノハ Roll で吐き出す HTML

コトノハ Roll で吐き出す HTML のサンプルに、class 名称をハイライト表示してみました。


<ul id="kotonoha-roll">
<!-- ○のコトの場合 -->
    <li class="kotonoha-maru">
        <span class="kotonoha-maru">○</span>
            <a href="http://kotonoha.cc/no/1234" target="_blank">
                コト名
                <span class="kotonoha-count">(○×数)</span>
            </a>
            <div class="kotonoha-comment">コメント</div>
    </li>
<!-- ○のコトの場合ここまで -->

<!-- ×のコトの場合 -->
    <li class="kotonoha-batsu">
        <span class="kotonoha-batsu">×</span>
            <a href="http://kotonoha.cc/no/1234" target="_blank">
                コト名
                <span class="kotonoha-count">(○×数)</span>
            </a>
        <div class="kotonoha-comment">コメント</div>
    </li>
<!-- ×のコトの場合ここまで -->
</ul>

CSS を書くことができる方ならお持ちのブログにあわせて書き換えていくことができることと思いますが、次回は CSS を使って細かくカスタマイズする方法を紹介します。

by purprin
at September 10, 2006 03:40
in Web

▲ top

« Prev entry
Next entry »

Comments

* Gravatarに登録(FREE)するとあなたのアバターが表示されます。

▲ top

- ひかり（矢崎）
- 次回まで見れば、○×に色をつけられるようになるのですね！ワクワクテカテカ。
  
  ところでこの（自分じゃないひとの）更新順って、コトリストに反映させたらサーバ重くなっちゃいます？
  思いがけなく古いコトが発掘される楽しさ、みたいなものを他のひととも共有したい、と思うようになってきました。
  （完全なランダムでもいいんでしょうけど。どっちかで）
September 10, 2006 10:26 AM
- purprin
- > ひかり（矢崎）さん
  こんにちは。たしかに複雑なほど重くなるとは思いますが、自分以外の更新順の反映、については、はおっしゃるとおり、発掘される楽しさがありそうですね。
  
  今のところはパラメータ type=1 で過去の自分が答えたものの再発掘、という感じでしょうか(o e o)>
  
  カスタマイズの記事、ひととおり書いてみました。是非、ひかりさんもカスタマイズしてみてくださいねー！
September 11, 2006 11:56 PM
- Ｍａｋｋｙ
- 初めまして★
  『コトノハ』からお邪魔した、
  Ｍａｋｋｙと言います。
  分かりやすい解説だったので、
  私でも簡単にカスタマイズするコトが出来ました。
  とっても参考になりました。
  
  ありがとうございました♪
  TBをさせていただいたのですが、
  エラーになってしまい何度も送信してしまいました。
  もし複数TBされてましたら、
  削除していただけませんでしょうか？
  お願いします…m(_ _"m)ﾍﾟｺﾘ
  これからも利用させていただきますね。
February 28, 2007 11:17 PM
- purprin
- > Ｍａｋｋｙさん
  はじめまして。お使いいただきありがとうございます。
  カスタマイズされたコトノハ Roll を拝見するのがとても楽しみになっています。今後ともよろしくお願いします。
March 1, 2007 1:57 AM