How do I add and edit a table?

How do I add and edit a table?

When you're in Loree, and you want to add a table to your content, just click on the "Table" option in the elements section:


It will pop up a friendly little window where you can tell it how many rows and columns you want, and even add some headers and captions for your table, as you can see here:

After you've provided all the necessary information in the window, simply click on the "Add Table" button, and you'll see a new table magically appear in your editor, perfectly tailored to your specifications.

As for our current setup, we've got a variety of preset options in the secondary element area. But here's the exciting part: in our new and improved system, there won't be a separate section for these table options. Instead, when you click on the table icon in the elements section, a user-friendly popup will greet you. Within this popup, you can effortlessly specify the number of rows, columns, include column and row headers, and even provide a caption for your table.

By default, the table will be set to have 4 rows and 4 columns. Initially, the "Add Table" button will be inactive, but once you've chosen a header and added a caption, it will become active, ready for your creative touch.


Provide number of rows, columns, headers and captions while inserting new table into Editor:

Users can create upto 10 rows and columns at a time now as shown below:


The caption field allows you to include any characters, numbers, and special characters you need to provide a descriptive title or explanation for your table:


The caption field does not accept empty spaces as valid input, as it is designed to only accept characters, numbers, and special characters for providing a descriptive title or explanation for your table.

Add border for table cell properties

Users  have the ability to select an individual cell and apply borders specifically to that cell. Additionally, they select multiple cells and apply borders to all of them at once and should also have the option to select an entire row or column and apply borders to the selected row or column.

The default border value for table cells is set to 1px solid #a5a5a5. This means that when you add a border to a table cell, it will be a solid line with a thickness of 1 pixel and a color code of #a5a5a5.




Set the border-collapse for table properties

By default, our freshly minted tables will be in a collapsed state. However, here's the neat part: the border-collapse property is a dynamic one, and it adjusts based on the table you select. This means that sometimes the tables will have a separate border, and we need to identify and apply it accordingly.


Once the user changes the option to separate, the border-collapse property will be changed to separate as well.

Collapse and Separate View:



Table Updates:


Tables in Loree have received improvements to align more closely with accessibility standards. You have the flexibility to choose the desired number of rows and columns and can also manually add additional ones. Once you've inserted a table, you can include both row and column headers, with at least one selection being mandatory, and a table caption is required to complete the table. These enhancements are aimed at improving accessibility.

To enhance accessibility further, remember to provide clear header labels and fill in the text within the table. Additionally, you can manually adjust row sizes by clicking and dragging, and refine your design by adjusting sizing, spacing, border color, and border styles from the options in the left-hand navigation.
 
                                                                         Thank You!

    • Related Articles

    • How do I add and edit course elements?

      Learn how to effortlessly add and edit course elements in Loree Design Loree Landing Page Once Loree has been successfully configured, you can access it through Canvas Course Navigations. Simply locate "Loree" on the left-hand side navigation bar, ...

    • How do I add text?

      This element can be used to add text to the page. Text Selecting the Text element will give you five options as detailed in the image below: Header Paragraph Heading with paragraph QuoteBlock Source Format Header The header option allows the user to ...

    • How do I add an image?

      Images As a Loree Design user, selecting the images option will now give you multiple pre-defined options, which easily add images, images with text, or both in combination. Selecting one of the options below will add the content to the particular ...

    • I have already created a page in Canvas, can I edit this page in Loree? If yes, how?

      Absolutely! If you've created a page in Canvas after launching Loree, you can seamlessly select that specific page within Loree for editing. Additionally, if the page is already included in a module, you can conveniently locate and edit it by ...

    • How can I add a divider to the page?

      Divider The divider features allow users to clearly divide pages with either a line or spacing. The line and spacing options are customizable depending on what particular style you desire. The two screenshots below highlight the divider feature ...