Yoshioriの日記: Voxのお題に答えたエントリーをMovableTypeで表示♪

というわけで、「Vox」やってみたのですが、
せっかく答えたお題をこっちのブログにも乗せたいぜ！！

と、思い色々やってみました。

まずはPlaggerで「Publish::MT」のソースとmt.ttをいじって
こちらにも同じ物が投稿されるようにしたんだけど、
そうするとコメントとかが両方に分かれちゃって不便だなぁと・・・

で、却下。
(作ったのは今後使えそうなので一応取っておく(^^;)

で、まぁ結局「はてな」と同じように
PHPのMagpieRSSを使って持ってきて
適当にclassつけて置く形へ・・・

需要があるかわからないけど
ソース晒しておきます。

あ、「MovableTypeで外部のRSSを取得♪」で書いた
MagpieRSSの導入は終わってるの前提ね・・・

vox.php

<?php
require_once 'rss/rss_fetch.inc';
require_once 'rss/rss_utils.inc';
drawVox(@fetch_rss("http://yoshiori.vox.com/library/posts/tags/qotd/rss.xml"));
drawVox(@fetch_rss("http://yoshiori.vox.com/library/posts/tags/vox+hunt/rss.xml"));
function drawVox($rss){
	$items = array_slice($rss->items, 0, 1); 
	echo "<div class=\"vox\">\n";
	foreach ($items as $item ) {
		$title = mb_convert_encoding($item[title], "utf-8", "auto");
		$url = $item[link];
		$description = mb_convert_encoding($item[description], "utf-8", "auto");
		echo "<div class=\"item\"><div class=\"title\"><a href=\"$url\">$title</a></div><div class=\"description\">$description</div><div class=\"footers\"><a href=\"$url\">Permalink</a></div></div>\n";
	}
	echo "</div>\n";
}
?>

rssのURLは自分のに書き換えてください。

で、「インデックステンプレート」の
表示させたいところに


<h3 class="module-header">Vox</h3>
<?php
require("vox.php");
?>
<div class="powerd-by-vox">Powered by <a href="http://yoshiori.vox.com/">Vox</a></div>

って書いて終わり。

一応、俺のスタイルシートも晒しておくので
色とか適当に変えて使っちゃってください。
(後半はVoxからパクって来た)

<style type="text/css">
<![CDATA[
.vox{
	width:49%;
	float:left;
}
.vox .item{
    border:solid 1px #666; 
    margin:1em 0.5em 0.5em 0.5em;
    padding-top:1em;
    position:relative;
}
.vox .item .title{
    margin:0;
    border:solid 1px #666;
    padding:0.2em 0.5em 0.1em 0.5em;
    font-size:100%;
    font-weight: bold;
    position:absolute;
    display:inline;
    top:-0.7em;
    left:1.2em;
    background: #1f2d3a;
}
.vox .item .title a{
    color:#f93;
}

.vox .item .title a:hover{
    color:red;
}

.vox .item .description{
    text-indent:1em;
    margin:0.5em;
}
.vox .item .description .section p {
    margin: 1px ! important;
}
.vox blockquote{
    text-indent:0em;
    color: #FFFFFF;
    background: #7FCAE2;
    padding:0.2em 0.5em 0.1em 0.5em;
}
.vox .item .footers{
        text-align:right;
        font-style: italic;
        font-size:95%;
}
.powerd-by-vox{
        text-align:right;
        font-style:italic;
        font-size:95%;
        clear: left;
}
.enclosure-list .enclosure-item {
    margin-bottom: 10px;
}
.enclosure-list .last { margin-bottom: 0; }

.enclosure-asset-name {
    margin-top: .5em; /* margin-top for space from image */
    margin-bottom: 0;
    padding-bottom: 0;
    overflow: hidden;
    font-size: 12px;
}

.enclosure-meta {
    margin-bottom: 0; /* override default DL behavior */
    font-size: 10px;
}

.enclosure .enclosure-inner .enclosure-list {
    margin: 0;
    padding: 0;
}

.enclosure .enclosure-item { list-style: none; }

.enclosure-strip-horizontal .enclosure-item { 
    float: left;
    margin-right: 9px;
    width: 120px; 
}
.enclosure-strip-horizontal .media-asset .enclosure-image {
    display: inline;  /* Win IE */
    font-size: 132px;  /* Win IE hack inspired by http://mrclay.org/web_design/centered_image/ */
    display: table-cell;  /* rule for CSS 2.x browsers */
    vertical-align: bottom;
    overflow: hidden;
    height: 120px;
    width: 122px;
    margin: 0;
    text-align: center;
}
#page .enclosure-image[class] { font-size: 10px; } /* unhack above font-size */

.enclosure-strip-horizontal .enclosure-asset-name {
    margin-bottom: 3px;
}

.enclosure-strip-horizontal .enclosure-meta {
    height: 3.6em;
    overflow: hidden;
}

]]>
</style>

というわけで、誰か一緒に「Vox」やろうぜ！！

(マイミクの人でmixiで日記書いてる人を誘ったけど
今のところ返事無し・・・orz)

追記：
javascript版はこちら↓
Voxのお題に答えたエントリーをjavascriptで表示♪