Ripro美化-将纯标题改为三栏

2021-08-21 0 585 百度已收录

有买家昨天下午来找我,说是和某某网一样的标题。优站网鼓捣了半天终于完成,让我们在这里公开代码。
设计草图:

Ripro美化-将纯标题改为三栏

教程开始

首先来到目录: ripro/parts/home-mode

将以下代码全部替换:

<div class=”section” style=” padding-bottom: 20px; “>
<div class=”container”>
<div class=”row”>

<?php

$mode_ulistpost = _cao(‘mode_ulistpost’);

foreach ($mode_ulistpost[‘catulist’] as $key => $cms) {

$args = array(
‘cat’ => $cms[‘category’],
‘ignore_sticky_posts’ => true,
‘post_status’ => ‘publish’,
‘posts_per_page’ => $cms[‘count’],
‘orderby’ => $cms[‘orderby’],
);

///////////S CACHE ////////////////
if (CaoCache::is()) {
$_the_cache_key = ‘ripro_home_ulist_posts_’.$args[‘cat’];
$_the_cache_data = CaoCache::get($_the_cache_key);
if(false === $_the_cache_data ){
$_the_cache_data = new WP_Query($args); //缓存数据
CaoCache::set($_the_cache_key,$_the_cache_data);
}
$data = $_the_cache_data;
}else{
$data = new WP_Query($args); //原始输出
}
///////////S CACHE ////////////////

$category = get_category( $cms[‘category’] );
$this_i = 0; ?>
<div class=”col-12 col-sm-4″>
<div class=”uposts”>
<div class=”codesign-list lazyload visible” data-bg=”<?php echo esc_url( $cms[‘bgimg’] ); ?>”>
<h4 class=”codeisgn-h4″><i class=”fa fa-circle-o”></i> <a<?php echo _target_blank();?> href=”<?php echo esc_url( get_category_link( $category->cat_ID ) ); ?>”><?php echo $category->cat_name; ?> &gt;</a></h4>
<span class=”codesign-esc”><p><?php echo $cms[‘desc’];?></p></span>
<div class=”codesign-cover”></div>
</div>
<?php while ( $data->have_posts() ) : $data->the_post();
$this_i++;
echo ‘<div class=”hentry”><h2 class=”title”><span class=”post-num num-‘.$this_i.'”>’.$this_i.'</span><a’._target_blank().’ href=”‘.get_permalink().'” title=”‘.get_the_title().'”>’.get_the_title().'</a></h2>’;
echo ‘<div class=”meta”><span>热度(‘._get_post_views().’)</span></div></div>’;
endwhile; ?>
</div>
</div>
<?php
wp_reset_postdata();
}
?>

</div>
</div>
</div>

如果您认为背景颜色非常暗,请将以下CSS代码添加到背景-外观-自定义CSS中

/*

.uposts .codesign-cover {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background: #00000000;
border-radius: 4px 4px 0 0;
z-index: 0;
}
.post-list .cao-cover img{
display: none;
}
/*

这不是很美吗?你想给那些想在主页上添加一个纯标题但认为这两个栏目很难看的站长提供很多帮助吗?

收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

免责声明   ⚠️ 1. 本站所有资源来源于网络收集,若资源侵犯了您的合法权益, 请来信通知我们(Email: 1427707223@qq.com),我们会及时删除,给您带来的不便,我们深表歉意! 2. 分享目的仅供大家学习和交流,若使用商业用途,请购买正版授权! 否则产生的一切后果将由下载用户自行承担! 3. 会员不得使用于非法商业用途,不得违反国家法律。否则后果自负! 4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解! 5. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需! 6. 因源码具有可复制性,一经购买 ,不得以任何形式退款。 7.更多详情请点击查看

优站网 WordPress Ripro美化-将纯标题改为三栏 https://www.zhanceo.com/15133.html

诚乃立身之本、信为道德之基

常见问题
  • 如果付款后没有弹出下载页面,多刷新几下,有问题联系客服!
查看详情
  • 本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。
查看详情

相关文章

联系官方客服

为您解决烦忧 - 24小时在线 专业服务

Ripro美化-将纯标题改为三栏-海报