Snazzy-Archives, Filtered

Earlier this year, I got seri­ous about the post archives here at Netninja.com.  I added meta­data for sev­eral years worth of posts.  Partly this was me being anal-retentive and partly this was to facil­i­tate bet­ter search­ing, brows­ing, and match­ing related posts.  This was a suc­cess­ful project, but exposed what I believe to be a defi­ciency in Word­Press: Although search­ing and serendip­i­tously falling into related posts is easy, there is no easy way to browse sev­eral years worth of posts.

I ini­tially used Clean Archives Reloaded for brows­ing old posts.  As I under­stand it, Clean Archives Reloaded was writ­ten by a Port­land local.  This worked fairly well, but didn’t play well with the wp-typography plu­gin I use.  Wp-typography takes text and replaces reg­u­lar quotes with smart quotes, pro­motes com­bi­na­tions of dashes to fancy em– and en-dashes and what­not.  With the size of my archives, the web server croaked due to mem­ory usage.  I patched wp-typography to ignore this page, but every time I upgraded the plu­gin, my changes would get over­writ­ten and I would inevitably for­got to re-edit the rel­e­vant files, leav­ing my archives broken.

I finally gave up and started explor­ing other options.  Snazzy Archives looked rather nifty.  I tried it out and it… mostly worked.  Due to the size of my archives, it took for­ever to gen­er­ate the page.  The browser chugged along try­ing to dis­play it.  I would often get Error 500 from my web host due to the server load of gen­er­at­ing the page.

snazzy-archives

This plu­gin uses a short­code to invoke: [ snazzy-archive ] (with­out the spaces — I did not want to invoke the archive here).  You sim­ply cre­ate a page, add that short­code to the page, and it gets replaced by the fancy archive. 

What I ended up doing was hack­ing the plu­gin so that the short­code takes an optional “fil­teryear” argu­ment.  If miss­ing, all years are dis­played.  If present, the results are fil­tered to just that year.  In this way, I can cre­ate sep­a­rate pages for 2001, 2002, 2003, and so on.  This makes the ren­der­ing, dis­play, and pre­sen­ta­tion much more man­age­able.  It can then be invoked with: [ snazzy-archive filteryear="2008" ]

The patch is down below, for those that care.  I will be sub­mit­ting it to the author soon.  My next step is to fig­ure out the CSS enough so that the miss­ing right-hand mar­gin on the archive pages can return.

*** snazzy-archives-original/snazzy-archives.php	2009-08-28 04:37:48.000000000 -0700
--- snazzy-archives/snazzy-archives.php	2009-11-28 19:03:38.000000000 -0800
***************           function ScriptsAction()
*** 117,123 ****
            }
            function delete_cache()
            {
!               @unlink($this->cache_path . "snazzy_cache.htm");
            }

            // Handle our options
--- 117,129 ----
            }
            function delete_cache()
            {
!               if(!$dh = @opendir($this->cache_path))
!                   return;
!               while (false !== ($obj = readdir($dh)))
!               {
!                   if ((strstr($obj, "snazzy_cache.htm") !== false) || (strstr($obj, "snazzy_cache-") !== false))
!                       @unlink($obj);
!               }
            }

            // Handle our options
***************           function createflashcode($tagc
*** 281,289 ****
                return $flashtag;
            }

!           function display()
            {
                global $wpdb;

                $options = $this->get_options();

--- 287,299 ----
                return $flashtag;
            }

!           function display($atts)
            {
                global $wpdb;
+               extract( shortcode_atts( array(
+                   'filteryear' => '0',
+               ), $atts ) );
+               $filteryear = floor($filteryear);

                $options = $this->get_options();

***************           function display()
*** 299,305 ****

                if ($cache) {
                    // cache part
!                   $data = @file_get_contents($this->cache_path . "snazzy_cache.htm");

                    // return the cache data if it exists
                    if ($data)
--- 309,315 ----

                if ($cache) {
                    // cache part
!                   $data = @file_get_contents($this->cache_path . "snazzy_cache-" . $filteryear . ".htm");

                    // return the cache data if it exists
                    if ($data)
***************           function display()
*** 316,322 ****
                        $oby = 'YEAR(post_date) DESC, post_date ';
                    else
                        $oby = 'post_date DESC ';
!                   $query = "SELECT * FROM $wpdb->posts WHERE post_status = 'publish' AND post_password = '' AND post_type IN ($types) ORDER BY " . $oby;

--- 326,335 ----
                        $oby = 'YEAR(post_date) DESC, post_date ';
                    else
                        $oby = 'post_date DESC ';
!                   $query = "SELECT * FROM $wpdb->posts WHERE post_status = 'publish' AND post_password = '' AND post_type IN ($types) ";
!                   if ($filteryear != 0)
!                       $query .= " AND post_date >= '" . $filteryear . "-01-01 00:00:00' AND post_date <= '" . $filteryear . "-12-31 23:59:59' ";
!                   $query .= "ORDER BY " . $oby;

***************           function display()
*** 428,433 ****
--- 441,448 ----
                    $day = date('d', $date);
                    $month = date('M', $date);
                    $year = date('Y', $date);
+                   if (($filteryear != 0) && ($year != $filteryear))
+                       continue;

                    $imageurl = "";
***************           function display()
*** 448,453 ****
--- 463,469 ----
                            $backgroundImagename = $post->ID . '-' . md5($imageurl);

                            // If image already downloaded then use it otherwise download it
+                           $oldError = error_reporting(0); //suppress errors for 404s in offsite images (users shouldn't be hotlinking images, but still....)
                            if (is_file($this->images_path . $backgroundImagename)) {
                                $imageurl = $backgroundImagename;
                            } else if (false !== file_put_contents($this->images_path . $backgroundImagename, file_get_contents($imageurl))) {
***************           function display()
*** 456,461 ****
--- 472,478 ----
                            } else {
                                $imageurl = "";
                            }
+                           error_reporting($oldError);
                        }
                    }
                    // get comments from WordPress database
***************           function display()
*** 586,592 ****

                if ($cache)
                    // write cache
!                   @file_put_contents($this->cache_path . "snazzy_cache.htm", $result);

                return $result;
            }
