效果展示:

Riprov2小工具教程-添加合作伙伴插图

教程如下:

1.将以下css代码复制到ripro-v2主题文件css中

 .tkm-cooper {}
    .tkm-cooper h3 {
        font-size: 24px;
        margin-bottom: 40px;
        text-align: center;
    }
    .tkm-cooper h3 b {
        display: inline-block;
        position: relative;
    }
    .tkm-cooper h3 b:after {
        content: "";
        width: 60px;
        height: 2px;
        position: absolute;
        background: linear-gradient(270deg,#61b1ff,#04f);
        bottom: -10px;
        left: 50%;
        margin-left: -30px;
    }
    .tkm-cooper .item {
        text-align: center;
        margin-bottom: 35px;
        height: 100px;
        background: #fff;
    }
    .tkm-cooper .item .item-logo {}
    .tkm-cooper .item .item-logo img {
        max-height: 100%;
    }
    .tkm-cooper .item:hover {
        box-shadow: 0 5px 15px 0 rgba(62,130,255,.13);
    }
@media (max-width: 767px){
    .tkm-cooper h3  {
        font-size: 18px;
    }
    .tkm-cooper .item {
        height: 60px;
        margin-bottom: 10px;
    }
}


2.将以下代码添加到ripro-v2/inc/options/widget-options.php底部

<?php
/**
 * 合作伙伴
 */
CSF::createWidget('ripro_v2_module_partners', array(
    'title' => esc_html__('RI-首页模块 : 合作伙伴', 'ripro-v2'),
    'classname' => 'ripro_v2-widget-partners',
    'description' => esc_html__('VAN主题 a 合作伙伴', 'ripro-v2'),
    'fields' => array(
        array(
            'id' => 'home_mode_partners',
            'type' => 'fieldset',
            'title' => '',
            'fields' => array(
                array(
                    'id' => '_title',
                    'type' => 'text',
                    'title' => '标题',
                    'default' => '合作伙伴',
                ),
                array(
                    'id' => 'partnerscms',
                    'type' => 'group',
                    'title' => '新建案例展示(至多8个)',
                    'max' => 8,
                    'fields' => array(
                        array(
                            'id' => 'partners_title',
                            'type' => 'text',
                            'title' => '网站标题',
                            'default' => '源分享',
                        ),
                        array(
                            'id' => 'partners_href',
                            'type' => 'text',
                            'title' => '网站地址',
                            'default' => 'https://www.yfxw.cn/',
                            'desc' => '记得填写完整地址哟!!!示例:https://www.yfxw.cn/',
                        ),
                        array(
                            'id'    => 'partners_logo',
                            'type'  => 'upload',
                            'button_title' => '上传',
                            'remove_title' => '删除',
                            'default' => trailingslashit(get_stylesheet_directory_uri()).'assets/images/partners_logo.png',
                            'title' => '网站LOGO',
                        ),
                    ),
                ),
            ),
        ),

    ),
));


if (!function_exists('ripro_v2_module_partners')) {
    function ripro_v2_module_partners($args, $instance)
    {
        if (!is_page_template_modular()) {
            return false;
        } //非模块页面不显示
        
        echo $args['before_widget'];
        //案例CSS
        wp_enqueue_style('partners_style', trailingslashit(get_stylesheet_directory_uri()) . 'assets/css/partners.css?van_ver=' . VAN_VER);?>
    <section class="tkm-cooper">
        <h3>
            <b><?php echo $instance['home_mode_partners']['_title'] ?></b>
        </h3>
        <div class="row">
            <?php if (!empty($instance['home_mode_partners']['partnerscms'])) 
                foreach ($instance['home_mode_partners']['partnerscms'] as $k => $item) {
            ?>
               <div class="col-6 col-lg-3">
                <div class="item">
                    <div class="item-logo">
                        <a href="<?php echo $item['partners_href'] ?>" ><img src="<?php echo $item['partners_logo'] ?>" alt="<?php echo $item['partners_title'] ?>" /></a>
                    </div>
                </div>
            </div>
            <?php      
            }
            ?>
           
        </div>
    </section>
    <?php

        echo @$args['after_widget'];

    }
}

3.外观-小工具,拖动到显示的位置,添加相应数据即可

    本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。 最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。 若排除这种情况,可在对应资源底部留言,或联络我们。 源码素材属于虚拟商品,具有可复制性,可传播性,一旦授予,不接受任何形式的退款、换货要求。请您在购买获取之前确认好 是您所需要的资源 1.本站提供的一切源码、教程和内容信息仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途! 2.本站信息来自网络收集整理,版权争议与本站无关。您必须在下载后的24个小时之内,从您的电脑或手机中彻底删除上述内容! 3.本站提供的源码,模板,插件等其他资源都不包含技术服务,敬请谅解! 4.本站资源售价只是赞助,收取费用仅维持本站日常运营所需! 5.如无备注,本站不保证所提供下载的资源准确性安全性和完整性,源码仅供下载学习之用! 6.如用于商业或者非法用途,与本站无关。一切后果请自行负责! 该资源仅供学习和研究传播,大家请在下载后24小时内删除,一切关于该资源商业行为和违法行为与本站无关。 请勿将该软件程序进行商业交易、转载、违法运营 等行为,该软件只为研究、学习所提供,该软件程序使用后发生的一切问题与本站无关。