CSS/PHP WordPress – 3 Column Ecommerce Search Results

[spate1y]

Hey Everyone!

I am creating a ecommerce website using WordPress for a school store (selling clothing and other spirit wear for their school).

Now I ran into a little issue with the search results page. The school would like the results page to have results in a 3 column layout sort of like (http://oldnavy.gap.com/browse/search.do … submit.y=8).

Any ideas on how I could do this?

[mizwo]

Do you mean three search results side by side? just give the results entries a fixed width and let them float. the smaller the width the more are shown side by side.

[spate1y]

So do I just repeat the search result code for WordPress side by side?

If you could give me an example of WP site that does this or show me an example of the code, that would be nice.

[mizwo]

goto your search.php within your theme directory and edit the following line

Code:

>

to

Code:

>

this way you add another class (with the predefined classes for posts) to your search results.
now you can define a new class, something like this:

Code:

.boxed-search-result {
width: 150px;
height: 150px;
float: left;
}

within the default kubrick theme, this way, 3 results are shown side by side. sure you should include like only the title, an image and the price instead of the "comments" and "posted in" links and the creation date, but thats up to you =)

[Author]

Posts