RiPro 主题美化教程（第二章）
本章美化教程：添加VIP引导界面，美化滚动条，添加头像滚动，添加LOGO流光效果
效果展示：
VIP引导界面教程：
1. ripro -> parts -> navbar.php，在“<div class=”actions”>”和“<?php if (is_site_shop_open()) : ?>”之间添加如下代码
<div title="加入VIP，免费下载全站素材" class="menu-head_you-container">
<ul id="menu-head_you" class="menu">
<li id="menu-item-967" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-967">
<a href="vip"><i class="fa fa-diamond"></i> 开通会员</a>
</li>
</ul>
</div>
注：若是跟着第一章教程走的请勿添加
2. ripro -> pages 目录新建 vip.php 文件，并添加如下代码
<?php
/**
* Template name: 会员介绍
* Description: A VIP introduction page
*/
$vip_site = _cao( 'homevip_field');
$vip_mone = _cao( 'homevip_montext');
$homevip_group = _cao('homevip_group');
get_header();
?>
<div class="vip-banner">
<img src="<?php echo esc_url( $vip_site['homevip_topimg'] ); ?>">
<div class="vipbj">
<h2><?php echo $vip_site['homevip_top_title']; ?></h2>
<p><?php echo $vip_site['homevip_top_description']; ?></p>
<?php if ($vip_site['homevip_top_title']) : ?>
<a href="<?php echo home_url()?>/user?action=vip" title="" target="_blank"><?php echo $vip_site['homevip_top_text']; ?></a>
<?php endif; ?>
</div>
</div>
<div class="module-line">
<span class="arrow left-arrow"></span>
<span class="text"><?php echo _cao('homevip_numtext');?></span>
<span class="arrow right-arrow"></span>
</div>
<div class="row vip-slogan">
<?php if (!empty($homevip_group)) {
foreach ($homevip_group as $key => $link) {
echo '<div class="col-xs-12 col-sm-6 col-md-4 vip-slogan-box"><i class="'.$link['_ico'].'"></i><div class="vip-slogan-text"><p>'.$link['_text1'].'</p><p>'.$link['_text2'].'</p></div></div>';
}
}?>
</div>
<div class="container">
<article class="single-content" id="post-<?php the_ID(); ?>" <?php post_class( 'post vip' ); ?>>
<div class="module-line">
<span class="arrow left-arrow"></span>
<span class="text"><?php echo $vip_mone['_title1']; ?></span>
<span class="arrow right-arrow"></span>
<div class="vip-desc"><?php echo $vip_mone['_title2']; ?></div>
</div>
<div class="container">
<div class="vip-row vip-block-wrapper" style="padding-bottom: 0; padding-top: 30px; margin-bottom: 0; ">
<?php
$vip_pay_setting = _cao('vip-pay-setting');
foreach ($vip_pay_setting as $key => $item) {
echo '<div class="vip-block-item"><div class="home-vipbox"><div class="icon">';
echo '<img src="'.$item['vipico'].'"> </div>';
if ($item['daynum'] == 7) {
echo '<h3 class="content0-title">包周会员</h3>';
echo '<p class="vip-home-price">'.$item['price'].'<i>'._cao('site_money_ua').'</i></p>';
echo '<p>周费VIP '.$item['daynum'].'天 福利</p>';
}elseif ($item['daynum'] == 30 || $item['daynum'] == 31){
echo '<h3 class="content0-title">包月会员</h3>';
echo '<p class="vip-home-price">'.$item['price'].'<i>'._cao('site_money_ua').'</i></p>';
echo '<p>月费VIP '.$item['daynum'].'天 福利</p>';
}elseif ($item['daynum'] == 365){
echo '<h3 class="content0-title">包年会员</h3>';
echo '<p class="vip-home-price">'.$item['price'].'<i>'._cao('site_money_ua').'</i></p>';
echo '<p>年费VIP '.$item['daynum'].'天 福利</p>';
}elseif ($item['daynum'] == 9999){
echo '<h3 class="content0-title">终身会员</h3>';
echo '<p class="vip-home-price">'.$item['price'].'<i>'._cao('site_money_ua').'</i></p>';
echo '<p>终身VIP 终身 福利</p>';
}else{
echo '<h3 class="content0-title">请后台设置</h3>';
}
echo '<p>'.$item['description1'].'</p>';
if ($item['daynum'] == 7 || $item['daynum'] == 30 || $item['daynum'] == 31 || $item['daynum'] == 365 ){
echo '<p>每天可下载'._cao('vip_down_num').'个VIP资源</p>';
}elseif ($item['daynum'] == 9999){
echo '<p>每天可下载'._cao('boosvip_down_num').'个VIP资源</p>';
}
echo '<p>'.$item['description2'].'</p>';
echo '<a href="'.home_url().'/user?action=vip"><p class="vip-bt">开通</p></a>';
echo '</div></div>';
} ?>
</div>
</div>
</article>
</div>
<div style="clear:both"></div>
<style type="text/css">
.site-content{ padding:0px;}
.term-bar{ display:none;}
</style>
<?php get_footer(); ?>
3. ripro -> inc -> codestar-framework -> options -> options.theme.php，搜索“vip-pay-setting”，并将整个“array”数组替换为如下代码
array(
'id' => 'vip-pay-setting',
'type' => 'repeater',
'title' => '开通套餐设置（' . _cao('site_vip_name') . '）',
'max' => '3',
'fields' => array(
array(
'id' => 'vipico',
'type' => 'upload',
'title' => 'VIP图标',
'desc' => '上传一张png图片作为VIP展示图',
'default' => get_stylesheet_directory_uri() . '/assets/images/vip.png',
),
array(
'id' => 'daynum',
'type' => 'text',
'default' => '30',
'desc' => '比如你想设置一个套餐是月费，则填写30，如果要设置终身会员套餐，填写：9999',
'title' => '开通天数',
),
array(
'id' => 'price',
'type' => 'text',
'default' => '20',
'desc' => '此套餐所需的' . _cao('site_money_ua') . '数量，例： 会员一天需要1，设置一个月费则是30，如果填写为15，则相当于在打折',
'title' => '套餐价格',
),
array(
'id' => 'color',
'type' => 'color',
'default' => '#ff6a6d',
'title' => '背景颜色',
),
array(
'id' => 'description1',
'type' => 'text',
'title' => 'VIP特权说明-1',
'default' => '享受下载折扣及免费下载相应资源',
),
array(
'id' => 'description2',
'type' => 'text',
'title' => 'VIP特权说明-2',
'default' => '急速网盘无广告',
),
),
'default' => array(
array(
'vipico'=> get_stylesheet_directory_uri() . '/assets/images/vip.png',
'daynum' => '30',
'price' => '10',
'color' => '#ff6a6d',
'description1'=> '享受下载折扣及免费下载相应资源',
'description2'=> '急速网盘无广告',
),
),
),
4. ripro -> inc -> codestar-framework -> options -> options.theme.php，搜索“// 商城-佣金设置”，在该备注上方“));”后添加如下代码
//
// Field: VIP页设置
//
CSF::createSection($prefix, array(
'parent' => 'shop_fields',
'title' => 'VIP页设置',
'icon' => 'fa fa-circle',
'fields' => array(
array(
'id' => 'homevip_field',
'type' => 'fieldset',
'title' => '头部大图相关设置',
'fields' => array(
array(
'id' => 'homevip_topimg',
'type' => 'upload',
'title' => 'VIP引导页头部大图',
'dsec' => '上传一张显示在VIP引导页的大图',
'default' => get_stylesheet_directory_uri() . '/assets/images/comvip-banner.png',
),
array(
'id' => 'homevip_top_title',
'type' => 'text',
'title' => '头部大图文字',
'default' => '开通VIP独享海量下载特权',
),
array(
'id' => 'homevip_top_description',
'type' => 'text',
'title' => '头部大图描述',
'default' => '现在努力只为 不再仰望大神的后背！',
),
array(
'id' => 'homevip_top_switcher',
'type' => 'switcher',
'title' => '头部大图按钮开关',
'default' => true,
),
array(
'id' => 'homevip_top_text',
'type' => 'text',
'title' => '按钮文字',
'default' => '开通会员',
'dependency' => array('homevip_top_switcher', '==', 'true'),
),
),
),
array(
'type' => 'notice',
'style' => 'success',
'content' => '注意，这里添加特权说明时，请添加3或3的倍数个，不然不美观！！！特权图标示例 <span style="color:red;">fa fa-vimeo-square</span> <a href="http://www.fontawesome.com.cn/faicons/" target="_blank" rel="noopener noreferrer">图标获取地址：http://www.fontawesome.com.cn/faicons/</a>',
),
array(
'id' => 'homevip_numtext',
'type' => 'text',
'title' => 'VIP特权模块标题',
'default' => '会员尊享6项特权',
),
array(
'id' => 'homevip_group',
'type' => 'group',
'title' => 'VIP特权说明',
'label' => '请添加3或3的倍数个，不然不美观！！！',
'max' => '6',
'fields' => array(
array(
'id' => '_ico',
'type' => 'text',
'title' => '特权图标',
'default'=>'fa fa-vimeo-square',
),
array(
'id' => '_text1',
'type' => 'text',
'title' => '特权说明-1（大标题）',
'default'=>'1000+资源，无限量下载',
),
array(
'id' => '_text2',
'type' => 'text',
'title' => '特权说明-2',
'default'=>'真正的海量，无套路，诚意满满',
),
),
'default' => array(
array(
'_ico' => 'fa fa-vimeo-square',
'_text1'=> '1000+资源，无限量下载',
'_text2'=> '真正的海量，无套路，诚意满满',
),
),
),
array(
'id' => 'homevip_montext',
'type' => 'fieldset',
'title' => 'VIP资费设置',
'fields' => array(
array(
'id' => '_title1',
'type' => 'text',
'title' => '标题-1',
'default'=>'VIP会员资费介绍',
),
array(
'id' => '_title2',
'type' => 'text',
'title' => '标题-2',
'attributes' => array(
'style' => 'width: 100%;',
),
'default'=>'在这里，会员每平均10个用户开通会员， 下载资源 100+份~',
),
),
),
),
));
5. ripro -> functions.php ，搜索“pages/tags.php”并跳转到该处，换一行添加如下代码
提示：
1. 本站所有资源来源于用户上传和网络，如有侵权请邮件联系站长！邮箱：（332547532@qq.com）
2. 分享目的仅供大家学习和交流，请不要用于商业用途！
3. 如果你也有好源码或者教程，可以到审核区发布，分享有金币奖励和额外收入！
4. 本站提供的源码、模板、插件等等其他资源，都不包含技术服务 请大家谅解！
5. 如有链接无法下载、失效或广告，请点击右下方联系站长，可领回失去的金币，并额外有奖！
6. 如遇到加密压缩包，默认解压密码请在"下载框架提示方寻找",如遇到无法解压的请联系管理员！
黑域吧资源网 » RiPro 主题美化教程（第二章）
1. 本站所有资源来源于用户上传和网络，如有侵权请邮件联系站长！邮箱：（332547532@qq.com）
2. 分享目的仅供大家学习和交流，请不要用于商业用途！
3. 如果你也有好源码或者教程，可以到审核区发布，分享有金币奖励和额外收入！
4. 本站提供的源码、模板、插件等等其他资源，都不包含技术服务 请大家谅解！
5. 如有链接无法下载、失效或广告，请点击右下方联系站长，可领回失去的金币，并额外有奖！
6. 如遇到加密压缩包，默认解压密码请在"下载框架提示方寻找",如遇到无法解压的请联系管理员！
黑域吧资源网 » RiPro 主题美化教程（第二章）
