【RiPro美化】RiPro主题美化：给首页添加一个快讯公告栏模块 可随意调整位置

教程开始：

1、找到/ripro/fuctions.php 在最后面添加以下代码：

//新建快讯功能 
add_action('init', 'my_custom_init');
function my_custom_init()
{ $labels = array( 
'name' => '快讯',
'singular_name' => '快讯', 
'add_new' => '发表快讯', 
'add_new_item' => '发表快讯',
'edit_item' => '编辑快讯', 
'new_item' => '新快讯',
'view_item' => '查看快讯',
'search_items' => '搜索快讯', 
'not_found' => '暂无快讯',
'not_found_in_trash' => '没有已遗弃的快讯',
'parent_item_colon' => '', 'menu_name' => '快讯' );
$args = array( 'labels' => $labels,
'public' => true, 
'publicly_queryable' => true,
'show_ui' => true,
'show_in_menu' => true, 
'exclude_from_search' =>true,
'query_var' => true, 
'rewrite' => true, 'capability_type' => 'post',
'has_archive' => true, 'hierarchical' => false, 
'menu_position' => null, 'supports' => array('editor','author','title', 'custom-fields') );
register_post_type('kuaixun',$args); 
}
//快讯功能固定链接
add_filter('post_type_link', 'custom_book_link', 1, 3);
function custom_book_link( $link, $post = 0 ){
    if ( $post->post_type == 'kuaixun' ){
        return home_url( 'kuaixun/' . $post->ID .'.html' );
    } else {
        return $link;
    }
}

add_action( 'init', 'custom_book_rewrites_init' );
function custom_book_rewrites_init(){
    add_rewrite_rule('kuaixun/([0-9]+)?.html$','index.php?post_type=kuaixun&p=$matches[1]','top' );
    add_rewrite_rule('kuaixun/([0-9]+)?.html/comment-page-([0-9]{1,})$','index.php?post_type=kuaixun&p=$matches[1]&cpage=$matches[2]','top');
}

// 每周更新的文章数量
function get_week_post_count(){
    $date_query = array(
    	array(
    		'after'=>'1 week ago'
    	)
    );
    $args = array(
	    'post_type' => 'post',
	    'post_status'=>'publish',
	    'date_query' => $date_query,
	    'no_found_rows' => true,
	    'suppress_filters' => true,
	    'fields'=>'ids',
	    'posts_per_page'=>-1
    );
    $query = new WP_Query( $args );
    return $query->post_count;
}
// 每日更新的文章数量
function get_today_post_count(){
	$date_query = array(
		array(
			'after'=>'1 day ago'
		)
	);
	$args = array(
		'post_type' => 'post',
		'post_status'=>'publish',
		'date_query' => $date_query,
		'no_found_rows' => true,
		'suppress_filters' => true,
		'fields'=>'ids',
		'posts_per_page'=>-1
	);
	$query = new WP_Query( $args );
	return $query->post_count;
}

function copyright_year(){
    $now_year = date('Y');
    $open_date = _cao('site_open_date', $now_year);
    $open_year = substr($open_date, 0, 4);
    return $open_year . '-' . $now_year . '  ';
}

2、放入JS文件，找到/ripro/assets/js文件夹将附件内的sinabeta.js放进去。

JS文件下方下载

3、引入js，找到/ripro/footer.php 搜索 在上面一行添加以下代码：

<script src="<?php echo get_template_directory_uri() ?>/assets/js/sinabeta.js"></script>

4、添加CSS，/ripro/assets/css/diy.css 添加以下代码：

