envious Posted September 26, 2013 Share Posted September 26, 2013 Hi, Just wondering if anyone could advise some help for a site im working on.Basically this archive is obviously currently quite long: Im trying to cut it down so that all of the 2011 months are under one tab for example "2011" -once you click then the months show, same with 2012, and 2013 etc. Here is the current code, im using for the archive. T<div class="content archive"> <h3><?php echo _("Archive"); ?></h3> <ul> <?php $start = $month = strtotime('2011-10-01'); $end = strtotime(date('Y-m-d')); while($month < $end){ ?> <li class="archiveLink"> <p><a href="<?php echo URL ;?>blog/archive/love/<?php echo date('Y', $month); ?>/<?php echo date('m', $month); ?>"><?php echo _(date('F Y', $month)); ?><span>»</span></a></p> </li> <?php $month = strtotime("+1 month", $month); } ?> </ul> </div> Quote Link to comment Share on other sites More sharing options...
Ch0cu3r Posted September 26, 2013 Share Posted September 26, 2013 (edited) You'll need to do a loop within a loop and have a nested list. Example code <div class="content archive"> <h3><?php echo _("Archive"); ?></h3> <ul> <?php $startDate = strtotime('2011-10-01'); $endDate = strtotime(date('Y-m-d')); $startYear = date('Y', $startDate); $endYear = date('Y', $endDate); // loop through years for($year = $startYear; $year <= $endYear; $year++) { // calcuate start/end months $startMonth = ($year == $startYear) ? date('m', $startDate) : 1; $endMonth = ($year == $endYear) ? date('m', $endDate) : 12; $class = "archive$year"; $url = URL . "blog/archive/love/$year/"; // make new list item for year, enclose new list for months in year echo " <li>\n <a href=\"$url\">$year</a>\n <ul class=\"$class\">\n"; // loop through months for($month = $startMonth; $month <= $endMonth; $month++) { $_month = date('F', mktime(0, 0, 0, $month, 1, 0)); ?> <li class="archiveLink"> <p><a href="<?php echo URL . "blog/archive/love/$year/$month" ?>"><?php echo _($_month); ?><span>»</span></a></p> </li> <?php } // end enclosed month list echo " </ul>\n </li>\n"; } ?> </ul> </div> Edited September 26, 2013 by Ch0cu3r Quote Link to comment Share on other sites More sharing options...
envious Posted September 30, 2013 Author Share Posted September 30, 2013 thanks for this. Now i'm just trying to figure how to hide the months and only show them when you click the year.For example when you first visit the page the months are hidden, then when you click the year they drop down.any ideas? Quote Link to comment Share on other sites More sharing options...
Ch0cu3r Posted September 30, 2013 Share Posted September 30, 2013 (edited) You can add JQuery accordion effect with a few changes to my example code <div class="content archive"> <h3><?php echo _("Archive"); ?></h3> <ul id="archiveList"> <!-- Give parent ul id --> <?php $startDate = strtotime('2011-10-01'); $endDate = strtotime(date('Y-m-d')); $startYear = date('Y', $startDate); $endYear = date('Y', $endDate); // loop through years for($year = $startYear; $year <= $endYear; $year++) { // calcuate start/end months $startMonth = ($year == $startYear) ? date('m', $startDate) : 1; $endMonth = ($year == $endYear) ? date('m', $endDate) : 12; $class = "archive$year"; $url = URL . "blog/archive/love/$year/"; // make new list item for year, enclose new list for months in year echo " <li><div>$year</div>\n <ul>\n"; // <-- wrap year with a div // loop through months for($month = $startMonth; $month <= $endMonth; $month++) { $_month = date('F', mktime(0, 0, 0, $month, 1, 0)); ?> <li class="archiveLink"> <p><a href="<?php echo URL . "blog/archive/love/$year/$month" ?>"><?php echo _($_month); ?><span>»</span></a></p> </li> <?php } // end enclosed month list echo " </ul>\n </li>\n"; } ?> </ul> </div> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript"> // JQuery accordian $('#archiveList ul').slideUp(300); // on page load hide months (slides up) $("#archiveList > li > div").click(function(){ $(this).next().slideToggle(300); // clicking year slides months down }); $('#archiveList ul:eq(0)').show(); // make sure years stays visible </script> Edited September 30, 2013 by Ch0cu3r Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.