ニコニコ動画の埋め込み(外部プレーヤー対応版)

2009年12月11日 | Category: Web | タグ:

アカベコさん作の、ニコニコ動画をWordPressに埋め込むプラグインWP-Nicodo 1.1がバージョンアップしましたので、早速入れてみました。

今回のバージョンでは、外部プレーヤーでの再生に対応したり、tableレイアウトからdivレイアウトに変更になったりと、結構大きく変更されています。ドキュメントが丁寧に書かれているので、インストールも簡単。

サンプルは、行進できないトルコ行進曲↓

再生 : 301,585 コメント : 3,467 マイリスト : 2,376

2:56
2009/10/13 00:10 投稿
緩急をつけたトルコ行進曲
なんだか既視感のあるネタですが。■ 自分の他の動画→mylist/3523926 最新作(2015/01/21 ゆ.ゆ.式)...
((<・><・&g <・><・> 笑いとまんねぇwwwwww オわっと ļĺļĺļĺ 草 wwww タグwwwwwww !i!i!i!i!i i!i!i!i!i!i!i!i!i!i! 暖急って? !? i!i!i!i!i!i...

オリジナルのテンプレートを、少々いじりました。動画のタグを表示するようにし、CSSを調整しました。

<div class="nicodo">
	<div class="nicotitle">
		<a href="http://www.nicovideo.jp/" target="_blank">ニコニコ動画</a> [thumb_type]
	</div>
	<div class="nicoinfo">
		再生 : <strong>[view_counter]</strong> コメント : <strong>[comment_num]</strong> マイリスト : <strong>[mylist_counter]</strong>
	</div>
	<div class="nicothumb">
		<img src="[thumbnail_url]" /><br />
		<strong>[length]</strong>
	</div>
	<div class="nicodetail">
		<strong>[first_retrieve]</strong> 投稿<br />
		<strong><a href="[watch_url]" target="blank">[title]</a></strong><br />
		[description]
	</div>
	<div class="nicomment">
		<div class="res">[last_res_body]</div>
	</div>
	<ul class="nicotag">
		[tags/]<li><a href="http://www.nicovideo.jp/tag/[value]" target="_blank">[value]</a></li>[/tags]
	</ul>
</div>
.nicodo                     { line-height:140%; border:solid 1px #888888; color:#222222; background-color:#ffffff; background-image:url( "../../plugins/wp-nicodo/images/back.gif" ); background-position:bottom; background-repeat:repeat-x; font-size:12px; width: 483px; margin-bottom:1em; }
.nicodo .nicotitle          { background:#222222; color:#ffffff; border-bottom:solid 1px #cccccc; padding:0px 4px; text-align:left; line-height:180%; }
.nicodo .nicotitle a        { color:#ffffff; text-decoration:none; }
.nicodo .nicotitle a:hover  { text-decoration:none; }
.nicodo .nicoinfo           { padding:4px 8px 0px 8px; }
.nicodo .nicothumb          { padding:2px 8px 8px 8px; float:left; }
.nicodo .nicodetail         { padding:2px 8px 8px 8px; margin-left:90px; word-break:break-all; }
.nicodo .nicodetail a       { color:#2970A6; text-decoration:none; }
.nicodo .nicodetail a:hover { text-decoration:underline; }
.nicodo .nicothumb img      { width:80px; height:60px; border:solid 2px #333; }
.nicodo .nicomment          { padding:2px 8px 8px 8px; clear:both; }
.nicodo .nicomment .res     { font-weight:bold; background-color:#ffffff; border:solid 2px #888888; padding:8px;  }

.nicodo ul.nicotag          { border:solid 2px #888888; margin: 2px 8px 8px 8px; padding:8px; list-style-type: none;}
.nicodo ul.nicotag li       { display: inline; margin: 0 1em 0 0; padding: 0;}

コメント

コメント(5件)

    コメントプレビュープラグインを導入したので、動作テスト。
    右上のプレビューを押すと、プレビューが表示されます。
    WP-Nicodo の作者です。

    タグ部分の表示方法がとても良いですね。ニコニコ動画のタグはセンス溢れるものが多く、好みの動画検索にも役立つので、このカスタマイズには感心しました。

    こうした活用例を見ると、テンプレート機能を付けて良かったと思います。
      作者さんからコメントいただきました!
      とっても使いやすいプラグイン、ありがとうございます。

      作ろうかな、という気持ちはあったのですが、
      WP-Nicodoを見つけたら、その意欲は一気に消えましたw

      テンプレート機能は便利ですね。
      おかげさまで簡単にカスタマイズできました。
    • ID:1119
    • ABCP
    • 2009年12月14日 21:41:33
    • 返信
    <span class="topsy_trackback_comment"><span class="topsy_twitter_username"><span class="topsy_trackback_content">ブログにReTweetボタンをつけたのでテスト RT @abcpweb ニコニコ動画の埋め込み(外部プレーヤー対応版) http://bit.ly/71mmAl</span></span>
    <span class="topsy_trackback_comment"><span class="topsy_twitter_username"><span class="topsy_trackback_content">ABCP-weblog » ニコニコ動画の埋め込み(外部プレーヤー対応版) http://bit.ly/fOyY8V</span></span>

コメントする

トラックバック

トラックバック(0件)

トラックバック先

当サイトについて

栃木県宇都宮市在住のWeb屋さんのブログ。サイト設計からコーディング、プログラミングまで幅広く担当します。Web標準,WordPress,jQueryあたりに興味があります。≫PROFILE