/**快讯模块**/
.deanggwrap{width:100%;flex-wrap: wrap;display:flex;justify-content:center;align-items:center;}
.deangg {width:750px;line-height:30px;background:#eee;padding:10px 0;border-radius:30px;}
.ripro-dark .deangg{background: #1e1e1f;}
.ripro-dark .deanggc ul li a,.ripro-dark .deanggc ul li .notice,.ripro-dark .deanggc ul li .notice_time,.ripro-dark .deanchartdiv span,.ripro-dark .deanchartdiv em{color: #fff;}
.deanggc i {padding-top: 8px;display:block;float:left;font-size:14px;color:#f60;margin-left:15px;margin-right:6px;}
.announce-wrap {height:30px;overflow:hidden;}
.announce-wrap ul{padding-left: 0px;}
.deanggc ul li {font-size:14px;width:90%;display:block;clear:both;height:30px;}
.deanggc ul li a {color:#f60;}
.deanggc ul li a:hover {color:#f60;text-decoration: blink;}
.deanggc ul li .notice {margin-left: 1%;float: none;color: #f60;}
.deanggc ul li .notice_time {float:right;color:#999;font-size:12px;}
.deanchart {float:right;height:50px;width:330px;color:#999;margin-left: 20px;}
.deanchart ul{width:460px;list-style:none;margin:0;padding:0;word-wrap:break-word;}
.deanchart ul li {float:left;height:100%;margin-right:20px;font-size:14px;}
.deanchart ul li i {display:block;float:left;width:35px;height:35px;margin-top:8px;background:url(../images/ico.png) 0 0 no-repeat;background-position: 0 0;}
.deanchart ul li.deanchart2 i {background-position: -35px 0;}
.deanchart ul li.deanchart3 i {background-position: -70px 0;}
.deanchart ul li.deanchart4 i {background-position: -105px 0;}
.deanchartdiv {float:left;margin-left:8px;margin-top:6px;text-align:center;}
.deanchartdiv em {font-size:12px;color:#999;    font-style: inherit;}
.deanchartdiv span {font-size:12px;color:#999;}
.deanchartdiv a {font-size:12px;color:#999;}
.aligncenter{display:block;margin-left:auto;margin-right:auto;}
.aligncenter p.wp-caption-text{display:block;margin-left:auto;margin-right:auto;text-align:center;}

.pricing-title .iconfont {
    font-size: 22px;
    color: #089;
}
.center {
	text-align: center;
    box-sizing: border-box;
    max-width: 1440px;
    margin: 0 auto;
}

/**快讯模块**/
这只是一部分CSS缺少部分下方下载

5、ripropartshome-mode 新建空白文件并命名为：kuaixun-mokuai.php，添加以下代码：

<div class="section deanbox">
<div class="container">
<div class="deanggwrap">
		<div class="deangg comfff wow fadeInUp">
			<div class="deanggc"><i class="fa fa-volume-up"> 网站公告：</i>
				<div class="announce-wrap">
				
					<ul class="announce-list line" style="margin-top:0">
								
					<?php 

$args = array(
    
    'post_type'           => 'kuaixun',
     'post_status'         => 'publish',
     'showposts'           => '5',
);
$the_query = new WP_Query( $args );


?>

 
<?php if ( $the_query->have_posts() ) : ?>

    <?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
            
 <li class="notice_active_ch"><a href="<?php echo esc_url( get_permalink() ); ?>" target="_blank"><span class="notice"><?php the_title(); ?></span></a><span class="notice_time"><?php the_time('Y.n.j'); ?></span></li>
                                                  
                        
    <?php endwhile; ?>

 
    <?php wp_reset_postdata(); ?>
 
<?php else : ?>
    <p><?php _e( 'Sorry, no posts matched your criteria.' ); ?></p>
<?php endif; ?>
										</ul>
										
				</div>
			</div>
			<div class="clear"></div>
		</div>
		<div class="deanchart">
			<ul>
				<div id="portal_block_396_content" class="dxb_bc">
				<li><i></i>
				<div class="deanchartdiv"><span>今日发布</span>
				<div class="clear"></div>
				<em id="num4"><?php echo get_today_post_count(); ?></em></div>
				<div class="clear"></div>
				</li>
				<li class="deanchart2"><i></i>
				<div class="deanchartdiv"><span>本周发布</span>
				<div class="clear"></div>
				<em id="num6"><?php echo get_week_post_count(); ?></em></div>
				<div class="clear"></div>
				</li>
				<li class="deanchart3"><i></i>
				<div class="deanchartdiv"><span>资源总数</span>
				<div class="clear"></div>
				<em id="num3"><?php echo  wp_count_posts()->publish;?></em></div>
				<div class="clear"></div>
				</li>
				</div>
				<!--[/diy]-->
				<div class="clear"></div>
				</ul>
			</div>
			<div class="clear"></div>
		</div>
		</div>
		</div>

6、找到 riproinccodestar-frameworkoptionsoptions.theme.php 搜索’slider’ => ‘幻灯片’, 在下一行添加以下代码：

'kuaixun-mokuai' =>'快讯模块'

7、在主题根目录下新建一个/single-kuaixun.php 文件，放入以下代码：

代码部分下方下载

8、到网站后台-主题设置-首页设置-首面布局，右上角有一个“重置当面分区” 千万不要手贱去点击重置全部，然后拖动快讯模块到你想要的位置保存就OK了。

感谢您的来访，获取更多精彩文章请收藏本站。