WordPress ripro资源类型图标VIP免费字样

WordPress ripro资源类型图标VIP免费字样

说明

此次修改的是资源类型图标,就是图上VIP还是免费的那个。第一版用的阿里图标但是不太醒目, 这是第二版用的一张小图,感觉还可以放出教程

首先上传图标到/ripro/assets/images图标地址。然后修改/ripro/assets/css/diy.css,如下:

/*VIP 样式开始*/
.vvip0,.vvip10,.vvip30,.vvip70,.vvip75,.vvip80,.vwip0,.vwip10,.vwip30,.vwip70,.vwip75,.vwip80,.vvip302,.vvip702,.vvip752,.vvip802,.vwip302,.vwip702,.vwip752,.vwip802 {
    display: inline-block;
    background-image: url(//cdn.ziyuanfeng.com/tuyiyi_vip4_1.png);
    background-size: auto 40px;
    vertical-align: middle;
    height: 40px;
    width: 40px
}

.vvip0,.vvip10,.vvip30, .vvip70, .vvip75, .vvip80, .vvip302, .vvip702, .vvip752, .vvip802 {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
}

.vvip0,.vwip0 {
    background-position: 0 0
}

.vvip70,.vwip70 {
    background-position: -80px 0
}

.vvip30,.vwip30 {
    background-position: -40px 0
}

.vvip302,.vvip702,.vvip752,.vvip802 {
    background-position: -200px 0
}

.vvip75 {
    background-position: -160px 0
}

.vvip80,.vwip75,.vwip80 {
    background-position: -120px 0
}

.vwip0,.vwip10,.vwip30,.vwip70,.vwip75,.vwip80,.vwip302 {
    position: absolute;

    z-index: 10;
    border-radius: 5px 0 0 0
}

.vvip10,.vwip10 {
    background-position: 0 0
}
.cvip0,.cvip10,.cvip30,.cvip85,.cvip70,.cvip75,.cvip80,.nvip,.nvip1,.nvip2,.nvip3,.nvip4,.nvipc {
    float: left;
    margin: 0 16px 0 33px;
    display: inline-block;
    background-image: url(//cdn.ziyuanfeng.com/tuyiyi_vip3_1.png);
    vertical-align: middle;
    height: 60px;
    width: 36px
}

.cvip0,.cvip10 {
    background-position: 0 -65px
}

.cvip30 {
    background-position: -36px -65px
}

.cvip70 {
    background-position: -72px -65px
}

.cvip75 {
    background-position: -36px -65px
}

.cvip80 {
    background-position: -144px -65px
}

.cvip85 {
    background-position: -180px -65px
}
/*VIP 样式结束*/

为什么这么多?因为图片里还有预制的几个备用图标,比如SVIP,QVIP之类的,可以自己选用!我这里只用了免费和VIP两个! 然后修改/ripro/parts/template-parts/content-grid.php 直接替换以下代码

[rihide]

<?php if (_cao('is_mobele_list') && wp_is_mobile()) {
    get_template_part( 'parts/template-parts/content','list');
}else{
  $sidebar = cao_sidebar();
  $column_class = $sidebar == 'none' ? 'col-lg-1-5 col-6 col-sm-6 col-md-4 col-lg-3' : 'col-sm-6 col-md-4';
  $post_author_id   = get_post()->post_author;
?>
<div class="<?php echo esc_attr( $column_class ); ?>">
  <article id="post-<?php the_ID(); ?>" <?php post_class( 'post post-grid' ); ?>>
  	<?php if ((_get_post_shop_status() || _get_post_shop_hide()) && _cao('grid_is_price',true)) : 
  	$post_price = _get_post_price();
  	$post_price =($post_price) ? '<i class="vwip30"></i>' : '<i class="vwip10"></i>' ;
  ?>
  	<?php echo ''.$post_price;?>
  <?php endif; ?>
    <?php cao_entry_media( array( 'layout' => 'rect_300' ) ); ?>
    <div class="entry-wrapper">
      <?php if (_cao('grid_is_author',true)) { ?>
        <a<?php echo _target_blank();?> class="grid_author_avt" href="<?php%20echo%20esc_url(%20get_the_permalink(%20$post_id%20)%20);%20?>"><div class="grid_author_bggo avatar bg-cover" style="background-image: url(<?php echo _get_user_avatar_url('user',get_the_author_meta( 'ID', $post_author_id ))?>);"></div> </a>
      <?php } ?>
      <?php cao_entry_header( array( 'category' => true ) ); ?>
      <?php if (_cao('grid_is_excerpt')) : ?>
       <div class="entry-excerpt u-text-format"><?php echo _get_excerpt(); ?></div>
      <?php endif; ?>
      <?php get_template_part( 'parts/entry-footer' ); ?>
    </div>
  </article>
</div>
<?php } ?>

修改/ripro/parts/template-parts/content-list.php

<?php
  $sidebar = cao_sidebar();
  $column_class = $sidebar == 'none' ? 'col-lg-6' : 'col-12';
?>

<div class="<?php echo esc_attr( $column_class ); ?>">
  <article id="post-<?php the_ID(); ?>" <?php post_class( 'post post-list' ); ?>>
  	<?php if ((_get_post_shop_status() || _get_post_shop_hide()) && _cao('grid_is_price',true)) : 
  	$post_price = _get_post_price();
  	$post_price =($post_price) ? '<i class="vwip30"></i>' : '<i class="vwip10"></i>' ;
  ?>
  	<?php echo ''.$post_price;?>
  <?php endif; ?>
    <?php cao_entry_media( array( 'layout' => 'rect_300' ) ); ?>
    <div class="entry-wrapper">
      <?php cao_entry_header( array( 'category' => true ,'author'=>true ) ); ?>
      <div class="entry-excerpt u-text-format"><?php echo _get_excerpt(); ?></div>
      <?php get_template_part( 'parts/entry-footer' ); ?>
    </div>
  </article

[/rihide]

 

分享到 :
相关推荐

发表评论

登录... 后才能评论