经常有童鞋问如何将CMS首页焦点幻灯也显示在BLOG布局中，留言中无法说明白，现在就教大家将CMS首页焦点幻灯移植到BLOG布局中，不要看见长长的代码就头晕，只要按着下面的步骤操作就可以了。
具体效果如图：
此文于2011年11月3日23点修正，排除BLOG布局置顶文章显示，参考来自官方Codex
提示：编辑修改模版文件，请使用notepad++或EmEditor文本编辑软件，通过FTP软件上传覆盖原文件，或者在Wordpress后台外观→编辑中修改模版文件，切记不能用操作系统自带的记事本修改中文模板， 否则会改变模版编码，造成主题错位或乱码（中文模版编码为：UTF-8 无BOM）。
一、打开blog.php，把CMS首页焦点幻灯调用代码：
- <?php include (TEMPLATEPATH . '/includes/slider.php'); ?>
- <?php wp_reset_query();?>
- <div class="clear12"></div>
- <?php
- $sticky = get_option( 'sticky_posts' );
- $args = array(
- 'ignore_sticky_posts' => 1,
- 'post__not_in' => $sticky,
- 'paged' => $paged
- );
- query_posts( $args );
- ?>
加到第12行
- <!-- end: navigation -->
下面。
二、再把幻灯JS代码：
- <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.cycle.all.min.js"></script>
加到header.php模版：
- <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/muscript.js"></script>
后面。
三、将幻灯样式加到HotNewspro\css目录中的css.css最后：
- /** slideshow **/
- #slideshow {
- position:relative;
- background:#fff;
- width:710px;
- height:248px;
- padding:10px;
- border:1px solid #ccc;
- }
- .slideshow {
- width:710px;
- height:248px;
- overflow:hidden;
- }
- .featured_post{
- width:708px;
- height:248px;
- overflow:hidden;
- }
- .slider_image,.slider_image img {
- float: left;
- width:400px;
- height:248px;
- }
- .slider_post {
- float:right;
- width:280px;
- padding-right:10px;
- }
- .slider_post p{
- font-size:13px;
- text-indent:2em;
- margin-top:5px;
- line-height:24px;
- }
- #slider_nav {
- position:absolute;
- z-index:999;
- margin:210px 0 0 270px;
- }
- #slider_nav a {
- background:url(../images/slider_nav.png);
- float:left;
- line-height:24px;
- padding:0 8px 0 8px;
- color:#ebebeb;
- text-shadow: none;
- }
- #slider_nav a.activeSlide { color:#f99356;}
- #featured_tag {
- background:url(../images/featured.png);
- position:absolute;
- width:21px;
- height:79px;
- left:0px;
- top:20px;
- z-index:999;
- }
- .news {
- position:absolute;
- width:51px;
- height:51px;
- rightright:-3px;
- top:-3px;
- z-index:10;
- }
- .cat_name {
- position:absolute;
- line-height:20px;
- rightright:100px;
- top:-1px;
- text-align:center;
- padding:0 20px 0 20px;
- border:1px solid #ccc;
- }
- #map_h {
- width:980px;
- }
- .time_h {
- float: left;
- margin: 0 0 0 10px;
- }
- .tag_t {
- float:right;
- width:750px;
- height:23px;
- overflow:hidden;
- }
- .tag_t a {
- padding:0 0 0 10px;
- font-weight:bold;
- text-shadow: 0px 1px 0px #fff;
- }
最后刷新页面，看看是不是幻灯也正常显示在BLOG布局中了。
同理，还可将幻灯加到blog_page.php独立博客模版中。
另有童鞋问如何将顶部的热点文章加到CMS首页去，这个简单些：
用下面的代码：
- <?php if (get_option('swt_hot') == 'Hide') { ?>
- <!-- header_image -->
- <div class="banner">
- <?php
- $header_image = get_header_image();
- if ( ! emptyempty( $header_image ) ) :
- ?>
- <img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" />
- <?php endif;?>
- </div>
- <!-- end:header_image -->
- <?php } else { include(TEMPLATEPATH . '/includes/top_hot_a.php'); } ?>
替换header_h.php中138到140行：
- <div id="map_h">
- <div class="tag_t"><?php wp_tag_cloud('smallest=12&largest=12&orderby=count&unit=px&order=&order=RAND&exclude&include=&number='.get_option('swt_top_tag'));?></div>
- </div>
本站文章大部分为原创，用于个人学习记录，可能对您有所帮助，仅供参考！
我的微信
微信号已复制
版权声明
本站原创文章转载请注明文章出处及链接，谢谢合作！
江苏省苏州市张家港市 1F
呵呵，不错呀，谢谢分享了
山东省烟台市 2F
越来越强大了，必须的支持！
浙江省台州市 3F
谢谢了！太好了！
河南省信阳市固始县 4F
不错不错，嘿嘿！
广东省佛山市 5F
收藏了 找很久了
广西柳州市鹿寨县 6F
哈哈，谢谢哦，今天下午你在邮件里还跟我说等有空你写一个教材，没想到这么快就出来啦。真是太感谢了。不过改变后BLOG布局里有一点我觉得还是不如意，那就是热度旁边那个图表黄色的“新”我总觉得不如CMS布局里红色的“NEW”来得美观和醒目！
广东省汕尾市 7F
强烈支持，我本来都想修改的，可是鉴于我对代码的不熟悉，修改不成功..谢谢提供..如果后台有个开启开关那是更好地..
北京市 8F
在cms模式下如何在底部分类中添加内容，我的底部8个分类中只显示一个分类名称，并且都是空的，还有就是如何添加分类图标，多谢帮忙给看一下http://www.gmpee.org
中国 B1
@ gaogao 看使用说明
河北省石家庄市 9F
应该加大这类局部应用分享，让不太懂技术的博友也能自己动手修改自己喜欢的theme。
浙江省杭州市 10F
很不错的效果，回去试试看
广西柳州市 11F
blog布局改好后，登陆后界面出错，原来在顶部的变在了底部，是这样的，而且奇怪的是，改完后，好几个中文输入法不能用了~~~
这个出现在左下角了，而且是文字形式。原来在顶：
广西柳州市 12F
是在你这个留言版不能用ＡＢＣ输入法
中国 B1
@ lovemurder 经测试未发现，这个就是用ＡＢＣ输入法打的
广西柳州市 13F
那个幻灯右下脚的“12345”数字后面的小灰色方块也不见啦~~~
中国 B1
@ lovemurder 教程中每一步都不少，否则就是这样了
估计你未加载幻灯JS
广东省东莞市 14F
在写个把blog顶部那4个转到CMS
中国 B1
@ 亮亮 这是个蛋疼的问题，NO
广东省汕尾市 B1
@ 亮亮 这个就很容易修改..看看我的博客吧，是否你想要的..我的博客好像就有你描述的样板..我修改了，可以正常使用..
广东省广州市 15F
哎呀呀，又有新东西，马上试用！
广东省汕尾市 16F
修改添加后，是可以显示幻灯片，可是原本旁边有文字描述的，修改添加后却为空..修改了多次还是一样..最后换回去了..
中国 B1
@ 殊仙俺亦 可以重新复制样式代码，之前的代码有点错误
广东省汕尾市 B2
@ 知更鸟 谢谢站长的提示与跟进..回去我试试..
广西柳州市 B2
@ 知更鸟 请问鸟哥，哪里有错啦？哈哈，今天我重新做了一次，弄好了。就是登陆后，那个原来在顶部的管理菜单还是跑最底部去了。能修复就好，但其实这个问题也不大，不影响普通用户浏览就好~~~
广东省中山市 17F
行了~为什么没有显示多个幻灯片呢？
中国 B1
@ 小坚 总共三步，你丢了一步，未加载JS文件
安徽省合肥市 18F
最近发现一个趋势，博客往CMS方向发展，CMS往博客发展
福建省厦门市 19F
哈哈，原来不止我一个人需要这样的效果
前一段时间已经实现了，现在想实现文章自动伸缩功能，搞不过来
非常感谢鸟大的这款主题，折腾性太强大了
广东省中山市 20F
行啦~第二步代码加错了。~嘿嘿~
再问问鸟哥，复制代码的时候怎么去掉左边的数字序号呀~
刚那份css的代码我一个个删掉的 1. 2. 3. ~
中国 B1
@ 小坚 杯具…请使用Firefox或chrome和opera，复制代码，就是不能用IE
河北省沧州市 21F
哥哥，真牛啊，主题不错，赞一下
广东省广州市 22F
又有疑问，幻灯片的文章能够自定义吗？比如按照热点，现在好像是按照更新时间的，这样首页重复内容了哦
中国 B1
@ 小坚 设置日志置顶，使用说明中已写
重庆市 B2
@ 知更鸟 发现一个问题，如果设置5篇日志置顶，幻灯片是置顶文章里，但是日志置顶，幻灯片下面的文章显示的前五篇都是置顶的文章，这个跟按照更新时间显示效果一样，最好能设置成安装blog模式中顶部热点图片hot的模式！～
河北省沧州市 B3
@ 非常木 赞同哦 要怎么修改呢 我的现在置顶 跟幻灯片是重复的文章
中国 B4
@ T.K 文章已更新的，此问题已解决…
中国 B3
@ 非常木 文章已更新的，此问题已解决
重庆市 23F
我发现在第三步中background:url(../images/featured.png)这个，需要把两点改成一点才能正常显示featured.png和slider_nav.png，不知道大家的情况是怎么样的。
广东省中山市 24F
鸟哥，刚闲逛一个博客，人家说换主题了，原因是因为你的主题太好但太多人用了。。
啥时候你要弄个收费就好了，我们愿意买呃【我说这句话会被人海扁吧。。。】
中国 B1
@ 小坚 是啊，用的人确实多，目前的版本下载已超过1万
想弄个独一无二的主题，就只有订制了
福建省厦门市 B2
@ 知更鸟 鸟哥 帮我也看看 我按照那三部 把代码都弄进去了 怎么还没有显示呢
中国 B3
@ ohiyu 提示：使用或修改主题请保持页脚作者链接，谢谢！
上海市 25F
新建页面后，会在页脚显示。这个怎么去掉？鸟哥的搜索，为啥老是不能用，您站内容忒多了。找晕了，都找不到。
广西柳州市 26F
鸟哥，有一个问题。为什么我在把所有文章删除并且清空回收站以后，首页右侧还可以看到那些文章的列表呢？鼠标移动到上面会显示文章内，但点击后进入的是未知页面，内容为“对不起！这个真没有”
博客留言，没有图，不知道你能看明白不~~~
中国 B1
@ lovemurder 你的问题还真不少，呵呵
文章删除后，应该不会出现你说明的情况
主题支持留言贴图，没看见下面的“插入图片”？
重庆市渝中区 27F
鸟哥。这个留言字数即时数据统计怎么弄的。。
中国 B1
@ 强龙 这只是个试验的东西，没什么用
河南省郑州市 B2
@ 知更鸟 留言字数统计这段js有问题，超500字不提示，messagemessage.value多了一个message
台湾省 28F
Google XML Sitemaps很好用
不過最近遇到困擾,Google說每個Sitemap只能有50000條網址,超過了怎麼辦?
Google XML Sitemaps並沒有自動切割的功能?
麻煩鳥哥解惑
中国 B1
@ 蘇丞泰 如果真有此事，那么5万篇文章，对一般网站就是天文数字了，我开博三四年也就几百篇日志，再过十年二十年，5万也不可能达到，是不是
江苏省无锡市 29F
不错很给力分享了
四川省成都市 30F
你的模板有更新哦，啥时候发布出来呢？
中国 B1
@ 四川人 没有什么值得的更新的
广东省中山市 31F
鸟哥，网站最底部最右边的那个 xx次查询 是什么意思？
中国 B1
@ 小坚 数据库查询
福建省福州市 32F
学习了,这个插件不错
广西柳州市 33F
鸟哥，在wordpress主题设置的“订阅”里面，有两个要填的内容，“输入你的Feed地址”和“输入你的订阅HTML代码”，前面的我搞定了，但是后面那个是什么呀？我一直没弄明白。
中国 B1
@ lovemurder 添加烧录网站提供的HMTL代码
广西柳州市 B2
@ 知更鸟 鸟哥，我还真没找到。它只给了我一个Feed地址，比如你的这个站点的Feed地址就是：http://feed.feedsky.com/zmingcx
那个订阅HTML代码还真没有。你能把你的截图给我看看吗？谢谢！
中国 B3
@ lovemurder 晕….
登录feedsky.com—–我的Feeds—–进入管理——-Feed发布—–选择下面的图标后，HTML代码就在下面
这个feedsky已是个死站，加了代码会影响打开速度
福建省福州市 34F
路过学习鸟 对这些还是不太懂- –
河南省信阳市固始县 35F
嘿嘿，这个不错，感谢分享。
江苏省扬州市 36F
受益匪浅啊
四川省内江市 37F
学习了
上海市长宁区 38F
这东西看不懂啊大哥、、、
云南省大理州 39F
感谢鸟哥，已经顺利改好，偶尔也换换blog模式的首页。
河南省郑州市 40F
鸟哥 下边的分享小图标是怎么搞的？
英国 41F
感谢分享~~~~~
河南省郑州市 42F
鸟哥分享的太好了
韩国 43F
我在网上看到很多人在用这个主题，准备近期把博客主题换了
内蒙古呼和浩特市 44F
呜呜 没能成功····
湖南省长沙市 45F
鸟哥 为什么 我按照你的三步都操作了 也没有错 为什么 还是没有显示 求解
四川省成都市 46F
请问怎么像你一样域名不显示www呢?
河南省郑州市 B1
@ 小z 你域名不解析www.主机不配置www.不就行了
四川省成都市 B2
@ clairelume 但是那样就不行了！必须要www 好像说的是香港虚拟机必须用www 是这样么？
河南省郑州市 B3
@ 小z 貌似有这一说。我朋友的一个主机也是，不用设置，默认就给你开了个www的
四川省成都市 47F
你的主页用谷歌浏览器打开有错位！
上海市 48F
这个弄起来有点小麻烦
福建省厦门市 49F
我不会告诉博主，我看了这文章
湖北省武汉市 50F
成功移植。不过一直以后感觉幻灯和顶部热点文章有点类似，想去掉首页顶部的热点文章，但是不影响其他页面的热点文章显示，应该怎么操作呢，鸟哥
重庆市江北区 51F
感谢，先前那个问题可以不问了，呵呵！看到这个明白了。
福建省厦门市 52F
一个字：好！
广东省广州市 53F
测试您的
山东省临沂市 54F
鸟哥，我加完代码后幻灯片怎么就显示一页呢？
江西省新余市 55F
鸟哥，怎么修改才能让文章只显示标题呢？
广东省佛山市顺德区 56F
将CMS首页焦点幻灯移植到BLOG布局中 已经按你的方法做 之前是可以的 但现在又不行了 是什么问题呢
河南省许昌市 57F
鸟哥！ 请教 怎么样去掉顶部 幻影灯 我想在顶部logo下边添加广告或者自定义的文字什么的。。。。
怎么样去掉顶部 幻影灯 具体要写该那里的代码。
河南省郑州市 58F
我自己折腾想吧首页幻灯改成通栏大图片的样式，怎么实现呢？在css.css文件里找不到/** slideshow **/
江苏省南京市 B1
@ 郑州设计师 我也想这样耶，兄弟研究出来了嘛
河南省郑州市 B2
@ hg6688 还木有，研究不出来，得请鸟哥支招。。。
北京市 59F
鸟哥 幻灯片标题有字数限制 我的标题都显示不全 怎么修改？
中国 B1
@ 哈 改完会错位…
北京市 B2
@ 知更鸟 那就完全没办法了？
江苏省徐州市 60F
为什么我修改完之后会错位呢？
幻灯片部分的左上角有个小的12345，右上角又有个1、2
然后就是错位显示图片和文字。。。
浙江省丽水市 61F
请问这个幻灯片只能显示5篇吗，能自定义吗，多显示多篇吗，这个是选的是置顶文章，能显示自定义的吗
四川省成都市 62F
向鸟哥致敬。很强大的一个主题。继续使用，努力发现其中的bug，与鸟哥一起完善这个主题，研究这主题。
云南省昆明市 63F
要的就是这个啊，支持鸟哥！
甘肃省金昌市 64F
鸟哥请问这个幻灯片只能显示5篇吗，多显示多篇吗? 请教下在那里修改，谢谢！
呵呵，我找到了。呵呵，不好意思！
上海市 65F
如何将cms首页布局中的视频幻灯片删掉啊。
江苏省苏州市 66F
鸟哥怎么把这个幻灯片样式改成现在新版的 幻灯片。。 以前那个不显示文字。。
加拿大温哥华 67F
请问，哪位调过幻灯播放速度？谢谢！
加拿大温哥华 B1
@ 三雨二草 也许别人也有这个需要。在 jquery.cycle.all.min.js 中找到 4000 这个数字，改变它的值，就可改变每张幻灯停留的时间。
江西省萍乡市 68F
代码控，修改之前得做好代码的备份…
广东省深圳市 69F
鸟哥,新版中 如何将CMS首页焦点幻灯移植到BLOG布局中
折腾了N天,还是不行
北京市 70F
鸟哥，有3个问题…1.找不到 只有插入代码后显示在文章下面而不是上面2.幻灯片不切换3.右边无文字。
广东省广州市 71F
博主博主，图失效了~~
来自外部的引用