点点主题Piano black 钢琴黑发布 by-记忆碎片
今天晚上看到一个漂亮的主题，心血来潮，花了4个多小时，熬到凌晨4点多，终于把他仿下来了。
现在仿点点主题越来越得心应手啊，希望能通过点点的审核，望大家能喜欢。
钢琴黑风格，有点酷酷的感觉
首页截图
给一张截图吧！
文章页面截图
本主题同样支持多图布局模式，无论是文章，图片，音乐，视屏，都有完美的表现。
本主题暂未经过长时间试用，所以，可能存在一些bug，希望能得到大家的反馈。
坑爹大了，花了4个多钟做的主题，才发现别人已经做过了，但是貌似他没有分享，好吧，那我还应该是首发，安慰下自己...（其实很郁闷...，糗大了...）
好吧，我找到别人发的了，只能取消发布了，悲剧，我的5个钟啊...
我才发现，他解决了右侧的最新文章调用（貌似我还不会，正好我可以学下），还有分页处理的也比我好，但是呢，值得欣慰的是，我的主题支持fancybox（虽然我是用别人的插件，但是前一个主题，我可是自己悲催的做出这个功能才发现别人也已经做好了...）
快天亮了，我还是睡吧，明天研究他怎么调用最新文章的，我看到开发文章中有这句“不用自定义视图，真心做不出最新文章的...”难道我理解错了...
已经研究出了最新文章的调用见早上发的点点模板调用最新文章。
既然点点有了，我就不在模板中心发布了，在这里共享一下吧，大家一起交流...
<script type="server/javascript">
if (dian.request.action === 'latestpost.html'){
require('dd://assets/2012/0718/180307hJcO/latestpost.coffee').latest({layout:"ul",each:"li",length:"30"});
return;
}
</script>
<!DOCTYPE html>
<html>
<head>
{$meta.syntaxhighlighter}
<meta charset="utf-8"><title><? require('dd://assets/2012/0713/181755Gh6M/seotitle.coffee').title(" - "," | ", 10,"没有找到文章哦")?></title>
<meta name="description" content="{$meta.description|nohtml}">
<meta name="keywords" content="{$meta.keywords|nohtml}">
<link href="{$meta.rss}" rel="alternate" title="订阅{$global.name|nohtml}" type="application/rss+xml">
<link rel="shortcut icon" type="image/jpeg" href="{$meta.favicon}">
<link rel="apple-touch-icon" href="{$meta.mobile_icon}">
<script type='text/javascript' src='http://t.papaapp.com/js/libs/jquery/1.7.2/jquery.js'></script>
<link rel="stylesheet" href="http://t.papaapp.com/css/base/rich-content.css">
<link rel="stylesheet" href="http://x.papaapp.com/farm1/2893f5/377dc69f/0.css">
<script type="text/javascript" src="http://x.papaapp.com/farm1/2893f5/dbf0307d/scroll.js"></script>
<script type="server/javascript">
require('dd://assets/2012/0728/133407NYL6/fancybox.coffee').fancybox({
openEffect:"elastic",closeEffect:"elastic",titleType:"float",closeBtn:false,helper:true,mouseWheel:true,
autoAdd:"#content"
})
</script>
<!--[if IE 7]>
<<style type="text/css">.header_menu ul ul .parent_menu > a { margin:0 0 -4px 0; position:relative; }#search_input { top:9px; }#bread_crumb li { padding-bottom:14px; }#footer { height:174px; }</style>
<![endif]-->
</head>
<body class="default">
<div id="header_menu"></div>
<div id="header">
<div id="logo">
<h1 id="logo_image" style="top:72px ; left:38px;">
<a href="{$global.url}" title="{$global.name}">{$global.name} </a>
</h1>
</div>
<div id="header_meta">
<div id="header_search_area">
<form method="get" id="searchform" action="/">
<div>
<input id="search_input" type="text" value="搜索" name="q" placeholder="搜索" onfocus="if (this.value == 'SEARCH') this.value = '';" onblur="if (this.value == '') this.value = 'SEARCH';" />
</div>
<div>
<input type="image" src="https://huilang.me/wp-content/uploads/2013/08/095227wb5.gif" alt="Search from this blog." title="Search from this blog." id="search_button" />
</div>
</form>
</div>
<a href="{$meta.rss}" rel="nofollow" class="target_blank" id="header_rss" title="RSS" >RSS</a>
{?inbox}<a target="_blank" rel="nofollow" href="{$inbox.url}/" class="target_blank" id="header_twitter" title="私信" >私信</a>{/inbox}
{?contribute}<a rel="nofollow" href="{$contribute.url}/" class="target_blank" id="header_facebook" title="投稿" >投稿</a>{/contribute}
</div>
</div>
<div id="contents" class="cf">
<div id="left_col">
<div class="post">
{?!posts}<h3 class="post_title">还没有任何文章哦！</h3>{/!posts}
<? var i = 0 ?>
{?loop:posts}
<? num = i++ ?>
{?post.text}
{?$text.title}<h2 class="post_title"><a href="{$post.url}">{$text.title}</a></h2>{/$text.title}
<ul class="post_info">
<li>{$post.date}</li>
</ul>
<div class="post_content cf">
{?view.list}
{?text.thumbnail}<a class="fancybox" href="{$text.thumbnail.1280.src}"><img style="float:left;margin:10px;" src="{$text.thumbnail.square_250}"/></a>{/text.thumbnail}
<p>{$text.summary}</p>
{/view.list}
{?view.post}
{?$text.content}
<p>{$text.content}</p>
{/$text.content}
{/view.post}
</div>
{/post.text}
{?post.photo}
{?$photos.title}
<h2 class="post_title"><a href="{$post.url}">{$photos.title}</a></h2>
{/$photos.title}
<div class="post_content cf">
<center>
{?view.list}
<script type="server/javascript">
require('dd://assets/2012/0803/135225olqy/photo.coffee').photos({ maxwidth:"500",maxheight:"800",margin:"10",padding:"5",border_width:"2",post: num ,class:"fancybox" })
</script>
{/view.list}
{?loop:photos}
{?view.post}
<center><a href="{$photo.1280.src}" class="fancybox" data-fancybox-group="gallery"><img src="{$photo.500.src}" alt="{$photo.description|nohtml}" onload="fixImgSize(this)"/></a></center>
<p style="text-align: left;">{?$photo.description}{$photo.description} {/$photo.description}</p>
{/view.post}
{/loop:photos}
</center>
<br />
{?$photos.description}{$photos.description}{/$photos.description}
</div>
{/post.photo}
{?post.link}
<h2 class="post_title"><a href="{$link.url}" target="_blank"> {?$link.title}{$link.title} {$link.url}{/$link.title} →</a></h2>
{?$link.description}<div class="post_content cf"> {$link.description}</div> {/$link.description}
{/post.link}
{?post.audio}
<h2 class="post_title"><a href="{$post.url}" title="{$audio.song|nohtml} - {$audio.artist|nohtml}">{$audio.song|nohtml} - {$audio.artist|nohtml}</a></h2>
<div class="post_content cf">
<div class="audio-cover">
<a style="float: left;margin:10px;" href="{$audio.cover}" class="fancybox" ><img src="{$audio.cover_185}" alt="{$audio.song|nohtml} - {$audio.artist|nohtml}" onload="fixImgSize(this)"></a>
<div style=" margin: 70px 30px; float: left;">{$audio.player} <br/><b>{$audio.song|nohtml} - {$audio.artist|nohtml}</b></div>
<div style="clear:both"></div>
{?$audio.description}{$audio.description}{/$audio.description}
</div>
<div style="clear:both;"></div>
</div>
{/post.audio}
{?post.video}
<h3 class="post_title"><a href="{$post.url}">精彩视屏分享</a></h2>
<div class="post_content cf">
<center><div class="video-player">{$video.player}</div></center>
{?$video.description}
<div class="entry rich-content">{$video.description}</div>
{/$video.description}
</div>
{/post.video}
{?view.list}
<div class="post_meta">
<ul class="cf">
<li class="post_comment">热度：{$post.notes_count}；喜欢：{$post.like_count}</li>
<li class="post_category"><a href="{$post.url}" rel="category tag">阅读全文</a></li>
{?post.tag}<li class="post_tag">{?loop:post.tags}<a href="{$post.tag.url}" rel="tag" target="_blank">{$post.tag.name}</a> . {/loop:post.tags}</li>{/post.tag}
</ul>
</div>
{/view.list}
{?view.post}
<div id="comments_wrapper">
<div id="comments">
<div id="form_area">
{#sys:notes.text_color|value:"#444444"}
{#sys:notes.blockquote_color|value:"#E7EAEE"}
{#sys:notes.block_bg_color|value:"#D7DADD"}
{#sys:notes.block_border_color|value:"#C7CACC"}
{#sys:notes.operation_link_color|value:"#999999"}
{#sys:notes.enable_border_radius|value:"true"}
{#sys:notes.width|value:"582"}
{$post.notes}
</div>
</div>
</div>
{/view.post}
{/loop:posts}
</div>
<div style="margin: 0 0 50px 40px;" id="prev_next_post cf">
{?pagination}
{?pagination.prev}<p class="next_post"><a href="{$pagination.prev.url}" rel="next">← 前一篇文章</a></p>{/pagination.prev}
{?pagination.next}<p class="prev_post"><a href="{$pagination.next.url}" rel="prev">下一篇文章 →</a></p>{/pagination.next}
{/pagination}
</div>
</div>
<div id="right_col">
<h3 class="side_title" id="info_title">INFORMATION</h3>
<div class="side_box" id="info_box">
<p>{$global.description}</p>
</div>
<div id="side_top">
<div class="side_box">
<h3 class="side_title">RECENT ENTRY</h3>
<div id="newest"></div>
</div>
</div>
<div id="side_middle_ex" class="cf">
<div id="side_left">
<div class="side_box_short">
<h3 class="side_title">Tags</h3>
{?tags}
<ul class="wp-tag-cloud">
{?loop:tags}
<li class="cat-item"><a href="{$tag.url}"{?tags@current} class="current"{/tags@current}>{$tag.name}</a></li>
{/loop:tags}
</ul>
{/tags}
</div>
</div>
</div>
<div class="side_box">
<ul id="copyrights">
<li>Copyright © <a href="{$global.url}" title="{$global.name}">{$global.name} </a></li>
<li>Theme <a href="https://huilang.me/piano_black/" target="_blank" title"Piano black">Piano black</a> designed by <a href="https://huilang.me/" class="target_blank">记忆碎片</a></li>
<li>Powered by <a href="http://www.daindian.com/" class="target_blank">点点</a></li>
</ul>
<div style="clear:both;"></div>
</div>
</div>
</div>
<div id="footer">
<a href="#header_menu" id="return_top"><img src="https://huilang.me/wp-content/uploads/2013/08/095227hRl.png" alt="" title="" class="rollover" /></a>
</div>
<script type="text/javascript">
$(document).ready(function(){
$("#newest").load("{$global.url}/do/latestpost.html?_posts[limit]=5");
});
</script>
</body>
</html><!--powered by venus-->