主题OL

ZBlog宽屏游戏图片瀑布流主题themeOLDZ使用教程

ZTOL ZBlog使用帮助 2022-06-21 2.5千 1

ZBlog宽屏游戏图片瀑布流主题themeOLDZ发布地址:https://www.themeol.com/post/131.html,这套模板的配置总的来说是非常简单的,其中只有5处配置需要给大家详细的说明一下。

1,导航及二级导航菜单的设置

在配置之前,大家首先到“插件管理”页面中关闭“链接模块管理”插件!然后,到“模块管理”中点击“导航栏”,接下来直接进行设置即可,演示站代码如下:

<li id="nvabar-item-index"><a href="http://themeoldz.themeol.com/">首页</a></li>
<li id="navbar-category-1"><a href="http://themeoldz.themeol.com/category-1.html">瀑布流列表</a></li>
<li id="navbar-category-2"><a href="http://themeoldz.themeol.com/category-2.html">普通文章列表</a></li>
<li id="navbar-category-9"><a href="http://themeoldz.themeol.com/category-9.html">顶级导航</a>
    <i class="fa fa-angle-down"></i>
    <ul>
        <li id="navbar-category-5"><a href="http://themeoldz.themeol.com/category-5.html">测试栏目</a></li>
        <li id="navbar-category-6"><a href="http://themeoldz.themeol.com/category-6.html">二级导航</a></li>
        <li id="navbar-category-8"><a href="http://themeoldz.themeol.com/category-8.html">分类演示</a></li>
    </ul>
</li>
<li><a href="https://www.themeol.com/post/132.html" style="color:#00B050;">使用教程</a></li>
<li><a href="tencent://message/?uin=570827729&amp;Site=themeol.com&amp;Menu=yes" style="color:#ed4040;">主题购买</a></li>
<li id="navbar-page-2"><a href="http://themeoldz.themeol.com/2.html">留言本</a></li>

2,幻灯片右侧的3个卡片导航设置

大家到“主题配置”中点击“首页设置”按钮,进入,然后输入对应代码即可,演示站代码如下(复制、贴粘,然后把对应信息修改为你的即可):

<li class="swiper-bm-item">
    <a href="http://themeoldz.themeol.com/tags-14.html" title="有颜有料">
        <div class="swiper-bm-content">
            <img src="http://themeoldz.themeol.com/zb_users/upload/2022/06/20220616120951165535259157569.jpg" alt="有颜有料">
            <div class="item-opt-text">
                <span>有颜有料</span>
            </div>
        </div>
    </a>
</li>
<li class="swiper-bm-item">
    <a href="http://themeoldz.themeol.com/tags-16.html" title="白皙甜美">
        <div class="swiper-bm-content">
            <img src="http://themeoldz.themeol.com/zb_users/upload/2022/06/20220616121049165535264943370.jpg" alt="白皙甜美">
            <div class="item-opt-text">
                <span>白皙甜美</span>
            </div>
        </div>
    </a>
</li>
<li class="swiper-bm-item">
    <a href="http://themeoldz.themeol.com/tags-3.html" title="黑丝诱惑">
        <div class="swiper-bm-content">
            <img src="http://themeoldz.themeol.com/zb_users/upload/2022/06/20220616121155165535271514157.jpg" alt="黑丝诱惑">
            <div class="item-opt-text">
                <span>黑丝诱惑</span>
            </div>
        </div>
    </a>
</li>

3,幻灯片下方的卡片导航设置

同样到“主题配置”中点击“首页设置”按钮,进入,然后输入对应代码即可,演示站代码如下(复制、贴粘,然后把对应信息修改为你的即可):

<li class="swiper-bm-item">
    <a href="http://themeoldz.themeol.com/tags-5.html" title="青春少女">
        <div class="swiper-bm-content">
            <img src="http://themeoldz.themeol.com/zb_users/upload/2020/12/202012111607678359321810.jpg" alt="青春少女">
            <div class="item-opt-text">
                <span>青春少女</span>
            </div>
        </div>
    </a>
</li>
<li class="swiper-bm-item">
    <a href="http://themeoldz.themeol.com/tags-13.html" title="女神御姐">
        <div class="swiper-bm-content">
            <img src="http://themeoldz.themeol.com/zb_users/upload/2022/06/20220615221042165530224238834.jpg" alt="女神御姐">
            <div class="item-opt-text">
                <span>女神御姐</span>
            </div>
        </div>
    </a>
</li>
<li class="swiper-bm-item">
    <a href="http://themeoldz.themeol.com/tags-4.html" title="清纯美女">
        <div class="swiper-bm-content">
            <img src="http://themeoldz.themeol.com/zb_users/cache/thumbs/ece0540124d08355f6f10bc727d9aa86-192-139-1.jpg" alt="清纯美女">
            <div class="item-opt-text">
                <span>清纯美女</span>
            </div>
        </div>
    </a>
</li>
<li class="swiper-bm-item">
    <a href="http://themeoldz.themeol.com/tags-15.html" title="性感妖娆">
        <div class="swiper-bm-content">
            <img src="http://themeoldz.themeol.com/zb_users/upload/2022/06/20220615221227165530234799246.jpg" alt="性感妖娆">
            <div class="item-opt-text">
                <span>性感妖娆</span>
            </div>
        </div>
    </a>
</li>
<li class="swiper-bm-item">
    <a href="http://themeoldz.themeol.com/tags-17.html" title="靓丽佳人">
        <div class="swiper-bm-content">
            <img src="http://themeoldz.themeol.com/zb_users/upload/2022/06/20220616120559165535235945214.jpg" alt="靓丽佳人">
            <div class="item-opt-text">
                <span>靓丽佳人</span>
            </div>
        </div>
    </a>
</li>

4,卡片导航下方的文字导航设置

同样到“主题配置”中点击“首页设置”按钮,进入,然后输入对应代码即可,演示站代码如下(复制、贴粘,然后把对应信息修改为你的即可):

<li><a href="http://themeoldz.themeol.com/tags-22.html">时尚美女</a></li>
<li><a href="http://themeoldz.themeol.com/tags-19.html">清纯甜美</a></li>
<li><a href="http://themeoldz.themeol.com/tags-21.html">制服系列</a></li>
<li><a href="http://themeoldz.themeol.com/tags-20.html">气质女神</a></li>

5,页脚版权文字设置

到“主题配置”中点击“页脚设置”按钮,进入。然后输入对应代码即可,演示站代码如下(复制、贴粘,然后把对应信息修改为你的即可):

Copyright © 2020 主题OL版权所有 <a href="https://www.miibeian.gov.cn/" target="_blank" rel="nofollow noopener noreferrer">皖ICP备123456XXX号-1</a>

好了,本套模板的教程到这里就结束了,剩下的配置实在太简单了,就是选择、或者填写对应的文字即可,没什么好说明的了,大家可以自己配置后观察前端变化。

发表评论

用户头像 游客
此处应有掌声~

评论列表

  • 用户头像
    访客(08-28 15:34)回复
    主题OL精美个人博客模板themeolBkThree主题使用教程
QQ在线客服

客户服务

在线时间 上午:09:00-12:00 下午:14:00-21:00