html - 为什么这段创建存档页面的代码在这个博客上不起作用?

标签 html css blogger blogspot

<分区>


关闭 7 年前

我一直在为 friend 的博客站点创建一个新的布局,用于测试博客。我试图通过在此处使用此代码来创建存档页面:https://github.com/jhwilson/Create-a-Blogger-archive-page .当我将它添加到此页面时,不知何故这不起作用:http://starttofashiontest.blogspot.be/p/archive.html .我还尝试添加这样的存档:gadgetsappshacks.com/2011/09/creating-automatic-archive-page-in.html,但它也不起作用。如果有人能帮助我,那就太好了!

    <b:widget id='BlogArchive1' locked='false' title='' type='BlogArchive'>
              <b:includable id='main'>
  <b:if cond='data:title != &quot;&quot;'>
    <h2><data:title/></h2>
  </b:if>
  <div class='widget-content'>
  <div id='ArchiveList'>
  <div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
    <b:include cond='data:style == &quot;HIERARCHY&quot;' data='data' name='interval'/>
    <b:include cond='data:style == &quot;FLAT&quot;' data='data' name='flat'/>
    <b:include cond='data:style == &quot;MENU&quot;' data='data' name='menu'/>
  </div>
  </div>
  <b:include name='quickedit'/>
  </div>
</b:includable>
              <b:includable id='flat' var='data'>
  <ul class='flat'>
    <b:loop values='data:data' var='i'>
      <li class='archivedate'>
        <a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)
      </li>
    </b:loop>
  </ul>
</b:includable>
              <b:includable id='interval' var='intervalData'>
  <b:loop values='data:intervalData' var='interval'>
    <ul class='hierarchy'>
      <li expr:class='&quot;archivedate &quot; + data:interval.expclass'>
        <b:include cond='data:interval.toggleId' data='interval' name='toggle'/>
        <a class='post-count-link' expr:href='data:interval.url'>
          <data:interval.name/>
        </a>
        <span class='post-count' dir='ltr'>(<data:interval.post-count/>)</span>
        <b:include cond='data:interval.data' data='interval.data' name='interval'/>
        <b:include cond='data:interval.posts' data='interval.posts' name='posts'/>
      </li>
    </ul>
  </b:loop>
</b:includable>
              <b:includable id='menu' var='data'>
  <select expr:id='data:widget.instanceId + &quot;_ArchiveMenu&quot;'>
    <option value=''><data:title/></option>
    <b:loop values='data:data' var='i'>
      <option expr:value='data:i.url'><data:i.name/> (<data:i.post-count/>)</option>
    </b:loop>
  </select>
</b:includable>
              <b:includable id='posts' var='posts'>
  <ul class='posts'>
    <b:loop values='data:posts' var='post'>
      <li><a expr:href='data:post.url'><data:post.title/></a></li>
    </b:loop>
  </ul>
</b:includable>
              <b:includable id='toggle' var='interval'>
  <a class='toggle' href='javascript:void(0)'>
    <span expr:class='&quot;zippy&quot; + (data:interval.expclass == &quot;expanded&quot; ? &quot; toggle-open&quot; : &quot;&quot;)'>
      <b:if cond='data:interval.expclass == &quot;expanded&quot;'>
        &#9660;&#160;
      <b:elseif cond='data:blog.languageDirection == &quot;rtl&quot;'/>
        &#9668;&#160;
      <b:else/>
        &#9658;&#160;
      </b:if>
    </span>
  </a>
</b:includable>
            </b:widget>

最佳答案

使用以下代码显示存档页面,以页面的html模式粘贴:

<div dir="ltr" style="text-align: left;" trbidi="on">
<h2 style="text-align: left;">
Full Archive of YourSite</h2>
<div id="bp_toc">
<script src="http://bloggergadgets.googlecode.com/files/blogtoc_orig.js" type="text/javascript">
</script>

<script src="/feeds/posts/summary?alt=json-in-script&amp;max-results=500&amp;callback=loadtoc" type="text/javascript">
</script>



<style>
#bp_toc {
border: 5px solid #c1bfbf;
padding: 5px;
width:100%;
margin-top:10px;
}
.toc-header-col1, .toc-header-col2, .toc-header-col3 {
background: #fff;
color: #000000;
padding-left: 5px;
width:60%;
}
.toc-header-col2 {
width:20%;
}
.toc-header-col3 {
width:20%;
}
.toc-header-col1 a:link, .toc-header-col1 a:visited, .toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link, .toc-header-col3 a:visited {
font-size:18px;
text-decoration:none;
}
.toc-header-col1 a:hover, .toc-header-col2 a:hover, .toc-header-col3 a:hover {
font-size:18px;
text-decoration:underline;
}
.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 {
padding-left: 5px;
font-size:18px;
}
</style>
</div>
</div>

关于html - 为什么这段创建存档页面的代码在这个博客上不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35119312/

上一篇:html - 如何自定义 razor 用于呈现 MVC5 中的 ModelState 错误的 HTML 属性

下一篇:javascript - Masonry broken(可能是经典)

相关文章:

html - 如何防止 Blogger 将主题样式应用于帖子中的 HTML 片段?

javascript - 在页面上列出博主帖子,带有图像并使用 CSS 进行风格化

javascript - 单击显示,双击隐藏 slider

html - 占位符字体不变

javascript - 如何使用动态值将 ng-model 设置为父范围

css - HTML 5 拖放多个图像

javascript - 仅显示特定国家/地区的链接

javascript - 如何将列表项与数组中的值匹配

javascript - 谷歌 api Javascript 代码不工作

html - 按百分比设置表格行的高度在 Firefox 上不起作用。解决方案?