• 欢迎 游客 您的光临,下载之前请先阅读 积分规则(暂行) 。任何技术问题请在论坛提问,本站定制插件、模板主题售前、售后问题请联系QQ:5916171

技巧教程 给你的小工具加上选项卡

小关_

打酱油的路过~~
管理成员
UID
255
注册
2019/01/25
消息
489
反馈评分
1,413
黄金
7,860.5G
    Windows 10 Chrome 80.0.3987.149
  • #1
效果图如下:
QQ截图20200503224451.png

1.进入后台--外观--小工具
点击右上角的“添加小工具”
2.先添加好你到时候需要加入到“选项卡小工具”中的几个小工具
3.添加好你到时候需要加入到“选项卡小工具”中的几个小工具之后,来创建这个“选项卡小工具”,这时我们进入后台--外观--小工具,点击右上角的“添加小工具”
4.“新增小工具定义”选择“HTML”
5.小工具Key随便输入,符合规则即可
6.标题也可以随便填
7.选择在论坛所显示的位置
8.将下列代码粘贴入“模板”框中:
HTML:
<div class="block-container tab">
         <h2 class="widget-tabs block-tabHeader tabs hScroller" data-xf-init="tabs h-scroller" data-state="replace" role="tablist">
             <span class="hScroller-scroll">
                 <a href="{{ link('whats-new/posts/') }}?skip=1"
                        class="tabs-tab"
                        id="选项卡一镶嵌的小工具ID"
                        role="tab">选项卡一名称</a>
                 <a href="{{ link('whats-new/posts/') }}?skip=1"
                        class="tabs-tab is-active"
                        role="tab"
                        aria-controls="选项卡二镶嵌的小工具ID">选项卡二名称</a>
                 <a href="{{ link('whats-new/profile-posts/') }}?skip=1"
                        class="tabs-tab"
                        id="选项卡三镶嵌的小工具ID"
                        role="tab">选项卡三名称</a>
             </span>
         </h2>
         <ul class="tabPanes widget--tab">
             <li role="tabpanel" aria-labelledby="xfrm_whats_new_overview_new_resources">
                 <xf:widget key="选项卡一镶嵌的小工具ID" />
             </li>
             <li class="is-active" role="tabpanel" id="new_threads">
                 <xf:widget key="选项卡二镶嵌的小工具ID" />
             </li>
             <li role="tabpanel" aria-labelledby="forum_overview_new_posts">
                 <xf:widget key="选项卡三镶嵌的小工具ID" />
             </li>
         </ul>
     </div>
注意一下,代码中有一些需要修改的内容!我已经用中文标注了!

什么是小工具ID?
就是你在本教程第二步时添加的几个你要加入到“选项卡小工具”的小工具的Key
QQ截图20200503225654.png

教程到此结束!
 

香草大叔

联合国秘书长
UID
48
注册
2017/11/27
消息
72
反馈评分
21
黄金
3,354.1G
    Android Chrome Mobile 81.0.4044.117
  • #2
好东西,学到了!
 
UID
566
注册
2019/12/31
消息
78
反馈评分
4
黄金
210.3G
    Windows 10 Chrome 83.0.4103.24
  • #3
能不能给下镇楼图的那个小工具:icon-evil:
 
UID
923
注册
2020/07/09
消息
72
反馈评分
8
黄金
1,675.5G
    Android 5.x Lollipop Chrome 81.0.4044.117
  • #6
这个好埃
 
顶部 底部