Answer Finder
I’ve had some version of this site up and running since 2003, when I became frustrated with how difficult it was to search through previous columns I’d written for IMDb. 1
Unlike most blogs,2 many of the 1,000+ posts on this site are still highly relevant today. They’re answers to reader-submitted questions, and most of the questions haven’t changed. It’s often difficult to find these older entries, however, and the chronological blog format doesn’t help. I’ve struggled to find ways to make it easier to dig around.
The category archives at the bottom of (almost) every page are a start. Clicking on Education, for example, will take you to a listing of all the articles in that category, along with brand-new summaries — most of them written by Matt.
Another option is what I’m calling Answer Finder, which takes all the screenwriting-related entries and groups them together in a much more browsable interface. It’s an experiment, and your feedback is certainly appreciated. Two caveats:
There are known issues with Internet Explorer. In particular, the category box appears too far down the page. It’s a problem with IE’s box model, and if someone wants to grab the CSS and fix it, knock yourself out.
Some of the older entries have weird formatting, particularly with scrippets, because the specs have changed over the years. One by one, we’ll be going through old posts and fixing them. But if you see something wonky, feel free to note the URL in the comments to this post.
For the truly curious, here’s how Answer Finder works. (You’re welcome to look at the source, of course.)
Getting both categories and posts out of WordPress is more difficult than you’d think, which is why I’m happy to have found the plugin WP Categories and Posts.
I hacked the plugin to make it generate DIVs for each category.3
With a custom page template (an under-appreciated WordPress feature), I used jQuery to hide the DIVs, bind the category menu and place a session cookie to help you come back to the same place when navigating away.4
Let me know how the new page is working, or not working, over the next week. You may see periodic downtime or wonkiness while things get sorted out.
- Remarkably, they’re still running these, even though it’s been years since I’ve written a new one. ↩
- I’m using “blog” in the 2009 sense of a series of short posts arranged chronologically, newest first. That is: a blog is a blog because of the way it’s formatted, not because of the content per se. It’s easy to forget that the term blog originally referred to weblogs, or online personal journals. ↩
- When I say “hack,” I really mean it. It works because it works, not because I really understand it. PHP makes baby Jesus cry. ↩
- jQuery, by the way, is awesome. It lets a barely-programmer like me leverage a lot of CSS knowledge. And I have new respect for JavaScript, which is more Pythonic than I was anticipating. Given the speed boosts in the new Safari and Google Chrome, I’m looking forward to seeing what ambitious ideas will be coming down the pipe in 2009. ↩
Articles
March 2nd, 2009 at 11:57 am
Hey John, Have you looked at possibly using Drupal as the engine for your site? I’m just getting my feet wet in the Drupal world now but from everything I’ve seen it’s very robust and easier to configure than mambo or joomla. Yes it runs on php but with the number of pre-made modules out there you probably(hopefully?) wouldn’t need to touch it. Anyways, you might want to give it a look as a solution to your search/answer finder issue. Here’s a link http://drupal.org
Just out of curiosity, what do you like about jquery over other javascript libraries like the prototype/scriptaculous stack, mootools stack, or the yahoo yui stack?
March 2nd, 2009 at 12:18 pm
I originally found you through the Yahoo columns — thanks!
March 2nd, 2009 at 12:47 pm
Changing the “div.category” to “width: 368px” from 400px makes it fit in, but it looks a bit thin.
div.category { width: 368px; }
March 2nd, 2009 at 12:50 pm
The “if IE 7″ conditional was stripped out of my comment…
March 2nd, 2009 at 12:56 pm
Good work on the code. It’s cleaner than stuff I see from full time developers.
Tip: You can jQuery(function(){}) instead of jQuery(document).ready(function(){}). I find it easier on my eyes since I use it so much.
@Paul
In my experience, jQuery has the most elegant design. Its syntax is clean, it’s designed around plugins, and it doesn’t patch any core Javascript objects.
I haven’t done a recent comparison, but aesthetics aside, the other frameworks were larger and slower.
March 2nd, 2009 at 1:18 pm
“PHP makes baby Jesus cry.”
LOL. Good, then I don’t feel like less of a person for getting frustrated with it sometimes too.
March 2nd, 2009 at 1:24 pm
Hey John,
I think your AnswerFinder is a great idea. A couple suggests for your consideration:
I think a Search box would be very helpful. Also, Wordpress allows you to create a special “search.php” template that is called for search results, which you can customize like any other page specific template. I would suggest modifying it to give results like you’re seeing on the AnswerFinder — the post title and description — instead of the the standard running list of full posts.
I think a “John’s Picks” category would be nice. Maybe the top 5-10 articles you think would be most useful to aspiring screenwriters (possibly the ones you think everyone should read?).
I don’t love the cookie that keeps your spot. It’s a bit disorienting for a web UI, because you expect to see a fresh page on a new load. Maybe it’s just me, though.
Your categories list begs to be turned into a jQuery Accordion (http://jqueryui.com/demos/accordion/). Warning: jQuery UI is like crack to a web geek!
Great work, John.
March 2nd, 2009 at 1:25 pm
@Paul:
What sandovsky said. jQuery seems very clean and pretty compact/focused. But I haven’t really messed around with Prototype and the others. I’m sure they have selling points as well. I only wanted to learn one, and most of the recent momentum was swinging towards jQuery.
@Stardog:
I’d love to be able to give IE people the same sized column. If you want to Pastie what you’ve done, others can experiment.
@sandofsky:
Thanks, and I swapped out the ready handler.
For those who want to see a nicely-colored version of the jQuery, it’s here:
http://pastie.org/405133
March 2nd, 2009 at 1:28 pm
Coming down the pike? Yes? Turnpike?
March 2nd, 2009 at 1:32 pm
@Cybermoniker:
Pipe or pike:
http://eggcorns.lascribe.net/english/437/pipe/
March 2nd, 2009 at 1:51 pm
Gah, you probably don’t care. But -
You’re recreating the jQuery object unnecessarily at the tail end of your code there. temp is already a jQuery object, passing it in as the constructor just returns the object you’ve already got. Since you only call it once, I’d kill the object entirely. You don’t need it, you can just do jQuery(this) where you are doing jQuery(temp) now. (line 24).
If you do want to reuse the same selector over and over again in your code (like it looks like you started to do with the temp object), I always create the object just like you do, but start it with $, since that’s similar to the jQuery shortcut function. Anything with a $ in front of it in my code is just a repeatedly reused jQuery object.
You’re not using the $() shortcut. Sad. Once I got used to it, it made code much easier to read.
PHP does make baby Jesus cry.
March 2nd, 2009 at 2:06 pm
@Nima:
I switched search.php to use roughly the same layout as archive.php, and yup: much better. Thanks.
I have top picks in the sidebar of every page. They’ve probably become invisible to you.
Without the cookie, it gets really disorienting when you click through to read a full article. This restores the “normal” feeling of navigating back.
I am not a fan of the accordion, particularly for such long lists. But the jQuery UI is really impressive.
@Erik:
WordPress uses the $ for its own purposes/libraries, so most places highly encourage you to use the long version. For me, just learning, it’s also been helpful in reminding me when I’m using the library…
…without needing to, like in line 24. (Fixed). Thanks.
I’m sure I’ll be using the $ for the next project.
March 2nd, 2009 at 2:17 pm
You’re right John, my eyes don’t usually head that far East on your site. My bad.
Search results are now awesome, btw.
March 2nd, 2009 at 2:25 pm
I like it.
Also, it works great on Firefox for Linux, in case anyone cares.
March 2nd, 2009 at 2:30 pm
@Sandofsky & John: Those are good things to know about JQuery. My experience with javascript stacks has mostly been in the prototype/scriptaculous world. Since I’m getting into drupal development I’ll be looking into jquery more.
@everyone: I concur, PHP does indeed make the baby jeebus cry.
March 3rd, 2009 at 1:00 am
Sorry, what’s Pastie?
March 3rd, 2009 at 9:32 am
@Pristine:
Pastie is a site that lets you paste and share chunks of nicely-formatted code:
http://pastie.org
March 4th, 2009 at 12:14 am
Thanks John. I thought that you could actually paste the code and see the output in real time there.