Popular content
- New external links filter for Drupal
- SimpleFeed
- Drupal Behavior to Fix IE6 CSS Background Image Flickering
- SimpleFeed 1.0 ships!
- How often do you change your oil? Maybe too often...
- Getting Drupal to Play Nice with Your CDN
- Going to London tomorrow!
- I have left Lullabot...
- Location data with Drupal
- myLifetime Community Launches
Creating an Alpha Pager with Views 2 and Drupal 6
UPDATE: Earl comments below how this is already built in. Two different ways to achieve a similar result, each with their own pros/cons.
Hats off to Earl Miles and the rest the views developers they have done a tremendous job with Views 2. While the interface is entirely different from that of Views 1, it is so much more intuitive that within a few minutes I had quickly forgotten my bewildered “oh no, I know nothing” look :)
From reading all of the docs and quietly watching development commits, I knew Views 2 was going to eliminate a lot of the Views 1 helper modules and open up a whole new world of awesomeness. While I haven’t seen many blog posts detailing just which functionality/modules have been replaced with Views 2, I wanted to kickstart things with my own discovery as I played around with Views 2 quite thoroughly this afternoon.
With Views 1, to build an alpha pager you would use the views alpha pager module in conjunction with your view. But what about Views 2?
Well it’s not so straightforward. I read somewhere about some sort of “glossary” view, but how could that be used to create an alpha pager? Well turns out, quite easy. Here’s how:
- First, create a new page view and set your path to “directory”
- Assuming you want your pager to be based on the nodes title, add in an argument: “Node: Title”
- Set title equal to: “Directory: %1”
- Action to take if argument is not present: “Display all values”
- Check “Glossary Mode”
- Set character limit to “1”
- Case: “upper case”
- Case in path: “lower case”
- Save and update
- Add in a header under basic settings
- Set up your alpha pager:
Note: if you have PHP filter enabled, you can set up proper links using l(), otherwise use basic HTML
- <div class="alpha-pager">
- <a class="alpha-page" href="/directory/a">A</a>
- <a class="alpha-page" href="/directory/b">B</a>
- ...
- </div>
And voilá! You can now browse by starting letter of each node. Add in a few more exposed filters like taxonomy terms or search and you have a powerful directory!
That was definitely easy and Views 2 replaces its first helper module. What’s next? :)
26 comments
All other content, unless where noted, ©2010 Theodore Serbinski. All Rights Reserved.
Well that’s cheating.
Did you look at the default ‘glossary’ view? It uses 2 displays within the view to provide a real alpha pager at the top, using argument overrides to set up subtly different arguments. It is the first example of how awesome attachment displays can be.
Cheating huh? I didn’t know about attachment views ;-) But yes, I didn’t see the glossary view and looking at that, very awesome.
However, I am still set on my method above since it provides full control over the actual outputted menu. I want a very clean A-Z, with no #s needed and no funky characters, seeing some listed for " guessing could still be a minor bug.
I see the advantages to both approaches though, each serving different needs. I’m very pleased with how flexible Views 2 is to accommodate all sorts of awesomeness.
It’s worth noting that both the separator and the #s are options in the summary style (click the gear icon next to the summary style on the attachment view) and like all styles, it’s a plugin so it’s super easy to code up alternatives.
If you’re getting ‘‘s that could mean that you have records that have no title, perhaps? Perhaps an additional filter might be necessary to remove those records.
Earl, yes even more good points. Clearly there is lots to explore with Views 2, rock! :)
It even looks like images can be added as separators.
I’m using Views2 and do not get the glossary option anywhere. Is this something that’s specific to the dev version?
OK, worked it out now – Glossary mode is a checkbox that is only available within the Arguments setting. Thanks for this tutorial! :)
Where do I set the directory path?
Where do I set the path? As in “First, create a new page view and set your path to “directory”
Okay I figured out the path part, but couldn’t get this to work.
Seriously, has anyone gotten this to work? I’ve followed the instructions to a “t” and all I get is
“
* Display Defaults uses fields but there are none defined for it or all are excluded. * Display Page uses fields but there are none defined for it or all are excluded.“
To Ted and Earl: thank you both. This post was profoundly useful.
I agree that this will get most users 98.32% of the way there, but my boss is a stickler and the default formatting of the separators (yes, Earl, even as modified as much as the system currently allows) will not quite suit him, so I’ll have to, er, “cheat” after all…
Still, it’s nice to know what’s under the hood. Thanks again.
Guys, Thanks for this excellent tutorial. Thanks to you I’m now enjoying the power of Views2 now. I have a question though…
Do you know if there’s a way to enable alpha paging for different fields, depending on the current sort field?
My view has different fields I’d like to be able to alpha page on (last name, first name, etc). Using the arguments and attachment method, I get the nice alpha paging for one field (last name).
When the user selects a different field for sorting (first name), i’d like to have the alpha paging work for that field.
My first idea would be to have additional pages that are sorted by each field, and using that field as an argument for the attachment. Then I’d need to switch between the pages somehow.
Does this make sense? Thanks for any assistance. -Phillip
@sjpatrick glad to help :)
@Phillip to achieve that you can’t hardcode like above. You’re going to need to work some PHP & argument handling for sure. Sounds like you’re going down the right track!
Can you make a nice little tutorial like this one, but with the not-cheating method of working?
thnks
I’ve been following the ‘not cheating’ way of doing this, and I’m so close I can smell it…. but not quite.
I set up a view with 2 displays, one page and one attachment, sorted by node:title. The page view looks just fine. On the attachment view, I created the argument on node:title, override…... Action to take if argument not present: summary sorted ascending. Glossary mode on Character limit 1 Case:upper case Case in Path: lower case
Then on the next screen, Separator ‘ |’ inline no formating
Now I get a nice alpha pager at the top of my page. But it doesn’t do anything. I tried adding %1 to the argument title, but that didn’t change anything.
I’m sure by now, anyone reading this can tell that I’m a novice with views. I’m sure that I’m missing something fairly basic and obvious. Any suggestions?
Thanks.
Try enabling the default “glossary” view and looking at how that is structured and updating yours. Probably easiest way to see what you’re missing.
Thanks! I was so deep into the views edit screen I didn’t see that option on the views list.. Forest <-> Trees
Ted, thanks for a great tutorial. I love discovering nifty views features! And your tutorial was very easy to follow, thanks for taking the time to put it together.
Vonn, your added comments were also a great help. I’d just add one little option to your outlined suggestions to get things to work even more sweetly… For the view attachment I set “Inherit Arguments” to “No” and was able to get the alpha pager to stay at the top no matter what letter was currently selected.
How would you set up a alpha pager when you use a view that organizes by taxonomy term name as an agrument. So all annual plants will display in a list if I create a link to plants/annual. the value in the vie for the page is plants/[term-name] with term-name as the argument
The view sorts the lists by Title.
How can I make those lists of items in taxonomy categories display with an alpha pager?
Hi guys,
Here a module that does the trick without tweaking: http://drupal.org/project/vocabindex
Best, iA
I seem not to know where to set the path….still confuses me…please Help
vacabindex module (drupal 5/6)
Once installed you can setup the path here: admin/build/vocabindex
Best, iA
cloning the
Default Node view: glossaryWill do the trick… _
All you have to do is make a little changes on the arguments and fields depending on what you want…
_
The default glossary view in views 2 does not work, the number and alpha pager at the top does nohting.
This tutorial also does not work for me because the pager is accessing “http://www.mysite.com/directory/” when the page is actually located at “http://www.mysite.com/index.php?q=directory/”
The first URL results in a 404 not found.
I do not have clean URLs turned on, my server doesnt support them.
thankyou so much and for those who can’t quite be bothered to fill in the dots:
Add your comment