Tweet
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
-
-
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.
Code:<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>[img]/images/printing_01.gif[/img]</td> <td> <table border="0" cellpadding="0" cellspacing="0" width="68" height="100%"> <tr> <td>[img]/images/printing_02.gif[/img]</td> </tr> <tr> <td>[img]/images/printing_04.gif[/img]</td> </tr> <tr> <td> <table border="0" cellpadding="0" cellspacing="0" width="180"> <tr> <td colspan="3">[img]/images/printing_05.gif[/img]</td> </tr> <tr> <td background="/images/printing_06.gif">ppp</td> <td background="/images/printing_06.gif">ppp</td> <td>[img]/images/printing_07.gif[/img]</td> </tr> <tr> <td colspan="3">[img]/images/printing_09.gif[/img]</td> </tr> </table> </td> </tr> </table> </td> <td valign="top">[img]/images/printing_03.gif[/img]</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> [SIZE=1]Search powered by [URL="http://http://www.wrensoft.com/zoom/"][B]Zoom Search Engine[/B][/URL][/SIZE]</p></center> </td> </tr> </table> </td> <td></td> <td></td> </tr> </table> </td> </tr> </table> </p> </body> </html> -
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:
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.Code:.results { width: 150px; }
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.).Comment
Comment