IT博客汇
  • 首页
  • 精华
  • 技术
  • 设计
  • 资讯
  • 扯淡
  • 权利声明
    • 登录 注册

    begin二次开发-增加RSS整合页面

    yumanutong发表于 2015-12-23 04:21:25
    love 0

    如果从鸟哥旧版主题过渡来的用户，会发现一些页面没有了，其中就包括RSS整合页面，这个页面虽说不是一开始就包含里面的，但是经常看鸟哥的文字也会发现其有提供。我的旧模板也用过这个页面。所以这次动手制作这个页面。

    首先，添加函数模板，增加小工具，我们打开后台-外观-编辑-functions.php

    我们可以看到一开始就有小工具的相关代码，类似：

    Code   ViewPrint
    1. register_sidebar( array(
    2.     'name'          => '页脚小工具',
    3.     'id'            => 'sidebar-f',
    4.     'description'   => '显示在页脚',
    5.     'before_widget' => '<aside id="%1$s" class="widget %2$s">',
    6.     'after_widget'  => '<div class="clear"></div></aside>',
    7.     'before_title'  => '<h3 class="widget-title"><div class="s-icon"></div>',
    8.     'after_title'   => '</h3>',
    9. ) );

    我们可以在这段代码后面添加如下代码：

    Code   ViewPrint
    1. //RSS 小工具
    2.     register_sidebar( array(
    3.         'name'          => 'RSS页面工具',
    4.         'id'            => 'sidebar-rss',
    5.         'description'   => '显示在RSS页面',
    6.         'before_widget' => '<aside id="%1$s" class="widget %2$s">',
    7.         'after_widget'  => '<div class="clear"></div></aside>',
    8.         'before_title'  => '<h3 class="widget-title"><div class="s-icon"></div>',
    9.         'after_title'   => '</h3>',
    10.     ) );

    这里我说一下，其实我就是复制上面的代码下来的，然后修改了name、id、description这三个值，然后这里就修改完毕了。

    然后，我们需要一个页面，于是，新建一个php文件，命名为：template-feeds.php

    加入如下内容：

    Code   ViewPrint
    1. <?php
    2. /*
    3. Template Name: RSS整合
    4. */
    5. ?>
    6. <?php get_header(); ?>
    8.         <main id="main" class="site-main" role="main">
    9.         <?php while ( have_posts() ) : the_post(); ?>
    10.             <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    11.                     <div id="message" class="message-page">
    12.                         <?php if (zm_get_option('footer_w')) { ?>
    13.                             <div id="rss-widget-box">
    14.                                 <div class="pagerss-widget">
    15.                                     <?php dynamic_sidebar( 'sidebar-rss' ); ?>
    16.                                     <div class="clear"></div>
    17.                                 </div>
    18.                             </div>
    19.                         <?php } ?>
    20.                     </div><!-- #message -->
    21.             </article><!-- #page -->
    22.         <?php endwhile; ?>
    23.         </main><!-- .site-main -->
    25. <?php get_footer(); ?>

    保存后，上传到FTP下面 /wp-content/themes/begin/pages 的目录下。

    这里的DIV设计是根据现在的主题来的。不过还需要添加几个样式到style.css 【后台-外观-编辑】

    Code   ViewPrint
    1. /** RSS 页面 **/
    2. #rss-widget-box {
    3.     background: #FFF;
    4.     position: relative;
    5.     padding: 10px 0;
    6.     box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.1);
    7. }
    8. .pagerss-widget {
    9.     width: 1000px;
    10.     margin: 0 auto;
    11. }
    12. .pagerss-widget h3 {
    13.     font-size: 15px;
    14.     color: #FFF;
    15.     margin: 15px 0 0 0;
    16. }
    17. /* RSS PAGE工具栏 */
    18. .pagerss-widget .widget {
    19.     background: #FFF;
    20.     float: left;
    21.     width: 50%;
    22.     padding: 0 20px;
    23.     border: none;
    24.     box-shadow: none;
    25. }
    26. .pagerss-widget, .footer-widget a {
    27.     color: #ccc;
    28. }
    29. .pagerss-widget a:hover {
    30.     color: #84D492;
    31. }
    32. .pagerss-widget .widget ul {
    33.     padding: 8px 0 15px;
    34. }
    35. .pagerss-widget .menu li {
    36.     float: left;
    37.     width: 33%;
    38. }

    添加在末尾，或者在主题设置里面的自定义CSS加，我喜欢直接添加在文件里面。

    到这里，代码已经搞定啦。

    然后：外观-小工具-拖动RSS到“RSS页面工具”下，并且填写地址。

    最后：新建页面-页面模板选择“RSS整合”，填写页面地址，即可发布。

    示例查看：http://www.sdtclass.com/rss-feeds

    rss-page-151222



沪ICP备19023445号-2号
友情链接