WP主题的“音乐样式”小结
文章样式是WP3.1版本推出的一个新功能,虽然对于老博客来说用处不是很大(因为要操作的文章比较多),所以“能见度”很低……我在刚推出的那段时间也试着折腾了一些,一直用到现在,基本来说,仿微博客,但貌似不很成功……有同学提到如何实现,所以本篇就介绍一下ink主题目前使用的“音乐样式”。
主题老鸟可以略过本篇内容,或截取使用。因为具体过程完全可以参考官方的twentyeleven……话不多说,上代码~~
1、function.php里注册相应的样式名称,例如我加的:add_theme_support(‘post-formats’, ‘audio’);
2、index.php里面while(have_posts()) : the_post();?>这一行,直到endwhile; ?>之间的内容剪切下来,改成如下样式:
1 2 3 |
<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?> <?php get_template_part( 'content', get_post_format() ); ?> <?php endwhile; ?> |
3、主题目录下新建文件content.php,把第二步剪切下来的内容粘贴到里面,存储,这主要是设置默认的显示样式;
4、复制一份content.php,重命名为content-audio.php,这个便是要定义的音乐样式了。把the_content()这一行删掉,写入需要显示的内容,例如我增加了5个内容:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<?php $soContent = $post->post_content; $soImages = '~<img [^\>]*\ />~'; preg_match_all( $soImages, $soContent, $thePics ); $allPics = count($thePics[0]); echo '<div class="audioback"><a href="'; echo the_permalink(); echo '" rel="nofollow"><div class="overlay"></div>'; if( $allPics > 0 ){ echo $thePics[0][0]; } else{ echo '你的默认图片地址';//改为你需要的图片地址 } echo '</a></div>'; ?> |
以上内容为获取并显示文章第一张图片
update 11.12.17:默认图片,感谢 phoetry
1 2 3 4 5 6 7 8 9 10 |
<?php $soContent = $post->post_content; $soMedia = '~<embed [^\>]*\ />~'; preg_match_all( $soMedia, $soContent, $theMidea ); $allMedia = count($themedia[0]); if( $allMedia > 0 ){ echo '<div class="audio">'; echo $themedia[0][0]; echo '</div>';} ?> |
以上内容为获取并显示第一个内嵌的播放器,接下来格式输出~~
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<div class="audioauthor"> <a href="<?php the_permalink() ?>" title="<?php the_title() ; ?>" rel="bookmark"> <?php the_title(); ?> </a> </div> <div class="audioviews"> Played <?php post_views('<span class="playtime">', '</span>') ?> times </div> <a href="<?php the_permalink() ?>#comments" title="<?php the_title() ; ?>" rel="bookmark"> <div class="more-play"> <span class="yplay"> <?php comments_number('占个前排','1 位听众','% 位听众');?> </span> </div> </a> |
这就是所有关键步骤了。除此之外再根据主题具体需要定义一下css样式就可以了,对于做过主题的盆友来说这一步一定不是问题~~
转载请注明转自:WP主题的“音乐样式”小结
未匹配到图片时, 是不是调用一张默认图片比较好呢.
话说, 文章样式出来好几个版本了, 我还没碰过…
@phoetry 我用的是未匹配就不显示,因为那样就全是默认图片了…
@phoetry 额,我理解错了……加个默认图片,谢谢提醒
我是两个div,一个图片,一个是歌曲和介绍,自己手打,没有写成固定格式
唔唔,很有用。标个星号~
@静夜燃香 哼,话说这两个月你净刷微博了……
木看明白啊~~
@小年 反过来再看看
一直懒得折腾这个,1是没多大用处,2是多了太多工作
@zwwooooo 嗯,集成完的话基本是一劳永逸~~不过真没啥用处
有的时候想放点儿音乐,想想就放弃了,辛辛苦苦独立出来,一下子回到qq空间时代。。。
@Veezy 偶尔放点呗,要不跟你似得半年不更新……
@axiu 没没,我是说首页直接加载音乐。文章里放音乐挺好的~
啊我要更新。3天之内
懒得搞这些了 麻烦死
原来里面的样式是这么来的啊。我说呢。下个主题试下。
@wmtimes 好,祝你成功
这样不会写代码的情何以堪,我一直想加个文章样式。。。

@心迷魔乐 仔细看看就明白了
@axiu CSS那块要自己写,函数看不懂。懂不懂和认不认真看无关系。
怎么着也得支持一下,哪天用上了也说不定(音乐站)。
貌似没有太明白你怎么匹配的,为啥不匹配以MP3或者其他音乐格式结尾的呢?要知道你匹配的是播放器,如果是视频,那也匹配到了。
@王叨叨 因为我用的全是虾米……MP3的话,不稳定,而且有版权神马的。而且,既然用的音乐样式,为什么要往里面放其他东西
加点音乐好,吸引人 我喜欢
吸引人 我喜欢