Views 模組：自定一個按月彙整日期收合或展開日期列表功能

Views 內置了一個 Archives Default Views，但不能滿足需求。就像這位朋友需要一個 "按月彙整日期收合或展開日期列表功能"

有模組做嗎 ?? 不知。不過使用 Views 加上少許的 jQuery 還是能輕鬆達到效果，不花你十分鐘的時間。(** 文章最後附有 Views 2 Export Code)

首先看看 "月彙整日期收合或展開日期列表" 需要什麼：

• 按年份及月份區分
• 每一個 "年份及月份" 下列出該月份每天的文章
• 列出的文章包括了發表日期及標題連結

好了，我們簡單地建立一個 Views， 做一些很基本的設定，取出必要的 Fields。

由於我們要按年月份區分，所以 Node: Post date 需要自定日期格式：

其一個是： Y M
另一個是：d

唯一必要注意的是：我們要以年月日期來作群組：

假如你沒有設定錯誤，會看到相似的列表：

已經接近成功了!! 接下來是一些 CSS 及 jQuery Code

CSS 隨你喜歡了，我給了個參考：

.view-MonthlyArchives .views-field-created-1,
.view-MonthlyArchives .views-field-title { float:left; margin-right:10px}

.view-MonthlyArchives .view-content li,
.view-MonthlyArchives .view-content .item-list
 {clear:both}

jQuery Code：

$(document).ready(function(){
				
				var vMA = $('.view-MonthlyArchives').find('.view-content');
				$(vMA).find('ul').hide();
				
				 $(vMA).find('ul').each(function(){
					var li_count = $(this).find('li').length;
					$(this).prev('h3').append(' (' + li_count + ')');
					});

				$(vMA).find('h3').click(function() {
					$(this).next('ul').slideToggle('fast');
				});

			});

注意：.view-MonthlyAcrchives 是來自 Views 名稱的，你需要修改為正確的。

怎麼增加 jQuery Code ??

最簡單當然是直接貼在版型中啦。也可以另存新檔，在版型 .info 中增加：

scripts[] = scripts.js // 你的檔案名，然後再清除 CACHES 才有效果哦 !!
 

就是這麼簡單，最終效果：

假如你沒能做到，直接匯入 Views Export Code 看看。

附件檔案: 

Views 2 Export