diplay products

Ye' old general discussion board. Basically, for everything that isn't covered elsewhere. Come here to shoot the breeze, shoot your mouth off, or whatever suits your fancy.
This forum is not for asking programming related questions.

Moderator: General Moderators

gisler87
Forum Newbie
Posts: 5
Joined: Fri Feb 19, 2010 11:43 am

diplay products

Post by gisler87 »

Hi,

I have been looking for a script or at least someone to point me in the right direction. I am trying to create a product page that will display essentially display 9 products. 3 columns with 3 rows. I want each cell to contain an image of the product as well as price as well as a link that will take the user to more details of the product.

I am not experienced with php but i am an experienced programmer in java and c++. My main problem is positioning of the products. Any help would be much appreciated.

Many thanks

Gisler87
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Re: diplay products

Post by pickle »

If you know you're only showing 9 products, you could use 2 nested loops. One to iterate from 0-2 to allow looping through the 3 rows, and an inner one to also iterate from 0-2 to loop through the columns in each row.
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
gisler87
Forum Newbie
Posts: 5
Joined: Fri Feb 19, 2010 11:43 am

Re: diplay products

Post by gisler87 »

yeah i have thought of that. i am just not sure of how i position these items so they are spaced out from each other. Would i use another loop so the picture would for instance be on top of the price and etc? should i simply use tables or is there a better method?

many thanks
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Re: diplay products

Post by pickle »

Tables is probably the best.
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: diplay products

Post by josh »

Do you want a pre-made solution or do you want to code your own? You can do it with CSS (no tables).. its possible but I'm no expert on front-end stuff.
User avatar
Jonah Bron
DevNet Master
Posts: 2764
Joined: Thu Mar 15, 2007 6:28 pm
Location: Redding, California

Post by Jonah Bron »

This is a situation in which you would use tables. The outer loop suggested by pickle would output <tr> tags, and the inner loop would output <td> tags, with the items inside it.

But if there is only nine, and they never change, you don't need to use PHP.
User avatar
flying_circus
Forum Regular
Posts: 732
Joined: Wed Mar 05, 2008 10:23 pm
Location: Sunriver, OR

Re: diplay products

Post by flying_circus »

I've been looking for alternatives to tables lately, so naturally, I whipped this up real quick.

Consider the following:

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <style type="text/css">
      #container {width: 326px;}
      #container div {border: 1px solid #5a5a5a; float: left; margin-bottom: 10px; text-align: center; width: 100px;}
      #container div + div {margin-left: 10px;}
      #container br {clear: both;}
    </style>
  </head>
  <body>
    <div id="container">
      <div>1</div> <div>2</div> <div>3</div> <br />
      <div>4</div> <div>5</div> <div>6</div> <br />
      <div>7</div> <div>8</div> <div>9</div> <br />
    </div>
  </body>
</html>
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: diplay products

Post by josh »

I think with with CSS magic you can get the div to display in "block" mode, and still wrap in a parent div, so no <br /> tags and scrolls fluidly. Maybe someone will come in and clarify.
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Re: diplay products

Post by pickle »

Tables aren't evil - if you've got tabular data, you should use tables & not have to rely on "CSS magic" ;)
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: diplay products

Post by josh »

Right, in this case we do not have tabular data though....
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Re: diplay products

Post by pickle »

A list of data about products? Seems pretty tabular to me.
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
User avatar
flying_circus
Forum Regular
Posts: 732
Joined: Wed Mar 05, 2008 10:23 pm
Location: Sunriver, OR

Re: diplay products

Post by flying_circus »

josh wrote:I think with with CSS magic you can get the div to display in "block" mode, and still wrap in a parent div, so no <br /> tags and scrolls fluidly. Maybe someone will come in and clarify.

I've learned just enough css to be dangerous, so if I can clean it up even more, I'd be interested as well.
User avatar
greyhoundcode
Forum Regular
Posts: 613
Joined: Mon Feb 11, 2008 4:22 am

Re: diplay products

Post by greyhoundcode »

Why not define divs holding the products as inline-tables with a width of 300px and of whatever specified height, floating to the left and with a margin-right of 20px (just for example). Then wrap 9 of these inside a block container of say 965px. No need for the <br/> tags.
User avatar
flying_circus
Forum Regular
Posts: 732
Joined: Wed Mar 05, 2008 10:23 pm
Location: Sunriver, OR

Re: diplay products

Post by flying_circus »

greyhoundcode wrote:Why not define divs holding the products as inline-tables with a width of 300px and of whatever specified height, floating to the left and with a margin-right of 20px (just for example). Then wrap 9 of these inside a block container of say 965px. No need for the <br/> tags.
Wow, that inline-table did the trick, thanks for the tip! I really need to pick up a book on this stuff...
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: diplay products

Post by josh »

Thanks greyhound. I also found this which gives some other starting points for experimentation. http://www.w3schools.com/css/pr_class_display.asp
Post Reply