Google Blogger 模板 - 在不使用 Jquery 或 Javascript 的情况下突出显示博客上的活动选项卡？

Question

This question is about Google Blogger Template manipulation. People developing/changing or manipulating Blogger templates in any way know its syntax hence can provide some input.

下面的代码有没有问题：

<b:section class='navbar-collapse collapse' id='navbar' showaddelement='no'>
 <b:widget id='LinkList1' locked='false' title='navbar' type='LinkList'>
  <b:includable id='main'>
   <ul class='nav navbar-nav navbar-right'>
   <b:loop values='data:links' var='link'>
    <b:if cond='data:blog.url==data:link.target'>
     <li class='selected'><a expr:href='data:link.target'><data:link.name/></a></li>
    <b:else/>
     <li><a expr:href='data:link.target' expr:title='data:blog.url==data:link.target'><data:link.name/></a></li>
    </b:if>
   </b:loop>
   </ul>
  </b:includable>
 </b:widget>
</b:section>

不确定为什么当我打开 link 时比较失败：http://sandbox-mahavir-munot.blogspot.in/p/about-us.html

下面是上面执行代码片段的firebug输出，title属性显示了我在地址栏中打开URL:http://sandbox-mahavir-munot.blogspot.in/p/about-us.html时的比较结果。

<ul class="nav navbar-nav navbar-right">
 <li><a title="false" href="http://sandbox-mahavir-munot.blogspot.in/">Home</a></li>
 <li><a title="false" href="http://sandbox-mahavir-munot.blogspot.in/p/about-us.html">About Us</a></li>
 <li><a title="false" href="http://sandbox-mahavir-munot.blogspot.in/p/contact-us.html">Contact Us</a></li>
</ul>

非常感谢任何对此的指点！！

提前致谢。

Mahavir Munot

Answer 1

我能够通过如下所示修改代码段来解决此问题：

<b:section class='navbar-collapse collapse' id='navbar' showaddelement='no'>
 <b:widget id='LinkList1' locked='false' title='navbar' type='LinkList'>
  <b:includable id='main'>
   <ul class='nav navbar-nav navbar-right'>
   <b:loop values='data:links' var='link'>
    <b:if cond='data:blog.canonicalUrl==data:link.target or data:blog.url==data:link.target'>
     <li class='selected'><a expr:href='data:link.target'><data:link.name/></a></li>
    <b:else/>
     <li><a expr:href='data:link.target' expr:title='data:blog.url==data:link.target'><data:link.name/></a></li>
    </b:if>
   </b:loop>
   </ul>
  </b:includable>
 </b:widget>
</b:section>

我还必须修改 Blogger LinkList 小部件以将所有非规范 URL 更改为规范 URL。

下面是 link 与帮助我解决此问题的 Blogger 专家的对话：Blogger Forum

Answer 2

这是我博主的代码

<ul>
    <b:loop values='data:links' var='link'>
      <b:if cond='data:blog.canonicalUrl == data:link.href + "?max-results=7" or data:link.isCurrentPage'>
        <li class='selected'><a expr:href='data:link.href + "?updated-max=01&amp;max-results=7"'><data:link.title/></a></li>
      <b:else/>
        <li><a expr:href='data:link.href + "?updated-max=01&amp;max-results=7"'><data:link.title/></a></li>
      </b:if>
    </b:loop>
  </ul>

我对 link 结果进行了修改，我错过了 URL 的参数，所以我在 if 条件标记中添加了这个值

data:blog.canonicalUrl == data:link.href + "?max-results=7" or data:link.isCurrentPage

我在写博主Gdata的时候，没有从firebug中得到任何东西，所以我对代码进行了调试，在include标签中看到了一些结果，然后添加了一个元素打印结果，例如检查URL的参数：

<div>link url :<data:link.href/><br/>Canonical url :<data:blog.canonicalUrl/></div>

Google Blogger 模板 - 在不使用 Jquery 或 Javascript 的情况下突出显示博客上的活动选项卡？

Google Blogger Template - Highlighting Active Tabs on Blog without using Jquery or Javascript?

xml

blogger

blogspot

google-product-search