RiPro主题美化底部搜索替换二维码和客服代码

RiPro主题美化底部搜索替换二维码和客服且增加到后台控制教程，直接复制代码添加到相应文件替换即可。

教程概述：

1.打开“ripro-child/parts/diy-footer.php”文件，搜索如下代码：

 <!-- .col-md-2 end -->

2.在最后一个 <!– .col-md-2 end –>后面删除后面的一个div包裹，且替换为如下代码：

<?php if (_cao('sucaihu_ui_footer_ewmimg')) : ?>
<ul class="footer-diy">
<div style="padding: 0px; margin-bottom: 12px;">公众号</div>
<div class="mt15"> <a><img class="kuangimg" src="<?php echo $title = ($sucaihu_ui_footer_ewm['_url']); ?>" alt="公众号"></a></div>

</ul>
<?php endif; ?>
<?php if (_cao('sucaihu_ui_footer_qun')) : ?>
<ul class="footer-diy">
<div style="padding: 0px; margin-bottom: 12px;">小程序</div>
<div class="mt15"> <a><img class="kuangimg" src="<?php echo $title = ($sucaihu_ui_footer_qqun['_url']); ?>" alt="小程序"></a></div>

</ul>
<?php endif; ?>
<?php if (_cao('sucaihu_ui_footer_time')) : ?>
<div id="col-contact">
<p class="phone"><?php echo esc_attr( get_bloginfo( 'name' ) ); ?></p>

<span class="J_serviceTime-normal">
<p><?php echo $title = ($sucaihu_ui_footer_gzsj['_text']); ?></p>
<p>（其他时间勿扰）</p>
</span>
<a rel="nofollow" class="btn-line-primary" href="http://wpa.qq.com/msgrd?v=3&uin=<?php echo _cao('site_kefu_qq');?>&site=qq&menu=yes"> 在线咨询</a>
</div>
<?php endif; ?>

3.然后再这个文件头部第一行添加如下代码：

<?php
$sucaihu_ui_footer_ewm = _cao('sucaihu_ui_footer_ewm');
$sucaihu_ui_footer_gzsj = _cao('sucaihu_ui_footer_gzsj');
$sucaihu_ui_footer_qqun = _cao('sucaihu_ui_footer_qqun');
?>
<style>
.col-sm-3{flex:0 0 25%;max-width:16%}
#col-contact{width:240px;text-align:center;float:left}
#col-contact .phone{margin:0 0 5px;font-size:22px;line-height:1;color:#ed1c24;text-align:center}
#col-contact p{margin:10px 0 10px;font-size:12px;text-align:center;color:#7F7F7F}
#col-contact a.btn-line-primary{display:inline-block;width:158px;height:38px;padding:0;margin:0;font-size:14px;line-height:38px;text-align:center;cursor:pointer;-webkit-transition:all .4s;transition:all .4s;border-radius:5px;border-color:#ed1c24;color:#fff;background:#ed1c24 url(https://bbs.ludeqi.com/wp-content/themes/jizhi-chlid/images/liuyan.png) no-repeat 20px center;border-radius:4px}
#col-contact a.btn-line-primary:hover{display:inline-block;width:158px;height:38px;padding:0;margin:0;color:#ed1c24;background-color:#fff!important;border:1px solid #ed1c24!important;background:url(https://bbs.ludeqi.com/wp-content/themes/jizhi-chlid/images/liuyann.png) no-repeat 20px center}
.footer-diy{float:left;margin:0;font-size:16px;color:#7F7F7F;text-align:center}
.footer-diy img{width:100px;height:100px}
</style>

4.打开“ripro/inc/codestar-framework/options/admin-options.php或者options.theme.php”文件(这是父级主题，也可添加到8.8版本后的diy-options.php文件中，子主题命名和文件路径可能有所不同不过一般都是在inc文件夹下，很多二开命名的是options.theme.php，但是一般都是加密的，所以放到父级主题也是一样的) 5.打开后找到底部样式设置，其他地方都可以，这里是方便管理，在合适的位置（上一个array字段结束后）添加如下代码：

/*底部二维码*/
array(
'id' => 'sucaihu_ui_footer_ewmimg',
'type' => 'switcher',
'title' => '是否开启移动端二维码',
'default' => true
) ,
array(
'id' => 'sucaihu_ui_footer_ewm',
'type' => 'fieldset',
'title' => '上传二维码',
'fields' => array(
array(
'id' => '_url',
'type' => 'upload',
'title' => '二维码地址',
'default' =>get_stylesheet_directory_uri() . '/assets/images/ydewm.jpg',
)
) ,
'dependency' => array(
'sucaihu_ui_footer_ewmimg',
'==',
'true'
)
) ,
array(
'id' => 'sucaihu_ui_footer_qun',
'type' => 'switcher',
'title' => '是否开启QQ群二维码',
'default' => true
) ,
array(
'id' => 'sucaihu_ui_footer_qqun',
'type' => 'fieldset',
'title' => '上传二维码',
'fields' => array(
array(
'id' => '_url',
'type' => 'upload',
'title' => '二维码地址',
'default' =>get_stylesheet_directory_uri() . '/assets/images/qqewm.jpg',
)
) ,
'dependency' => array(
'sucaihu_ui_footer_ewmimg',
'==',
'true'
)
) ,
array(
'id' => 'sucaihu_ui_footer_time',
'type' => 'switcher',
'title' => '是否开启底部工作时间',
'default' => true
) ,
array(
'id' => 'sucaihu_ui_footer_gzsj',
'type' => 'fieldset',
'title' => '工作时间',
'fields' => array(
array(
'id' => '_text',
'type' => 'text',
'title' => '工作时间',
'default' => '周一至周五 9:00-23:00'
)
) ,
'dependency' => array(
'sucaihu_ui_footer_time',
'==',
'true'
)
),

本来是有2张素材的图片的，小编感觉没必要就不传了直接忽略。自己对照参考修改一下即可。

效果演示：