Tables: Adding and Editing
This page covers
- Insert a default table
- Plain bordered Table
- Striped bordered Table
- Change table width
- Insert or delete rows and columns
Insert a default table in a label
Note: The default Moodle table displays without borders or stripes (it's not pretty in other words), it is recommended that after adding a table you add a table style, see the bottom of this entry for options.
- Add a or Edit an existing text and media area.
- Click the insert table icon in the label's text editor toolbar. A pop up window will open.
- Insert the number of columns and rows you want, and click Create.
- To add text to the table, place your cursor in a cell of the table and start typing.
- Remember the wonderful people in the LII Team are there to help, so before you get frustrated drop us an line,
- Or if you are keen try your hand at one of these:
Plain bordered Table
Note: requires basic HTML editing.
To add table with a plain border
- Click the HTML icon in the label's editing toolbar .
- Add the code below (for a table 2 rows x 2 columns)
- Exit HTML code edit mode.
- Edit the text in the table.
<table class="table table-bordered">
<tbody>
<tr><td>text</td><td>text</td></tr>
<tr><td>text</td><td>text</td></tr>
</tbody> </table>
text | text |
text | text |
Striped bordered Table
Note: requires basic HTML editing.
To add a striped table
- From the course page, edit a label.
- Click the HTML icon in the text editor toolbar .
- Add the code below (for a table 3 rows x 2 columns)
- Exit HTML code edit mode.
- Edit the text in the table.
<table class="table table-striped table-bordered">
<tbody>
<tr><td>text</td><td>text</td></tr>
<tr><td>text</td><td>text</td></tr>
<tr><td>text</td><td>text</td></tr>
</tbody> </table>
text | text |
text | text |
text | text |
Change table width
To adjust the width of a table
- Edit the label the table is housed in.
- Click on the HTML edit icon in the text editor toolbar .
- Find the first line of HTML code for the table (it starts <table....)
- Add a width value OR change the width value to reflect your desired width.
- Exit edit HTML mode.
<table class="table table-bordered" style="width:50%">
50% width |
---|
1 |
2 |
<table class="table table-bordered" style="width:350px">
350px width |
---|
1 |
2 |
Insert or delete rows and columns
- Click in the row or column that you want to delete or insert a column or row after
- Click on the table edit icon in the text editor toolbar .
- From the menu select the option you wish to apply to the table.
Last modified: Wednesday, 3 July 2024, 9:52 AM