Support » Fixing WordPress » How to present a list in WP that I currently generate in HTML

  • Resolved daSpud


    I currently display a list of items on our HTML based website. We are moving to a WP based site and I would like to do the same thing. I generate the code for each list item from a program so it is easy to change, but I need to know WHAT to change it to.

    Here is the HTML for 2 lines with alternating colors. I am not an HTML or CSS or PHP or any other alphabet soup wizard. Someone else came up with this and they are now gone (hence the move to WP). Thanks in advance for the help.

    <TABLE ALIGN="center" BORDER=1>
    <TD ALIGN=center>
    <INPUT TYPE=checkbox NAME=item1A VALUE="1-Item&nbsp;1:&nbsp;&nbsp;Bulk&nbsp;D&nbsp;&nbsp;Barley,Organic,Pearled,&nbsp;&nbsp;(25lb)*29.75$&nbsp;20%"></TD>
    <TD ALIGN=center>1</TD>
    <TD>Item 1:   Bulk D  Barley,Organic,Pearled,  (25lb) </TD>
    <TD ALIGN=right>$29.75</TD>
    <TD ALIGN=right>20%</TD><TD ALIGN=center>1</TD></TR>
    <TD ALIGN=center>
    <INPUT TYPE=checkbox NAME=item2A VALUE="2-Item&nbsp;2:&nbsp;&nbsp;Bulk&nbsp;H&nbsp;&nbsp;Organic&nbsp;Garbonzo&nbsp;Beans&nbsp;(25lb)*59.75$&nbsp;18%"></TD>
    <TD ALIGN=center>2</TD>
    <TD>Item 2:   Bulk H  Organic Garbonzo Beans (25lb) </TD>
    <TD ALIGN=right>$59.75</TD>
    <TD ALIGN=right>18%</TD><TD ALIGN=center>1</TD></TR>
Viewing 12 replies - 1 through 12 (of 12 total)
  • If you create a Page or Post in WP and switch to the ‘Text’ mode (as opposed to ‘Visual’), then paste in the HTML, it should work.

    That was what I thought might happen, but it very nicely reproduced the pasted text and not the desired list.

    Are you sure that you switched from ‘Visual’ mode to ‘Text’ mode before you pasted the HTML?

    Well I thought I had, but it appears that I did not. Your suggestion was spot on. Thank you very much.

    If your problem has been solved, please use the dropdown on the right to mark this topic ‘Resolved’ so that anyone else with a similar question can see that there is a solution.

    Wow, the Visual display is close to what I want and when I preview it the columns got very much narrower.

    Strange how the visual and preview are SO far apart….

    I need to learn how to make a table.

    In the Visual the columns are sized pretty much proportionally to their content. In the Preview they are all the same size so the text becomes many lines to fit.

    I presume there is a way in HTML to specify something about the width of a column as a percent of the entire width?

    There is a lot of good stuff there. Thanks!

    I used their CSS tryit and the table comes out exactly as I wanted it, but it doesn’t happen that way with WP. I took the code from the WP page and pasted it there.

    <table border="1" align="center" Width="100%" CELLPADDING="2" CELLSPACING="2">
    <tr bgcolor="#FFFFFF">
    <td width="5%" align="left"><input type="checkbox" name="item1A" value="1-Item 1:  Bulk D  Barley,Organic,Pearled,  (25lb)*29.75$ 20%" /></td>
    <td width="5%" align="left">1</td>
    <td width="60%" align="left">Item 1: Bulk D Barley,Organic,Pearled, (25lb)</td>
    <td width="10%" align="right">$29.75</td>
    <td width="10%" align="right">20%</td>
    <td width="10%" align="center">1</td>
    <tr bgcolor="#AAAAFF">
    <td align="left"><input type="checkbox" name="item2A" value="2-Item 2:  Bulk H  Organic Garbonzo Beans (25lb)*59.75$ 18%" /></td>
    <td align="left">2</td>
    <td>Item 2: Bulk H Organic Garbonzo Beans (25lb)</td>
    <td align="right">$59.75</td>
    <td align="right">18%</td>
    <td align="center">1</td>

    Here is the mystery page:

    The problem is with the CSS in /wp/shop/case-lots. You can override this with CSS in style.css.

    You should create a Child theme to make your changes. If you do not, all of your changes will be lost if you update your theme.

    Try adding a class to your table (like class=’case-table’, and then add this to the end of your child theme’s style.css: td {
       padding: 10px 4px;
       line-height: 1em

    You will also need to change the width of the text column to 60 and the width of the price column to 15 to allow for the cents.

    Thank you again for your help. It worked perfectly. To make room for the fields, I reduced the font size by adding font-size:12px; to the table class.


Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘How to present a list in WP that I currently generate in HTML’ is closed to new replies.