PDA

View Full Version : results break my template


Anonymous
07-19-2005, 03:54 PM
Hi my site www.printingproducts.info i have just done/doing i have used the zoomsearch in, now the search works fine but the results break up my template is there a way to specify the width of the results as this seems to be the only problem any help
broman
07-19-2005, 05:40 PM
I would redesign the left and right side with a different table structure. I would break up the page into more tables.

Essentially have to one table on the top and one table for the bottom part of the page.


I was bored an re-wrote your page.



<html>

<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<meta name="generator" content="Adobe GoLive 5">
<title>Welcome to Adobe GoLive 5</title>
</head>

<body bgcolor="#ffffff">
<table border="0" cellpadding="0" cellspacing="2" width="194">
<tr>
<td>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>/images/printing_01.gif</td>
<td>
<table border="0" cellpadding="0" cellspacing="0" width="68" height="100%">
<tr>
<td>/images/printing_02.gif</td>
</tr>
<tr>
<td>/images/printing_04.gif</td>
</tr>
<tr>
<td>
<table border="0" cellpadding="0" cellspacing="0" width="180">
<tr>
<td colspan="3">/images/printing_05.gif</td>
</tr>
<tr>
<td background="/images/printing_06.gif">ppp</td>
<td background="/images/printing_06.gif">ppp</td>
<td>/images/printing_07.gif</td>
</tr>
<tr>
<td colspan="3">/images/printing_09.gif</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td valign="top">/images/printing_03.gif</td>
<td></td>
</tr>
<tr>
<td valign="top">
<table border="0" cellpadding="0" cellspacing="0" width="64">
<tr>
<td></td>
</tr>
<tr>
<td>Brother</td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
</table>
</td>
<td>
<table border="0" cellpadding="0" cellspacing="2" width="100%">
<tr>
<td>

<form method="get" action="/search/search.php" class="zoom_searchform">
Search for: <input type="text" name="zoom_query" size="20" value="hwejkqrghqwervgjodrgfjasdlkjsdkl" class="zoom_searchbox" />
<input type="submit" value="Submit" class="zoom_button" />
<span class="zoom_options">Results per page:
<select name='zoom_per_page'>
<option selected="selected">10</option>
<option>20</option>
<option>50</option>
<option>100</option>
</select>



Match:
<input type="radio" name="zoom_and" value="0" checked="checked" />any search words
<input type="radio" name="zoom_and" value="1" />all search words
<input type="hidden" name="zoom_sort" value="0" />
</span>
</form>
<div class="searchheading">Search results for: hwejkqrghqwervgjodrgfjasdlkjsdkl</div>

<div class="results">
<div class="summary">
9 results found.
</div>


</p>
[SNIP **** HUGE CHUNK OF CODE REMOVED. **** [SNIP]
</div><center>

Search powered by Zoom Search Engine (http://http://www.wrensoft.com/zoom/)</p></center>
</td>
</tr>
</table>
</td>
<td></td>
<td></td>
</tr>
</table>
</td>
</tr>
</table>


</p>
</body>

</html>
Ray
07-20-2005, 12:55 AM
You can specify the width of the search results using CSS.

The default search_template.html file contains CSS classes defined for each element on the search page. There is a class defined as ".results", so the following:


.results &#123; width&#58; 150px; &#125;

would set the search results to be within a width of 150 pixels. You can also use percentages here. Note that this needs to be specified within a <style type="text/css"> block if it is not already defined in your search_template file.

Take a look at this FAQ:
http://www.wrensoft.com/zoom/support/css.html

There are also other CSS classnames which you can "style" to change the appearance/layout of the heading, the search summary, result descriptions, etc.

Also refer to other CSS tutorials/guides online (there is one linked in the above FAQ) for other style attributes you can use (eg. margin, padding, etc.).