Detail

Striped Tables

Striped Tables are a way to keep the information on within a table on your website nice, neat, and easy to read by programatically reversing each table row with an alternate color.

To create a striped table:

• On the page you want the table, click the "Add Content" button, and select "Reuse Content".
• In the "Title" box, type "StripeMe" and hit the search search button
• Choose "stripeMe zebra Auto Tables with JQuery" for a table without the need for dividing borders between each column and row (this is the standard choice unless your table content is very complicated and difficult to read).
• Choose "StripeMe Zebra Striped Tables Jquery Script with Borders" for a table that needs borders in between each row and column to separate it.
• Once you've chosen a script, leave that piece of content alone on the page. Create a new content block to insert your table, or open the content block that already has your table in it.
• In WYSIWYG mode, select the table you'd like to work with.
• In the toolbar above, choose the table tool (3rd row, 1st icon on the left).
• In the "Class" Field, change the dropdown box to say "(value)"
• In the box, type EXACTLY "stripeMe zebra." This can also be achieved in Code mode by putting class="stripeMe zebra" within the table tag.
• By clicking "Update" you have created a striped table. Each time you add a row to your table, the color will alternate between white and gray. If you mouse over a particular row, the color of the row will change to a little bit darker gray, making it even easier to read.

To create a heading row for your table:

• click on a cell within the row that you want to be the heading row.
• In the toolbar above, choose the "Table Row Properties" tool (3rd row, 2nd icon from the left)
• In the "Row in table part" field dropdown, choose "Table Head" and make sure that "Update Current Row" is selected from the dropdown at the bottom of the box. This can also be achieved in Code mode by changing the td tags surrounding the heading cells to th.
• Click the update button.

Striped Tables Looks Like This:

Statement	SKB	Mark	Amy
I own a dog.	no	no	yes
I am allergic to peppers.	no	yes	no
I drink orange juice.	yes	yes	no
I like Magic 93.	YES!!!!!	NO!!!!!	NO!!!!!
I have a Facebook account.	yes	no	yes
Tequila?	yes	hells yes	yes
I collect...

 

​



See it in action on a Marywood Department site!