Question about inserting a line on the Advanced search page

Posted on August 31, 2008 by 00005095

Incident code 16384-45630 reported 7/30/2008
We are considering making the “Advanced” search page our default search page and would like to make a couple of adjustments to it. Is it possible to insert a line between the search boxes and all the refining options at the bottom of the page? We like having all the limit options there on that page, but we also want to somehow convey that the use of those is optional. Also, is there any way to move the search button on that page up closer to where the user enters search terms? Because it is at the bottom of the page, users need to scroll to use it and we think its current position may cause them to think they have to place some kind of limits before they can search on that page. Thank you. Toni Nolen
7/31/2008 2008
11:41 PM Hi Toni,

I would suggest you add more white space via CSS styling. The problem with the current HTML is that it would be tricky to come up with a CSS selector that would allow you to add a margin to only the top of the “limits” section of the Advanced Search page without affecting anything else. (This is, in my experience, unusual–most of our pages are designed such that specific selectors are built in or easy to generate. There just doesn’t happen to be a unique one for the limits area of this page.) The easiest way to work around this would be to wrap all of the limits in one

. You could then give that div an ID of something like “limitsArea” and add the following lines to …/[skin]/css/searchAdvanced.css:

#limitsArea {
margin-top: 20px ;
}

…or however you would like to style it; the above will add 20 pixels of blank space above the limits section.

The problem then becomes how to wrap the limits section in its own

. As I mentioned over the phone, one of the slick things about XSL is that you can just add static HTML into the rest of the markup and it will work perfectly. The difficulty (if you’re not too familiar with XSL) becomes finding the place in the markup to add your HTML. Fortunately, the WebVoy??ge Architecture Overview and Configuration Models contains instructions on how to do so as part of its tutorial to hide/unhide limits. This is in Chapter 11. Have a look specifically at p. 11-5 of that guide. It shows how to add a call to custom javascript, a div, and a hyperlink to the limits area. You can pretty much ignore the javascript and hyperlink and just note where in cl_searchAdvanced.xsl it tells you to edit–that’s where you’ll add your new
.

Of course, the other option would be to just follow that tutorial. Hiding and unhiding the limits behind a label of “Click here for more search options” creates a much cleaner initial search page.

I assume you’ll want to forward this message to your web developer (if you don’t want to make the changes yourself). If you or he has any questions, don’t hesitate to let me know. If you manage to make it work like you want, update me and we can close this incident. Either way, you can give us a call or update this incident via eService.

Best,
John Larson

7/30/2008 OPAC team decided not to pursue this advanced page customization

This entry was posted in Look and Feel. Bookmark the permalink.