zibll子比添加一个会员说明页面

效果预览

zibll子比添加一个会员说明页面

美化步骤

1、在zibll>>pages新建vip.php文件,将相应内容放入其中:

<?php

/**
 * Template name: Zibll-会员模板
 * Description:   vips page
 */

// 在 PHP 中嵌套 HTML
get_header();

$header_style = zib_get_page_header_style();

?>

<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="applicable-device" content="pc,mobile">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>vip - 绿软博客</title>
    <meta name="keywords" content="绿软博客,资源网,技术网,软件资源,精品软件,网站源码,视频教程,贴吧教程,技术教程">
    <meta name="description" content="专注于分享高质量实用的互联网资源,涵盖网站搭建、建站源码、美化教程、SEO优化、免费工具、素材资源、设计资源、技术教程等丰富内容。我们致力于为用户提供一站式的资源解决方案,满足各种需求。">
    <meta name="robots" content="max-image-preview:large">
    <style>
        .ceo-background-muted {
            background-color: #f0f2f5
        }
        
        .ceo_vipbgs {
            width: 100%;
            height: 495px;
            background: #ffc003;
            position: relative;
        }
        
        .ceo-container {
            margin-top: 0px!important;
        }
        
        @media (min-width: 960px) {
            .ceo-container {
                padding-left: 40px;
                padding-right: 40px;
            }
        }
        
        @media (min-width: 640px) {
            .ceo-container {
                padding-left: 30px;
                padding-right: 30px;
            }
        }
        
        @media screen and (max-width: 800px) {
            .ceo_vipbgs {
                height: 220px!important;
            }
        }
        
        .ceo-container {
            box-sizing: content-box;
            max-width: 1440px;
            margin-left: auto;
            margin-right: auto;
            padding-left: 15px;
            padding-right: 15px;
        }
        
        .ceo-container::before,
        .ceo-container::after {
            content: "";
            display: table;
        }
        
        .ceo-container>:last-child {
            margin-bottom: 0;
        }
        
        .ceo_portal_block_summary {
            max-width: 1200px;
            padding: 40px;
            display: inline-block;
            background: #fff;
            position: relative;
            margin: 0 auto;
            top: -140px;
            border-radius: 6px;
        }
        
        .yuvip_buy {
            max-width: 1200px;
            padding: 40px;
            background: #fff;
            min-height: 600px;
            position: relative;
            margin: 0 auto;
            top: -116px;
            border-radius: 6px;
            text-align: center;
        }
        
        .yuvip_title {
            margin: 30px 0 30px 0;
            text-align: center;
            font-size: 30px;
            letter-spacing: 2px;
            line-height: 30px;
            padding: 0 80px;
            position: relative;
            display: inline-block;
            color: #333;
        }
        
        .yuvip_title:before {
            content: '';
            width: 61px;
            height: 10px;
            position: absolute;
            top: 10px;
            left: 0;
            background: url(https://www.ludown.com/vips-pic/ceo_hdicon3.png) center no-repeat;
        }
        
        .yuvip_title em {
            display: block;
            border-bottom: 1px solid #006eff;
            width: 50px;
            margin: 20px auto;
        }
        
        .yuvip_title:after {
            content: '';
            width: 61px;
            height: 10px;
            position: absolute;
            top: 10px;
            right: 0;
            background: url(https://www.ludown.com/vips-pic//ceo_hdicon4.png) center no-repeat;
        }
        
        .yuvip_serve_father {
            max-width: 1200px;
            padding: 40px;
            background: #fff;
            display: inline-block;
            position: relative;
            margin: 0 auto;
            top: -92px;
            border-radius: 6px;
            text-align: center;
        }
        
        .ceo_vip_ping {
            max-width: 1200px;
            padding: 40px;
            background: #fff;
            display: inline-block;
            position: relative;
            margin: 0 auto;
            top: -66px;
            border-radius: 6px;
            text-align: center;
        }
        
        .ceo_portal_block_summary {
            max-width: 1200px;
            padding: 40px;
            display: inline-block;
            background: #fff;
            position: relative;
            margin: 0 auto;
            top: -140px;
            border-radius: 6px;
        }
        
        .ceo_vip_txtop {
            text-align: center;
        }
        
        .ceo_vip_txtop h1 {
            margin: 30px 0 30px 0;
            text-align: center;
            font-size: 30px;
            letter-spacing: 2px;
            line-height: 30px;
            padding: 0 80px;
            position: relative;
            display: inline-block;
            color: #333;
        }
        
        .ceo_vip_txtop h1:before {
            content: '';
            width: 61px;
            height: 10px;
            position: absolute;
            top: 10px;
            left: 0;
            background: url(https://www.ludown.com/vips-pic/ceo_hdicon3.png) center no-repeat;
        }
        
        .ceo_vip_txtop h1:after {
            content: '';
            width: 61px;
            height: 10px;
            position: absolute;
            top: 10px;
            right: 0;
            background: url(https://www.ludown.com/vips-pic/ceo_hdicon4.png) center no-repeat;
        }
        
        .ceo_vip_txtop em {
            display: block;
            border-bottom: 1px solid #006eff;
            width: 50px;
            margin: 20px auto;
        }
        
        .ceo_youshi_box ul li {
            float: left;
            width: 33%;
            padding-bottom: 20px;
        }
        
        .ceo_vip_icon {
            width: 64px;
            height: 64px;
            margin: 0 auto 10px;
        }
        
        .ceo_youshi_box ul li h5 {
            height: 30px;
            line-height: 30px;
            margin: 10px 0;
            font-size: 18px;
            color: #333;
            font-weight: 500;
            overflow: hidden;
            text-align: center;
        }
        
        .ceo_youshi_box ul li p {
            height: 30px;
            line-height: 30px;
            margin: 0 0;
            font-size: 14px;
            color: #999;
            font-weight: 500;
            overflow: hidden;
            text-align: center;
        }
        
        .yuvip_buy li {
            float: left;
            margin: 0 10px;
            width: 23.2%;
            padding: 0;
            border-radius: 6px;
            background: #ffffff;
            box-shadow: 0px 4px 8px 0px rgb(0 0 0 / 15%);
        }
        
        .yuvip_buy li:nth-child(1) .top {
            background-color: #07dc8b;
            background-image: -webkit-radial-gradient(50% -6%, circle, #51ffbd 2%, #07dc8b);
            background-image: radial-gradient(circle at 50% -6%, #51ffbd 2%, #07dc8b);
        }
        
        .yuvip_buy li .top {
            position: relative;
            height: 100px;
            border-radius: 6px 6px 0 0;
        }
        
        .yuvip_buy li .top .tag {
            position: absolute;
            top: 0px;
            left: 0px;
            height: 24px;
            line-height: 24px;
            text-align: center;
            background: linear-gradient( 102.51deg, #ff451d 3.76%, #ff6f32 93.18%);
            border-radius: 4px 0 4px 0;
            color: #fff;
            font-size: 14px;
            font-weight: 400;
            padding: 0 12px;
        }
        
        .yuvip_buy li .top span {
            font-size: 20px;
            color: #fff;
            display: block;
            padding-top: 20px;
            font-weight: 600;
        }
        
        .yuvip_buy li .top p {
            font-size: 12px;
            color: #fff;
            margin-top: 5px;
        }
        
        .yuvip_buy li .con {
            font-size: 14px;
            padding: 24px;
        }
        
        .yuvip_buy li .con .desc {
            border-top: 1px solid #f4f4f4;
            margin-top: 20px;
            padding-top: 20px;
        }
        
        .yuvip_buy li .con .desc p {
            line-height: 2.5;
        }
        
        .yuvip_buy li:nth-child(1) a {
            background: #07dc8b;
        }
        
        .yuvip_buy li a {
            display: inline-block;
            width: 150px;
            height: 38px;
            line-height: 38px;
            margin-top: 15px;
            border-radius: 22px;
            font-size: 15px;
            color: #fff;
            letter-spacing: 0;
            text-align: center;
            transition: none;
        }
        
        .ceo-pages-vip ol,
        .ceo-pages-vip ul,
        .ceo-pages-vip li {
            list-style: none;
        }
        
        .yuvip_buy li .con .price span {
            font-size: 44px;
            color: #333;
            font-weight: bold;
            line-height: 1;
        }
        
        .yuvip_buy li .con .price em {
            font-style: normal;
            color: #999;
        }
        
        .yuvip_buy li .con .price p {
            display: block;
            background: rgb(255 111 0 / 14%);
            color: #ff6f00;
            padding: 6px;
            border-radius: 50px;
            margin-top: 20px;
            font-size: 12px;
        }
        
        .yuvip_buy li:nth-child(2) .top {
            background-color: #f59b00;
            background-image: -webkit-radial-gradient(50% -6%, circle, #ffb83d 2%, #f59b00);
            background-image: radial-gradient(circle at 50% -6%, #ffb83d 2%, #f59b00);
        }
        
        .yuvip_buy li:nth-child(3) .top {
            background-color: #397bee;
            background-image: -webkit-radial-gradient(50% -45%, circle, #53a7f5, #397bee);
            background-image: radial-gradient(circle at 50% -45%, #53a7f5, #397bee);
        }
        
        .yuvip_buy li:nth-child(4) .top {
            background-color: #f55727;
            background-image: -webkit-radial-gradient(50% 3%, circle, #f07a56, #f55727);
            background-image: radial-gradient(circle at 50% 3%, #f07a56, #f55727);
        }
        
        a,
        .ceo-link {
            color: #262626;
            text-decoration: none;
            cursor: pointer;
            transition: all .3s;
        }
        
        .yuvip_buy li:nth-child(4) a {
            background: #f55727;
        }
        
        .yuvip_buy li:nth-child(2) a {
            background: #f59b00;
        }
        
        .yuvip_buy li:nth-child(3) a {
            background: #397bee;
        }
        
        .ceo-pages-vip body,
        ul,
        ol,
        li,
        dl,
        dd,
        p,
        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        form,
        fieldset,
        .pr,
        .pc {
            margin: 0;
            padding: 0;
        }
        
        .yuvip_serve {
            display: inline-block;
        }
        
        .yuvip_serve ul {
            max-width: 1200px;
        }
        
        .yuvip_serve ul li {
            float: left;
            width: 25%;
        }
        
        .yuvip_serve ul li div {
            height: 200px;
            padding: 15px 10px;
            box-sizing: border-box;
            background: #FFFFFF;
            border: 1px solid #fff0;
            transition: all ease-in-out 0.3s;
            border-radius: 6px;
            margin: 12px;
        }
        
        .yuvip_serve ul li img {
            width: 60px;
            height: 60px;
            margin: 0 auto 20px;
        }
        
        .yuvip_serve ul li div:hover {
            border: 1px solid #EAECEF;
            box-shadow: 0 2px 5px 2px #d4d4d4;
        }
        
        .deanmbavar {
            width: 80px;
            height: 80px;
            margin: 0 auto;
            position: relative;
        }
        
        .deanmbavar img {
            border-radius: 50%;
        }
        
        canvas,
        img,
        video {
            max-width: 100%;
            height: auto;
            box-sizing: border-box;
        }
        
        .ceo_vip_ping li {
            float: left;
            width: 31.5%;
            padding: 20px 15px;
            padding-bottom: 40px;
            margin: 10px 10px;
            background: #fff;
            border: 1px solid #f0f0f0;
            border-radius: 15px;
        }
        
        .deanmbavar span {
            display: block;
            width: 30px;
            height: 30px;
            background: url(https://www.ludown.com/svip.gif) 0 0 no-repeat;
            background-size: 30px 30px;
            position: absolute;
            bottom: -10px;
            right: -10px;
        }
        
        .ceo_vip_ping ul li p b {
            color: #ccc;
            font-size: 23px;
        }
        
        .ceo_vip_ping ul li p {
            font-size: 14px;
            line-height: 23px;
            height: 88px;
            padding: 0 20px;
            margin-top: 5px;
            color: #666;
            display: block;
            text-align: left;
        }
        
        .deanmbusename b {
            font-size: 14px;
            color: #fec42d;
            padding-left: 10px;
        }
        
        .deanmbusename {
            height: 30px;
            line-height: 30px;
            margin-top: 10px;
            font-size: 16px;
            color: #666;
        }
        
        .yuvip_serve ul li p {
            margin-bottom: 10px;
            padding: 0 15px;
            font-size: 18px;
            color: #444444;
            text-align: center;
            line-height: 25px;
            box-sizing: border-box;
        }
        
        .yuvip_serve ul li em {
            height: 20px;
            font-size: 12px;
            color: #666666;
            text-align: center;
            line-height: 20px;
            font-style: normal;
            transition: all ease-in-out 0.3s;
        }
        
        @media screen and (max-width: 800px) {
            .yuvip_buy {
                min-height: auto!important;
                height: auto!important;
                display: inline-block;
            }
            .yuvip_buy,
            .ceo_portal_block_summary,
            .yuvip_serve_father {
                padding: 20px!important;
            }
        }
        
        @media screen and (max-width: 800px) {
            .ceo_vip_txtop h1,
            .yuvip_title {
                font-size: 18px;
            }
            .yuvip_buy li {
                margin: 10px 0!important;
                width: 100%!important;
            }
            .yuvip_serve ul li {
                width: 100%;
            }
            .ceo_vip_ping li {
                width: 100%!important;
                padding: 0!important;
                padding-bottom: 20px!important;
                padding-top: 20px!important;
                margin: 10px 0!important;
            }
        }
    </style>
</head>

<body id="ceotheme" class="">
    <script>
        var all_night_theme = false;
    </script>
    <script>
        var is_switch_day_night = true;
    </script>
    <div class="ceo-background-muted site ceo-zz-background">
        <div class="ceo_vipbgs"><img src="https://www.ludown.com/vips-pic/vip-banner.png" style="width: 100%;"></div>
        <div class="ceo-container" id="page-content" style="max-width: 1200px;">
            <div class="ceo-pages-vip">
                <div class="ceo_portal_block_summary">
                    <div class="ceo_vip_txtop">
                        <h1>VIP超级特权<em></em></h1>
                    </div>
                    <div class="ceo_youshi_box">
                        <ul>
                            <li>
                                <div class="ceo_vip_icon"><img src="https://www.ludown.com/vips-pic/ceo-vip-01.png"></div>
                                <h5>全站优选</h5>
                                <p>五层审核,层层把关作品质量</p>
                            </li>
                            <li>
                                <div class="ceo_vip_icon"><img src="https://www.ludown.com/vips-pic/ceo-vip-02.png"></div>
                                <h5>极速下载</h5>
                                <p>VIP专享极速通道,下载提高100倍</p>
                            </li>
                            <li>
                                <div class="ceo_vip_icon"><img src="https://www.ludown.com/vips-pic/ceo-vip-03.png"></div>
                                <h5>畅享无限</h5>
                                <p>更多内容,随时随地无限任意下载</p>
                            </li>
                            <li>
                                <div class="ceo_vip_icon"><img src="https://www.ludown.com/vips-pic/ceo-vip-04.png"></div>
                                <h5>优享新品</h5>
                                <p>优先下载最新作品,比别人先一步</p>
                            </li>
                            <li>
                                <div class="ceo_vip_icon"><img src="https://www.ludown.com/vips-pic/ceo-vip-05.png"></div>
                                <h5>海量内容</h5>
                                <p>112万精选作品,满足任何使用场景</p>
                            </li>
                            <li>
                                <div class="ceo_vip_icon"><img src="https://www.ludown.com/vips-pic/ceo-vip-06.png"></div>
                                <h5>专属客服</h5>
                                <p>属于你的1对1客服,即时响应</p>
                            </li>
                            <div class="clear"></div>
                        </ul>
                    </div>
                </div>

                <div class="yuvip_buy">
                    <div class="yuvip_title">VIP套餐<em></em></div>
                    <ul>
                        <li>
                            <div class="item">
                                <div class="top">
                                    <div class="tag">推荐</div>
                                    <span>年卡VIP会员</span>
                                    <p>已加入3人</p>
                                </div>
                                <div class="con">
                                    <div class="price">
                                        <span>68</span>
                                        <em>余额</em>
                                        <p>每天可下载10个VIP资源</p>
                                    </div>
                                    <div class="desc">
                                        <p></p>
                                    </div>
                                    <a class="vip-buy vip-btn pay-vip" vip-level="1" data-toggle="tooltip" data-placement="top" href="javascript:;" data-original-title="开通会员">
                                            立即开通
                                        </a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <div class="item">
                                <div class="top">
                                    <div class="tag">80%用户选择</div>
                                    <span>永久VIP会员</span>
                                    <p>已加入13人</p>
                                </div>
                                <div class="con">
                                    <div class="price">
                                        <span>108</span>
                                        <em>余额</em>
                                        <p>每天可下载10个VIP资源</p>
                                    </div>
                                    <div class="desc">
                                        <p></p>
                                    </div>
                                    <a class="vip-buy vip-btn pay-vip" vip-level="1" data-toggle="tooltip" data-placement="top" href="javascript:;" data-original-title="开通会员">
                                        立即开通
                                    </a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <div class="item">
                                <div class="top">
                                    <div class="tag">优惠</div>
                                    <span>年卡SVIP会员</span>
                                    <p>已加入2人</p>
                                </div>
                                <div class="con">
                                    <div class="price">
                                        <span>98</span>
                                        <em>余额</em>
                                        <p>每天可下载100个VIP资源</p>
                                    </div>
                                    <div class="desc">
                                        <p></p>
                                    </div>
                                    <a class="vip-buy vip-btn pay-vip" vip-level="2" data-toggle="tooltip" data-placement="top" href="javascript:;" data-original-title="开通会员">
                                        立即开通
                                    </a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <div class="item">
                                <div class="top">
                                    <div class="tag">优惠</div>
                                    <span>永久SVIP会员</span>
                                    <p>已加入5人</p>
                                </div>
                                <div class="con">
                                    <div class="price">
                                        <span>158</span>
                                        <em>余额</em>
                                        <p>每天可下载100个VIP资源</p>
                                    </div>
                                    <div class="desc">
                                        <p></p>
                                    </div>
                                    <a class="vip-buy vip-btn pay-vip" vip-level="2" data-toggle="tooltip" data-placement="top" href="javascript:;" data-original-title="开通会员">
                                        立即开通
                                    </a>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>

                <div class="yuvip_serve_father">
                    <h3 class="yuvip_title" style="margin-top: 50px;">VIP会员特权服务<em></em></h3>
                    <div class="yuvip_serve">
                        <ul>
                            <li>
                                <div>
                                    <img src="https://www.ludown.com/vips-pic/yuvip_serve1.jpg">
                                    <p>全站免费 任意下载</p>
                                    <em>全站照片、视频、隐藏资源、模板、动图、元素、办公文档、插画等均可任意下载</em>
                                </div>
                            </li>
                            <li>
                                <div>
                                    <img src="https://www.ludown.com/vips-pic/yuvip_serve2.jpg">
                                    <p>专属客服快速响应</p>
                                    <em>企业VIP专属客服通道,随时随地为您解决遇到的各项问题</em>
                                </div>
                            </li>
                            <li>
                                <div>
                                    <img src="https://www.ludown.com/vips-pic/yuvip_serve3.jpg">
                                    <p>多人协作 云端共享</p>
                                    <em>最高可15人同时团队协作云端共享,满足企业团队工作需求</em>
                                </div>
                            </li>
                            <li>
                                <div>
                                    <img src="https://www.ludown.com/vips-pic/yuvip_serve4.jpg">
                                    <p>会员尊享 高速下载</p>
                                    <em>为SVIP提供高速下载资源渠道,资源畅享无忧</em>
                                </div>
                            </li>
                            <li>
                                <div>
                                    <img src="https://www.ludown.com/vips-pic/yuvip_serve5.jpg">
                                    <p>1对1 指导服务</p>
                                    <em>SVIP会员遇到魔改难题,在一定范围内,给予免费远程帮助</em>
                                </div>
                            </li>
                            <li>
                                <div>
                                    <img src="https://www.ludown.com/vips-pic/yuvip_serve6.jpg">
                                    <p>会员服务 专属折扣</p>
                                    <em>精品资源,享有专属最低折扣,畅享全网资源</em>
                                </div>
                            </li>
                            <li>
                                <div>
                                    <img src="https://www.ludown.com/vips-pic/yuvip_serve7.jpg">
                                    <p>优质资源 抢先体验</p>
                                    <em>网站最新资源,抢先体验使用,无任何门槛</em>
                                </div>
                            </li>
                            <li>
                                <div>
                                    <img src="https://www.ludown.com/vips-pic/yuvip_serve8.jpg">
                                    <p>SVIP 永久会员</p>
                                    <em>畅享全网所有资源,无下载门槛,可联系站长获取任意魔改资源</em>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>

                <div class="ceo_vip_ping">
                    <div class="deanw1180">
                        <div class="yuvip_title">会员点评<em></em></div>
                        <div class="clear"></div>
                        <ul>
                            <div class="portal_block_summary">
                                <li>
                                    <div class="deanmbavar">
                                        <img src="https://www.ludown.com/vips-pic/vipuser.jpg" width="80">
                                        <span></span>
                                    </div>
                                    <div class="clear"></div>
                                    <div class="deanmbusename">小喵喵<b>SVIP</b></div>
                                    <div class="clear"></div>
                                    <p><b>"</b>很喜欢绿软博客的美化,网站里的代码没有遇到一个失效的,对于我这种代码小白来说,真的是太友好啦!<b>"</b></p>
                                </li>
                                <li>
                                    <div class="deanmbavar">
                                        <img src="https://www.ludown.com/vips-pic/vipuser.jpg" width="80">
                                        <span></span>
                                    </div>
                                    <div class="clear"></div>
                                    <div class="deanmbusename">一叶扁舟<b>SVIP</b></div>
                                    <div class="clear"></div>
                                    <p><b>"</b>加入绿软博客会员两个多月了,下载了很多设计素材以及课程,帮助我很多。这个会员真的非常值<b>"</b></p>
                                </li>
                                <li>
                                    <div class="deanmbavar">
                                        <img src="https://www.ludown.com/vips-pic/vipuser.jpg" width="80">
                                        <span></span>
                                    </div>
                                    <div class="clear"></div>
                                    <div class="deanmbusename">时间过客<b>SVIP</b></div>
                                    <div class="clear"></div>
                                    <p><b>"</b>博主非常好,魔改教程也很详细,有好几次都免费帮我处理问题,我买了svip会员,有很多种类的资源,真的对我帮助很大。<b>"</b></p>
                                </li>
                            </div>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>

</html>
<?php
get_footer();

2、子比后台添加页面,选择zbill会员模板;

3、将部分资源改为你自己的,比如图片;

图片下载

zibll子比添加一个会员说明页面¥1.00

月付会员免费
季付会员免费
年付会员免费
已付费?登录刷新

1 如果您喜欢本站,点击这儿捐赠本站,感谢支持!

2 这些信息可能会帮助到你: 下载帮助 | 报毒说明 | 进站必看

3 修改版本安卓及电脑软件,加群提示为修改者自留,非本站信息,注意鉴别;

4 本网站部分资源来源于网络,仅供大家学习与参考,请于下载后24小时内删除;

5 若作商业用途,请联系原作者授权,若本站侵犯了您的权益请联系站长进行删除处理;

6 作者:网站编辑,如若转载,请注明出处:https://www.lkuba.com/678.html

(1)
上一篇 2024年4月23日 上午11:05
下一篇 2024年4月25日 下午1:49

相关推荐

发表回复

登录后才能评论