Jump to content

PHP Listing Help.


envious

Recommended Posts

Hi, 

Just wondering if anyone could advise some help for a site im working on.

Basically this archive is obviously currently quite long: archive.png

 

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>
Link to comment
Share on other sites

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 by Ch0cu3r
Link to comment
Share on other sites

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 by Ch0cu3r
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.