[blogger template customize]Elegant navigation for the archive page
This article is for blogger widget version 1 only.
You can test elegant archive navigation. /2016_08_28_archive.html
By year, monthly, daily, complete navigation has been realized.(2017/1/28 20:00)
- JS free!
- Use a BlogArchive widget for navigation.(BlogArchive widget limite is just 2.)
- Use lambda expression to get last index of loop.
<b:with var='ylast' value='data:data.data count ( y => y.name != "" )'/> - Only
<b:eval>and<b:with>can touch list item directly. - Need a space around the operator.
<b:with var='_m' value='data:y.data[data:mi + 1]'/>
Elegant Archive Pager
<b:widget id='BlogArchive1' locked='true' type='BlogArchive' mobile='yes'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "archive"'>
<div class="Pager"><section role="navigation"><b:include name='navi'/></section></div>
</b:if>
</b:includable>
<b:includable id='navi'>
<b:with var='is_year' value='data:data count ( _y => _y.url == data:blog.url )'>
<b:if cond='data:is_year != 0'>
<b:include name='navi_year'/>
<b:else />
<b:loop values='data:data' var='y'>
<b:loop values='data:y.data' var='m'>
<b:if cond='data:m.url == data:blog.url'>
<b:include name='navi_month'/>
<b:else />
<b:with var='is_day' value='data:m.data count ( _d => _d.url == data:blog.url )'>
<b:if cond='data:is_day != 0'>
<b:include name='navi_day'/>
</b:if>
</b:with>
</b:if>
</b:loop>
</b:loop>
</b:if>
</b:with>
</b:includable>
<b:includable id='navi_year'>
<b:loop values='data:data' var='y' index='yi'>
<b:if cond='data:y.url == data:blog.url'>
<b:with var='ylast' value='data:data count ( _y => _y.url != "" )'>
<b:if cond='data:ylast - 1 != data:yi'>
<b:with var='_y' value='data:data[data:yi + 1]'>
<link rel="next" expr:href='data:_y.url'/>
<a class="Pager-next" expr:href='data:_y.url' rel="tag" hidefocus="true">
<data:_y.name/>(<data:_y.post-count/>)
</a>,
</b:with>
</b:if>
</b:with>
<a class="Pager-top" href='#lB' hidefocus="true" alia-hidden="true">▲ トップ</a>
<b:if cond='data:yi != 0'>
<b:with var='_y' value='data:data[data:yi - 1]'>
,
<link rel="prev" expr:href='data:_y.url'/>
<a class="Pager-prev" expr:href='data:_y.url' rel="tag" hidefocus="true">
<data:_y.name/>(<data:_y.post-count/>)
</a>
</b:with>
</b:if>
</b:if>
</b:loop>
</b:includable>
<b:includable id='navi_month'>
<b:loop values='data:data' var='y' index='yi'>
<b:loop values='data:y.data' var='m' index='mi'>
<b:if cond='data:m.url == data:blog.url'>
<b:with var='mlast' value='data:y.data count ( _m => _m.url != "" )'>
<b:if cond='data:mlast - 1 != data:mi'>
<b:with var='_m' value='data:y.data[data:mi + 1]'>
<link rel="next" expr:href='data:_m.url'/>
<b:if cond='data:_m.post-count != 1'>
<a class="Pager-next" expr:href='data:_m.url + "#" + data:_m.post-count' rel="tag" hidefocus="true">
<data:y.name/>-<data:_m.name/>(<data:_m.post-count/>)
</a>,
<b:else/>
<a class="Pager-next" expr:href='data:_m.url' rel="tag" hidefocus="true"><data:y.name/>-<data:_m.name/>(1)</a>,
</b:if>
</b:with>
<b:else/>
<b:with var='ylast' value='data:data count ( _y => _y.name != "" )'>
<b:if cond='data:ylast - 1 != data:yi'>
<b:loop values='data:data' var='_y' index='_yi'>
<b:if cond='data:yi + 1 == data:_yi'>
<b:with var='_m' value='data:_y.data[0]'>
<link rel="next" expr:href='data:_m.url'/>
<b:if cond='data:_m.post-count != 1'>
<a class="Pager-next" expr:href='data:_m.url + "#" + data:_m.post-count' rel="tag" hidefocus="true">
<data:_y.name/>-<data:_m.name/>(<data:_m.post-count/>)
</a>,
<b:else/>
<a class="Pager-next" expr:href='data:_m.url' rel="tag" hidefocus="true"><data:_y.name/>-<data:_m.name/>(1)</a>,
</b:if>
</b:with>
</b:if>
</b:loop>
</b:if>
</b:with>
</b:if>
</b:with>
<a class="Pager-top" href='#lB' hidefocus="true" alia-hidden="true">▲ トップ</a>
<b:if cond='data:mi == 0'>
<b:if cond='data:yi != 0'>
<b:loop values='data:data' var='_y' index='_yi'>
<b:if cond='(data:yi - 1) == data:_yi'>
<b:with var='mlast' value='data:_y.data count ( _m => _m.url != "" )'>
<b:with var='_m' value='data:_y.data[data:mlast - 1]'>
,
<link rel="prev" expr:href='data:_m.url'/>
<b:if cond='data:_m.post-count != 1'>
<a class="Pager-prev" expr:href='data:_m.url + "#" + data:_m.post-count' rel="tag" hidefocus="true">
<data:_y.name/>-<data:_m.name/>(<data:_m.post-count/>)
</a>
<b:else/>
<a class="Pager-prev" expr:href='data:_m.url' rel="tag" hidefocus="true"><data:_y.name/>-<data:_m.name/>(1)</a>
</b:if>
</b:with>
</b:with>
</b:if>
</b:loop>
</b:if>
<b:else/>
<b:with var='_m' value='data:y.data[data:mi - 1]'>
,
<link rel="prev" expr:href='data:_m.url'/>
<b:if cond='data:_m.post-count != 1'>
<a class="Pager-prev" expr:href='data:_m.url + "#" + data:_m.post-count' rel="tag" hidefocus="true">
<data:y.name/>-<data:_m.name/>(<data:_m.post-count/>)
</a>
<b:else/>
<a class="Pager-prev" expr:href='data:_m.url' rel="tag" hidefocus="true"><data:y.name/>-<data:_m.name/>(1)</a>
</b:if>
</b:with>
</b:if>
</b:if>
</b:loop>
</b:loop>
</b:includable>
<b:includable id='navi_day'>
<b:loop values='data:data' var='y' index='yi'>
<b:loop values='data:y.data' var='m' index='mi'>
<b:loop values='data:m.data' var='d' index='di'>
<b:if cond='data:d.url == data:blog.url'>
<b:with var='dlast' value='data:m.data count ( _d => _d.url != "" )'>
<b:if cond='data:dlast - 1 != data:di'>
<b:with var='_d' value='data:m.data[data:di + 1]'>
<link rel="next" expr:href='data:_d.url'/>
<b:if cond='data:_d.post-count != 1'>
<a class="Pager-next" expr:href='data:_d.url + "#" + data:_d.post-count' rel="tag" hidefocus="true">
<data:y.name/> <data:_d.name/>(<data:_d.post-count/>)
</a>,
<b:else/>
<a class="Pager-next" expr:href='data:_d.url' rel="tag" hidefocus="true"><data:y.name/> <data:_d.name/>(1)</a>,
</b:if>
</b:with>
<b:else/>
<b:with var='mlast' value='data:y.data count ( _m => _m.name != "" )'>
<b:if cond='data:mlast - 1 != data:mi'>
<b:with var='_m' value='data:y.data[data:mi + 1]'>
<b:with var='_d' value='data:_m.data[0]'>
<link rel="next" expr:href='data:_d.url'/>
<b:if cond='data:_d.post-count != 1'>
<a class="Pager-next" expr:href='data:_d.url + "#" + data:_d.post-count' rel="tag" hidefocus="true">
<data:y.name/> <data:_d.name/>(<data:_d.post-count/>)
</a>,
<b:else/>
<a class="Pager-next" expr:href='data:_d.url' rel="tag" hidefocus="true"><data:y.name/> <data:_d.name/>(1)</a>,
</b:if>
</b:with>
</b:with>
<b:else/>
<b:with var='ylast' value='data:data count ( _y => _y.name != "" )'>
<b:if cond='data:ylast - 1 != data:yi'>
<b:with var='_y' value='data:data[data:yi + 1]'>
<b:with var='_m' value='data:_y.data[0]'>
<b:with var='_d' value='data:_m.data[0]'>
<link rel="next" expr:href='data:_d.url'/>
<b:if cond='data:_d.post-count != 1'>
<a class="Pager-next" expr:href='data:_d.url + "#" + data:_d.post-count' rel="tag" hidefocus="true">
<data:_y.name/> <data:_d.name/>(<data:_d.post-count/>)
</a>,
<b:else/>
<a class="Pager-next" expr:href='data:_d.url' rel="tag" hidefocus="true"><data:_y.name/> <data:_d.name/>(1)</a>,
</b:if>
</b:with>
</b:with>
</b:with>
</b:if>
</b:with>
</b:if>
</b:with>
</b:if>
</b:with>
<b:if cond='data:di != 0'>
<b:with var='_d' value='data:m.data[data:di - 1]'>
,
<link rel="prev" expr:href='data:_d.url'/>
<b:if cond='data:_d.post-count != 1'>
<a class="Pager-prev" expr:href='data:_d.url + "#" + data:_d.post-count' rel="tag" hidefocus="true">
<data:y.name/> <data:_d.name/>(<data:_d.post-count/>)
</a>
<b:else/>
<a class="Pager-prev" expr:href='data:_d.url' rel="tag" hidefocus="true"><data:y.name/> <data:_d.name/>(1)</a>
</b:if>
</b:with>
<b:else/>
<b:if cond='data:mi != 0'>
<b:with var='_m' value='data:y.data[data:mi - 1]'>
<b:with var='dlast' value='data:_m.data count ( _d => _d.url != "" )'>
<b:with var='_d' value='data:_m.data[data:dlast - 1]'>
,
<link rel="prev" expr:href='data:_d.url'/>
<b:if cond='data:_d.post-count != 1'>
<a class="Pager-prev" expr:href='data:_d.url + "#" + data:_d.post-count' rel="tag" hidefocus="true">
<data:y.name/> <data:_d.name/>(<data:_d.post-count/>)
</a>
<b:else/>
<a class="Pager-prev" expr:href='data:_d.url' rel="tag" hidefocus="true"><data:y.name/> <data:_d.name/>(1)</a>
</b:if>
</b:with>
</b:with>
</b:with>
<b:else/>
<b:if cond='data:yi != 0'>
<b:with var='_y' value='data:data[data:yi - 1]'>
<b:with var='mlast' value='data:_y.data count ( _m => _m.name != "" )'>
<b:with var='_m' value='data:_y.data[data:mlast - 1]'>
<b:with var='dlast' value='data:_m.data count ( _d => _d.url != "" )'>
<b:with var='_d' value='data:_m.data[data:dlast - 1]'>
,
<link rel="prev" expr:href='data:_d.url'/>
<b:if cond='data:_d.post-count != 1'>
<a class="Pager-prev" expr:href='data:_d.url + "#" + data:_d.post-count' rel="tag" hidefocus="true">
<data:_y.name/> <data:_d.name/>(<data:_d.post-count/>)
</a>
<b:else/>
<a class="Pager-prev" expr:href='data:_d.url' rel="tag" hidefocus="true"><data:_y.name/> <data:_d.name/>(1)</a>
</b:if>
</b:with>
</b:with>
</b:with>
</b:with>
</b:with>
</b:if>
</b:if>
</b:if>
</b:if>
</b:loop>
</b:loop>
</b:loop>
</b:includable>
</b:widget>
<b:widget id='BlogArchive1' locked='true' type='BlogArchive' mobile='yes'> <b:includable id='main'> <b:if cond='data:blog.pageType == "archive"'> <b:loop values='data:data' var='y' index='yi'> <b:loop values='data:y.data' var='m' index='mi'> <b:if cond='data:m.url == data:blog.url'> <b:with var='mlast' value='data:y.data count ( _m => _m.url != "" )'> <b:if cond='data:mlast - 1 != data:mi'> <b:with var='_m' value='data:y.data[data:mi + 1]'> <a expr:href='data:_m.url' hidefocus="true"><data:y.name/>-<data:_m.name/>(<data:_m.post-count/>)</a> </b:with> <b:else/> <b:with var='ylast' value='data:data count ( _y => _y.name != "" )'> <b:if cond='data:ylast - 1 != data:yi'> <b:loop values='data:data' var='_y' index='_yi'> <b:if cond='data:yi + 1 == data:_yi'> <b:with var='_m' value='data:_y.data[0]'> <a expr:href='data:_m.url' hidefocus="true"><data:_y.name/>-<data:_m.name/>(<data:_m.post-count/>)</a> </b:with> </b:if> </b:loop> </b:if> </b:with> </b:if> </b:with> <b:if cond='data:mi == 0'> <b:if cond='data:yi != 0'> <b:loop values='data:data' var='_y' index='_yi'> <b:if cond='(data:yi - 1) == data:_yi'> <b:with var='mlast' value='data:_y.data count ( _m => _m.url != "" )'> <b:with var='_m' value='data:_y.data[data:mlast - 1]'> <a expr:href='data:_m.url' hidefocus="true"><data:_y.name/>-<data:_m.name/>(<data:_m.post-count/>)</a> </b:with> </b:with> </b:if> </b:loop> </b:if> <b:else/> <b:with var='_m' value='data:y.data[data:mi - 1]'> <a expr:href='data:_m.url' hidefocus="true"><data:y.name/>-<data:_m.name/>(<data:_m.post-count/>)</a> </b:with> </b:if> </b:if> </b:loop> </b:loop> </b:if> </b:includable> </b:widget>
Loop monster (T-T)...