为HotNews pro主题添加一个RSS新闻聚合独立页面模版

来源:http://zmingcx.com/hotnews-template-theme-rss-feed.html

一、打开主题functions.php模板，在”// 自定义菜单“注释上面添加下面代码，定义一个特殊的widget ：

{   
    register_sidebar(array(   
        'name'          => 'RSS聚合',   
        'before_widget' => '',   
        'after_widget'  => '',   
        'before_title'  => '<div class="r_box"><div class="rss"></div><h3>',   
        'after_title'   => '</h3>',   
        'after_widget' => '<i class="lt"></i><i class="rt"></i><i class="lb"></i><i class="rb"></i></div>',   
    ));   
}

{

register_sidebar(array(

'name' => 'RSS聚合',

'before_widget' => '',

'after_widget' => '',

'before_title' => '<div class="r_box"><div class="rss"></div><h3>',

'after_title' => '</h3>',

'after_widget' => '<i class="lt"></i><i class="rt"></i><i class="lb"></i><i class="rb"></i></div>',

));

}

二、打开HotNewspro\css目录中的css.css在最后添加：

/******** rss聚合 ********/  
.rss_widget {   
    width:992px;   
    margin:12px 0 0 0;   
    }   
.r_box {   
    position:relative;   
    float:left;   
    width:462px;   
    background:#fff;   
    margin:0 12px 12px 0;   
    padding:10px 10px 11px 10px;   
    border: 1px solid #ccc;   
    }   
.r_box ul li{   
    font-size:13px;   
    line-height:24px;   
    margin: 0 0 0 20px;   
    color:#477fbd;   
    list-style-type:square;   
    }   
.r_box ul li a:hover {   
    padding:0 0 0 10px;   
    }   
.r_box h3 {    
    background:url(img/home.gif) no-repeat;   
    }   
.r_box h3 a{   
    font-size:14px;   
    padding:0 0 0 12px;   
    }   
.rsswidget img{   
    display:none;   
    }   
.rss-date {   
    position:absolute;   
    font-size:12px;   
    color:#B2B2B2;   
    right:12px;   
    text-shadow: 0 0 #d1d1d1;   
    }   
.rss{   
    position:absolute;   
    background:url(img/rss.gif) no-repeat;   
    width:51px;   
    height:51px;   
    right:-3px;   
    top:-3px;   
    z-index:10;   
    }   
#map_m {   
    width:980px;   
    height: 27px;   
    }

/******** rss聚合 ********/

.rss_widget {

width:992px;

margin:12px 0 0 0;

}

.r_box {

position:relative;

float:left;

width:462px;

background:#fff;

margin:0 12px 12px 0;

padding:10px 10px 11px 10px;

border: 1px solid #ccc;

}

.r_box ul li{

font-size:13px;

line-height:24px;

margin: 0 0 0 20px;

color:#477fbd;

list-style-type:square;

}

.r_box ul li a:hover {

padding:0 0 0 10px;

}

.r_box h3 {

background:url(img/home.gif) no-repeat;

}

.r_box h3 a{

font-size:14px;

padding:0 0 0 12px;

}

.rsswidget img{

display:none;

}

.rss-date {

position:absolute;

font-size:12px;

color:#B2B2B2;

right:12px;

text-shadow: 0 0 #d1d1d1;

}

.rss{

position:absolute;

background:url(img/rss.gif) no-repeat;

width:51px;

height:51px;

right:-3px;

top:-3px;

z-index:10;

}

#map_m {

width:980px;

height: 27px;

}

三、把压缩包中的rss.php放到HotNews主题根目录中，两张图片放到HotNewspro\css\img目录中，完成RSS聚合模板添加。

四、新建一个页面，右下选择RSS聚合模版，发表后调用到导航菜单中。

五、上面步骤完成后，进入WP后台---主题---小工具添加页面---把WP自带的RSS小工具，拖拽到侧边RSS聚合小工具中，输入 RSS feed地址，比如我的博客地址为：http://zmingcx.com/feed，并在"为 feed 拟个标题"中输入网站名称，保存之后打开刚建的页面，看看效果吧。

可以拖拽多个RSS小工具，需要注意的是要保证左右两个RSS小工具，显示的条数相同，否则会错位。

当然这个独立页面模板中也可以添加其它WP自带的小工具，主题集成的小工具则不行，会显示样式错误。

补充：修改WP程序源文件，让RSS小工具中的链接在新窗口或标签打开。

打开wp-includes目录中的default-widgets.php在858行找到(注意一共有两处第一个地方不要改)：

a class='rsswidget' href='$link'

1	a class='rsswidget' href='$link'

修改为：

a class='rsswidget' href='$link' target='_blank' rel='nofollow'

1	a class='rsswidget' href='$link' target='_blank' rel='nofollow'

本站演示

文件下载

为HotNews pro主题添加一个RSS新闻聚合独立页面模版

发表评论取消回复

目前评论：1 其中：访客 1 博主 0

微信