Tables

Step-by-Step Instructions

1. Click the edit link at the top of the page
2. Move your cursor where you want to place the component.
3. Click the plus icon.
4. Select Table from the menu
    

Content 

1. Add a Title Caption (optional).
2. Add table content.
   Note: The table will properly display HTML code added to the cells. Only basic HTML code should be used such as adding a URL.
3. Add a single row at a time.
4. Expand the Change number of rows/columns if you would like to add multiple rows and columns at once.
5. Change the table size as needed.
6. Click Rebuild Table.
   Note: When you rebuild the table any content already added will not be lost unless you remove the cells.
7. The Table Component can accept some basic HTML code. Below is the code that the Table can accept. You must follow accessibility standards when using HTML code
   1. <b> Bold text</b>
   2. <i>Italic text</i>
   3. <a href="https://www.medschool.ucla.edu">Sample Link</a>
   4. <a href="mailto:email@sample.com"target="_blank"> Sample Email </a>
   5. <a href="tel:5556667777"target="_blank">Call us at 555-666-7777</a>
8. Expand the Import from CSV if you would like to upload a CSV file to complete your table.
9. Click Choose file and select the file from your computer.
10. Click Upload CSV.

Styles

1. Toggle to the Styles tab.
2. Select the appropriate Layout Option based on your desired layout.  (see below for examples).

Save

1. Click Save.
2. Scroll to the top of the page and click Save.
3. Click the Done button beside the save button.
   Note: This will display the page in the closest representation of how site visitors will view it. All links and actions that are disabled in editing mode will be functional now.

Style options 

1. Layout Options settings used to create this component are: Table type: Default 
    

2. Layout Options settings used to create this component are: Table type: No Border 
    

3. Layout Options settings used to create this component are: Table type: Hover
    

4. Layout Options settings used to create this component are: Table type: Striped
    

5. Layout Options settings used to create this component are: Table type: Primary
    

5. Layout Options settings used to create this component are: Table type: Primary hover
    

5. Layout Options settings used to create this component are: Table type: Primary striped