ripro美化 给ripro主题添加一个首页快讯公告栏模块 可随意调整位置 ripro美化教程

前段时间本站发布了一个给ripro主题添加一个顶部滚动公告栏的教程，最近又有很多朋友前来咨询怎么把这个快讯公告栏移到中间位置，今天教程来了，直接给这个快讯栏做成了首页模块，自己想放什么位置随意调整。
好了，废话不多说，先看效果图：

教程开始：
1、找到/ripro/fuctions.php 在最后面添加以下代码：
[erphpdown]

//新建快讯功能 
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放进去。
[dl href=’https://www.lanzoux.com/i906v3e’]sinabeta.js文件，点击下载[/dl]

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

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;
}
.section .cat-posts-wrapper{
	margin-top:20px;
}
.products-category .pricing-title {
    color: #000;
    font-size: 24px;
    font-weight: 500;
    letter-spacing: .51px;
    position: relative;
    line-height: 1;
}
.products-category .category-num {
    margin-left: 5px;
    padding: 1px 10px;
    background: #ff5780;
    border-radius: 8px;
    font-size: 14px;
    font-style: normal;
    color: #fff;
}
/**快讯模块**/

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

		

			
 网站公告：
				

				
					

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


?>

 
have_posts() ) : ?>

    have_posts() ) : $the_query->the_post(); ?>
            
 

                                                  
                        
    

 
    
 

    


										
										
				
			
			

		
		

			

				

				

				
今日发布
				

				
				

				
				

				
本周发布
				

				
				

				
				

				
资源总数
				

				publish;?>
				

				
				
				
				

				
			
			

		
		
		

6、找到 \ripro\inc\codestar-framework\options\options.theme.php 搜索’slider’ => ‘幻灯片’, 在下一行添加以下代码：

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

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

[/erphpdown]

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