效果
![图片[1]-WordPress添加一个网页集合页面-乡野博文](http://www.zau.cn/wp-content/uploads/2022/02/cc8f59cd233f-2.png)
教程
第一步
在主题目录--->wp-content ---> themes ---> zibll ---> pages
创建tool.php
文件,然后把下面的php代码添加进去。
<?php
/**
* Template name: AOTIAN-工具
* Description: AOTIAN - tool
*/
// 傲天网页工具
get_header();
$post_id = get_queried_object_id();
$header_style = zib_get_page_header_style($post_id);
?>
<main class="container">
<div class="content-wrap">
<div class="content-layout">
<?php if($header_style != 1){echo zib_get_page_header($post_id);}?>
<div class="theme-box radius8">
<?php if($header_style == 1){ echo zib_get_page_header($post_id);}?>
<html>
<head>
<style>
.wiiuii-card-nav{display:flex;flex-wrap:wrap;margin:20px 0}.wiiuii-card-nav .item{width:25%;padding:10px}.wiiuii-card-nav .nav{display:flex;align-items:center;border-radius:8px;box-shadow:0px 0px 10px rgba(0,0,0,0.2);transition:-webkit-transform 0.35s;transition:transform 0.35s;transition:transform 0.35s, -webkit-transform 0.35s;padding:20px 10px}.wiiuii-card-nav .nav .avatar{min-width:40px;min-height:40px;width:40px;height:40px;background-size:cover;border-radius:8px;margin-right:10px}.wiiuii-card-nav .nav .content{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.wiiuii-card-nav .nav svg{width:18px;height:18px;min-width:18px;min-height:18px;fill:#fff}.wiiuii-card-nav .nav:hover{text-decoration:none !important;-webkit-transform:translate3d(0, -5px, 0);transform:translate3d(0, -5px, 0)}@media (max-width: 1200px){.wiiuii-card-nav .item{width:33.3333333%;padding:10px}}@media (max-width: 992px){.wiiuii-card-nav .item{width:50%;padding:10px}.wiiuii-card-nav .nav svg{display:none}.wiiuii-card-nav{margin:15px 0}}@media screen and (max-width: 768px){.wiiuii-card-nav .item{width:100%;padding:10px}.wiiuii-card-nav .nav svg{display:none}.wiiuii-card-nav{margin:15px 0}}
</style>
</head>
<body>
<div class="wiiuii-card-nav">
<!---->
<div class="item">
<a href="https://www.atbkw.cn/videos" class="nav" target="_blank" rel="noopener"> <span class="avatar" style="background-image: url(https://www.atbkw.cn/wp-content/uploads/aotian/logo/ico.png)"></span> <span class="content" style="font-weight: bold;">视频解析</span><i class="fa fa-paper-plane-o" aria-hidden="true"></i></a>
</div>
<div class="item">
<a href="https://www.atbkw.cn/css" class="nav" target="_blank" rel="noopener"> <span class="avatar" style="background-image: url(https://www.atbkw.cn/wp-content/uploads/aotian/logo/ico.png)"></span> <span class="content" style="font-weight: bold;">CSS代码</span> <i class="fa fa-paper-plane-o" aria-hidden="true"></i></a>
</div>
<div class="item">
<a href="https://www.atbkw.cn/epidemicsituation" class="nav" target="_blank" rel="noopener"> <span class="avatar" style="background-image: url(https://www.atbkw.cn/wp-content/uploads/aotian/logo/ico.png)"></span> <span class="content" style="font-weight: bold;">实时疫情</span><i class="fa fa-paper-plane-o" aria-hidden="true"></i></a>
</div>
<div class="item">
<a href="https://www.atbkw.cn/" class="nav" target="_blank" rel="noopener"> <span class="avatar" style="background-image: url(https://www.atbkw.cn/wp-content/uploads/aotian/logo/ico.png)"></span> <span class="content" style="font-weight: bold;">傲天博客待添加</span><i class="fa fa-paper-plane-o" aria-hidden="true"></i></a>
</div>
<div class="item">
<a href="https://www.atbkw.cn/" class="nav" target="_blank" rel="noopener"> <span class="avatar" style="background-image: url(https://www.atbkw.cn/wp-content/uploads/aotian/logo/ico.png)"></span> <span class="content" style="font-weight: bold;">傲天博客待添加</span><i class="fa fa-paper-plane-o" aria-hidden="true"></i></a>
</div>
<div class="item">
<a href="https://www.atbkw.cn/" class="nav" target="_blank" rel="noopener"> <span class="avatar" style="background-image: url(https://www.atbkw.cn/wp-content/uploads/aotian/logo/ico.png)"></span> <span class="content" style="font-weight: bold;">傲天博客待添加</span><i class="fa fa-paper-plane-o" aria-hidden="true"></i></a>
</div>
<div class="item">
<a href="https://www.atbkw.cn/" class="nav" target="_blank" rel="noopener"> <span class="avatar" style="background-image: url(https://www.atbkw.cn/wp-content/uploads/aotian/logo/ico.png)"></span> <span class="content" style="font-weight: bold;">傲天博客待添加</span><i class="fa fa-paper-plane-o" aria-hidden="true"></i></a>
</div>
<div class="item">
<a href="https://www.atbkw.cn/" class="nav" target="_blank" rel="noopener"> <span class="avatar" style="background-image: url(https://www.atbkw.cn/wp-content/uploads/aotian/logo/ico.png)"></span> <span class="content" style="font-weight: bold;">傲天博客待添加</span><i class="fa fa-paper-plane-o" aria-hidden="true"></i></a>
</div>
</div>
</body>
</html>
<br> <br> <br> <br> <br>
</div>
<?php comments_template('/template/comments.php', true); ?>
</div>
</div>
</main>
<?php
get_footer();
第二步
WordPress后台—>新建页面—>自己填标题(内容不要动他)—>模板选一下AOTIAN-工具—>发布文章如图:
![图片[2]-WordPress添加一个网页集合页面-乡野博文](http://www.zau.cn/wp-content/uploads/2022/02/cc8f59cd233f-3-1024x415.png)
您阅读这篇文章共花了: 0小时00分00秒
THE END
暂无评论内容