内容简介:

内容简介
WordPress美化-RiPro-V5主题网站首页添加四格小工具,支持Ripro-v2和v5,理论支持所有主题。

效果图片:

RiPro-V5主题首页四格美化小工具教程

HTML相关代码:

<div class="container animate__animated animate__fadeInUp">
    <div class="row animate__animated animate__fadeInUp">
        <div class="col-3">
            <div class="item">
                <a target="_blank" href="/wordpress" class="d-flex justify-content-center align-items-center py-4" style="color:#0868ac">
                    <div class="item-icon"> <img src="https://cloudcache.tencentcs.com/open_proj/proj_qcloud_v2/gateway/product/css/img/p-overview/p-addition-links-list-view-news.svg"></div>
                    <div class="text-left">
                        <h5>WordPress <span class="badge badge-primary" style="background-color:#0868ac">进入<i class="mdi mdi-chevron-right"></i></span></h5>
                        <p class="text-muted m-0">WordPress教程持续更新</p>
                    </div>
                </a>
            </div>
        </div>
        <div class="col-3">
            <div class="item">
                <a target="_blank" href="/cx" class="d-flex justify-content-center align-items-center py-4" style="color:#2b8cbe">
                    <div class="item-icon"><img src="https://cloudcache.tencentcs.com/open_proj/proj_qcloud_v2/gateway/product/css/img/p-overview/p-addition-links-list-view-centre.svg">
                    </div>
                    <div class="text-left"><h5>网站程序 <span class="badge badge-primary" style="background-color:#2b8cbe">有演示<i class="mdi mdi-chevron-right"></i></span></h5><p class="text-muted m-0">免费好玩的各种程序随意下载</p>
                    </div>
                </a>
            </div>
        </div>
        <div class="col-3">
            <div class="item">
                <a target="_blank" href="/rj" class="d-flex justify-content-center align-items-center py-4" style="color:#4eb3d3">
                    <div class="item-icon"> <img src="https://cloudcache.tencentcs.com/open_proj/proj_qcloud_v2/gateway/product/css/img/p-overview/p-addition-links-list-view-free.svg"></div><div class="text-left"><h5>软件工具 <span class="badge badge-primary" style="background-color:#4eb3d3">已测试<i class="mdi mdi-chevron-right"></i></span></h5>
                        <p class="text-muted m-0">各种办公,系统,激活,学习等软件资源</p>
                    </div>
                </a>
            </div>
        </div>
        <div class="col-3">
            <div class="item">
                <a target="_blank" href="/android" class="d-flex justify-content-center align-items-center py-4" style="color:#7bccc4">
                    <div class="item-icon"> <img src="https://cloudcache.tencentcs.com/open_proj/proj_qcloud_v2/gateway/product/css/img/p-overview/p-addition-links-list-view-photo.svg"></div><div class="text-left"><h5>安卓软件 <span class="badge badge-primary" style="background-color:#7bccc4">已测试<i class="mdi mdi-chevron-right"></i></span></h5>
                        <p class="text-muted m-0">各种app办公,教育,学习,系统,等软件资源</p>
                    </div>
                </a>
            </div>
        </div>
    </div>
</div>

 

页面显示方法

 进入后台 – 外观 – 小工具 – 自定义HTML工具 

本文转载自 小白博客:RiPro-V2主题首页四格美化小工具教程-小白博客

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
  • 本站名称:追梦人博客
  • 本站永久地址:https://www.dreamren.cn
  • 本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系在线客服进行删除处理
  • 本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责
  • 本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报
  • 本站资源大多存储在云盘,如发现链接失效,请联系我们我们会第一时间更新
  • 如果您喜欢本站,♥点这儿开通会员资助本站
  • 如遇软件内有加群提示,为修改者自留,非本站信息,注意鉴别
  • 这些信息可能会帮助你了解本站:

SVIP会员 关于我们 网址导航 标签云