欢迎来到我的网上家园,谢谢关心和支持!

帝国模板制作笔记(仿phpabc.cn)[!--temp.header--](二)

2019-03-10 21:33:17 帝国CMS
[showclasstemp]'0',12,0,0[/showclasstemp]
这是帝国的主导航标签,是带模板的栏目导航标签,它有四个参数第一个带单引号的是父栏目ID,'0'为显示所有一级栏目,'selfinfo'显示本栏目下级栏目。第二个为标签模板ID,帝国选用的是ID为12的模板。它在后台》模板》标签模板》管理标签模板中修改,在右侧找到相应ID的模板点修改即可。不过,为了防止我们改坏了,回不到从前,我们应当选择复制,然后把它改一个好记的名字,再调用。第三个参数是是否显示栏目信息数,0为不显示,1为显示。第四个参数显示栏目数,0为不限制,当然你写上几,就限制为几。

不过因为我们需要在导航显示二级菜单,所以我们用另一个标签来作为导航标签:循环栏目导航标签 (listshowclass)
使用格式:[listshowclass]父栏目ID,标签模板ID,是否显示栏目信息数,显示栏目数[/listshowclass]
和上面那个标签是一致的。下面我们就选将它放下,去改一改模板,才能继续操作下去。

在后台》模板》标签模板》管理标签模板后,点ID为1的模板后的复制,修改它的名称“子栏目导航标签模板”为“带二级子栏目导航标签模板”点保存模板,这样,我们再点管理标签模板,右边一栏就会看到刚才我们复制的模板,ID为13,点修改,进入。
这个模板有两个部分我们要修改一是: 页面模板内容 ,    凡是写入这里的代码都会循环,直到这一级导航全部完成。在两个[!--empirenews.listtemp--]之间是<!--list.var1-->它所包含的内容是列表内容模板(list.var) 中的内容,同样也是循环出现的,直到所有二级栏目都读完,再退回上一级。也就是页面模板内容的循环中,然后再次进入,这样直到全部完成。

读明白上面的文字后我们也就大概明白了它是如何实现有二级菜单的效果了。现在我们看看phpabc的导航代码, 它同样有鲜明的标志:

 <nav id="navigation">
    <ul id="nav"> <li id="menu-item-1639" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-1639"><a href="http://www.phpabc.cn" aria-current="page">首页</a></li>
<li id="menu-item-1608" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1608"><a href="http://www.phpabc.cn/topics/developer">PHP</a></li>
<li id="menu-item-1609" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-1609"><a href="http://www.phpabc.cn/topics/program">PHP程序</a>
<ul class="sub-menu">
 <li id="menu-item-1610" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1610"><a href="http://www.phpabc.cn/topics/program/drupal">Drupal</a></li>
</ul>
</li>
<li id="menu-item-1611" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1611"><a href="http://www.phpabc.cn/topics/program/wordpress">WordPress</a></li>
<li id="menu-item-1616" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1616"><a href="http://www.phpabc.cn/topics/frontend/javascript">JavaScript</a></li>
<li id="menu-item-1615" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1615"><a href="http://www.phpabc.cn/topics/frontend/html5">Html5</a></li>
<li id="menu-item-1614" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1614"><a href="http://www.phpabc.cn/topics/frontend/css">CSS</a></li>
<li id="menu-item-1617" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1617"><a href="http://www.phpabc.cn/topics/frontend/jquery">JQuery</a></li>

<li id="menu-item-3371" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-3371"><a href="http://www.phpabc.cn/topics/frontend">前端</a>
<ul class="sub-menu">
 <li id="menu-item-3373" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-3373"><a href="http://www.phpabc.cn/topics/frontend/angularjs">angularjs</a></li>
 <li id="menu-item-1619" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1619"><a href="http://www.phpabc.cn/topics/frontend/xhtmlhtml">xhtml/html</a></li>
</ul>
</li>

<li id="menu-item-1628" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1628"><a href="http://www.phpabc.cn/topics/backend/nginx">Nginx</a></li>
<li id="menu-item-1621" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-1621"><a href="http://www.phpabc.cn/topics/backend">后端</a>
<ul class="sub-menu">
 <li id="menu-item-1622" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1622"><a href="http://www.phpabc.cn/topics/backend/apache">Apache</a></li>
 <li id="menu-item-1623" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1623"><a href="http://www.phpabc.cn/topics/backend/bind">Bind</a></li>
 <li id="menu-item-1624" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1624"><a href="http://www.phpabc.cn/topics/backend/cpanel">Cpanel</a></li>
 <li id="menu-item-1625" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1625"><a href="http://www.phpabc.cn/topics/backend/directadmin">DirectAdmin</a></li>
 <li id="menu-item-1626" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1626"><a href="http://www.phpabc.cn/topics/backend/lighttpd">Lighttpd</a></li>
 <li id="menu-item-1627" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1627"><a href="http://www.phpabc.cn/topics/backend/mysql">Mysql</a></li>
 <li id="menu-item-1629" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1629"><a href="http://www.phpabc.cn/topics/backend/oracle">Oracle</a></li>
 <li id="menu-item-1630" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1630"><a href="http://www.phpabc.cn/topics/backend/squid">Squid</a></li>
 <li id="menu-item-1631" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1631"><a href="http://www.phpabc.cn/topics/backend/tomcat">Tomcat</a></li>
</ul>
</li>
<li id="menu-item-1618" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1618"><a href="http://www.phpabc.cn/topics/seo">SEO</a></li>
</ul>    </nav>  但是这个看上去比较多,也比较乱,我们先结合网站的导航一分析这段代码:
<nav id="navigation">
    <ul id="nav">
</ul>    </nav>

这是外部框架,没有重复,所以不能用在这里,要写在temp.header模板中。

<li id="menu-item-1639" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-1639"><a href="http://www.phpabc.cn" aria-current="page">首页</a></li>
这是首页链接,我们只需要改下链接即可。
 上面的斜线部分是完整的带二级导航的菜单,我们就用它来改造,
 改造完成是这样的:页面模板内容:
 <li id="menu-item-3371"  class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-3371"><a href=" [!--bclassurl--]  "> [!--bclassname--] </a>
<ul class="sub-menu">
[!--empirenews.listtemp--]<!--list.var1-->[!--empirenews.listtemp--]
</ul>
</li>
 
不知道为什么,模板变量里的[!--the.classname--]和[!--the.classurl--]这两个变量无法使用在temp.header里只好使用红色标示出来的两个变量。
列表内容模板(list.var):
 <li id="menu-item-3373" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-3373" ><a href="[!--classurl--]">[!--classname--]</a></li>
这部分将代替页面模板内容中的<!--list.var1-->并循环。

做好以上工作以后,点击保存模板。再打开[!--temp.header--],在</div>
 </div>后面插入

<nav id="navigation">
    <ul id="nav">

<li id="menu-item-1639" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-1639"><a href="[!--news.url--]" aria-current="page">首页</a></li>
[listshowclass]'0',13,0,0[/listshowclass]

</ul>    </nav>
其中红色部分为标签可以这样得到:后台》模板》自动生成标签,在
选择标签:下拉选择循环栏目导航标签,父栏目选一级栏目,标签模板选刚才我们编辑的带二级子栏目的导航标签,再点输出标签,就可以复制到这里使用了。

猜你喜欢

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表