--- 603,609 ----

                if ($cache)
                    // write cache
!                   @file_put_contents($this->cache_path . "snazzy_cache-" . $filteryear . ".htm", $result);

                return $result;
            }

{ 1 trackback }

Snazzy-Archives, Filtered — Netninja.com
November 28, 2009 6:37pm at 6:37 pm

{ 5 comments… read them below or add one }

1 rob November 29, 2009 7:42am at 7:42 am

The side­bar seems to be miss­ing from the html com­pletely on the archives page.  If that is what you are going for and you just want to have the white expand­ing to your edge try this:

.archives #con­tent { width: 100%; }

depend­ing on where you put this you may need an !impor­tant in there.

This causes a prob­lem on your actual archive pages though.  It will cause them to have a scroll­bar to see the rest of the con­tent… which is pretty user hos­tile with­out some­thing like this http://flowplayer.org/tools/scrollable.html

Reply

2 Brian Enigma November 29, 2009 9:44am at 9:44 am

I turned off the side nav­i­ga­tion on that page to make more room for the archives.  I did it the lazy way with CSS because I don’t want to have to hack the Word­Press theme I’m using (and later re-hack it when a new ver­sion comes out) so you might see it appear briefly, then disappear.

I’m pretty sure I poked “width:100%” in to sev­eral dif­fer­ent divs with Firefox/Firebug and really couldn’t get it to work right.  That took it to window-width, not content-width.  I had to keep it at “width:auto” for it to expand to the size of the con­tent.  I’m pretty com­fort­able with the hor­i­zon­tal scrolling right now.  It uses the browser window’s scroll­bar.  Doing a div with a max-width and overflow:scroll was another alter­na­tive, but seemed less user-friendly because the scroll­bar is tied to the page some­where, not to the browser win­dow, so could very eas­ily be off-screen.

My main con­cern right now is that every page has mar­gin on the left and right side where you can see the wood back­ground — except the archives page.  The white con­tent back­ground runs right to the edge of the page, mak­ing it feel a lit­tle bit janky.  Come to think of it, maybe I just have to go in and poke “width:auto” into all the par­ent divs?

Reply

3 rob November 29, 2009 12:04pm at 12:04 pm

When I apply
.archives #con­tent { width: 100%; }
with fire­bug i get: http://www.ubuntu-pics.de/bild/32630/screenshot_136_XAqUyC.png

Now this doesn’t really help on your actual archive pages.  If you take away the fixed width on the #con­tainer you will not be able to cen­ter it with the mar­gin: 0 auto;

You might want to just over­ride #con­tainer on those archive pages.  Try adding a body class instead doing indi­vid­ual body classes like ‘2003-archives’ and use that to over­ride the styles on those pages. 
.your_added_body_class #con­tainer { width: auto; }

Reply

4 Brian Enigma November 29, 2009 12:28pm at 12:28 pm

Oh!  I almost com­pletely for­got the main nav­i­ga­tional “you only clicked on the tab with­out select­ing an indi­vid­ual year, or you have JavaScript dis­abled so you don’t get the drop­down” page.  That was acci­den­tally using the wide-no-sidebar tem­plate, when it’s just fine with the reg­u­lar tem­plate.  (That was left over from me pre­vi­ously mess­ing around with putting all years on a sin­gle gigan­tic page.)

I can try over­rid­ing the #con­tainer (and pos­si­bly other nested ele­ments) on just the wide-archive pages.  I’m also learn­ing how to hook the wp_head action so that I can add the CSS for that tem­plate at the header rather than at the footer (so I don’t get that brief glimpse of the side­bar before the over­rid­ing CSS makes it dis­ap­pear), which has been bug­ging me.

Reply

5 rob November 29, 2009 12:16pm at 12:16 pm

oh also on archive pages you will have to adjust your padding on the #page element:

.your_added_body_class #page { padding:2.2em 0; }

That kills the wood on the left side com­pletely.  Although this isn’t ideal… it might look bet­ter than how it is now.

Reply

Leave a Comment