Overview
This guide covers creating, editing, deleting, and configuring tables on your website pages. Tables are a great way to organise and display data in an interesting and easy-to-read format on your website.
Where possible, rather than using tables, you should use styled tables because they automatically include your branding and colour schemes, and they dynamically adjust to smaller screens such as mobile devices. For further information see Juniper Websites: How do I add a stylised table to my page?
Creating a table
- Click into the content area of the page on your website where you require a table.
- Select the Table icon from the Edit tab OR select the Templates icon and then Styled Template if you have this template on your site.
Table Properties
- For Styled Tables the properties will already be set. For Standard Tables, the Table Properties window will appear immediately.
(you can right click on the table and choose table properties at any time to edit the settings) - Enter the number of Rows and Columns required. Set the width to a percentage, for example,100%. If you have a responsive website your content will scale accordingly, displaying appropriately on mobile and tablet devices.
- Select whether you want the First Row, First Column or Both to act as Headers. Headers not only make the rows stand out visually if they have been stylised, but they also make your table accessible to screen readers. Read more about making your content accessible here.
- Select OK to close the Table Properties.
Adding and Deleting Table Rows
- Find your table and select where you want to add/delete a row.
- Right-click and select Row.
- Select from:
- Insert Row Before - T insert a new row above your cursor.
- Insert Row After - To insert a new row below your cursor.
- Delete Rows - To delete the row you have selected.
Adding and Deleting Table Columns
- Find your table and select where you want to add/delete a column.
- Right-click and select Column:
- Select from:
- Insert Column Before - To insert a new column to the left of your cursor.
- Insert Column After - To insert a new column to the right of your cursor.
- Delete Columns - To delete the column you have selected.
Table Cell Properties
- Find your table and select one or more cells where you want to edit the properties.
- Right-click your selection.
- Select Cell.
- Select Cell Properties:
- The Cell Properties window is displayed:
Configure your settings:- Width - Cell width in pixels or percentage. </>
- Height - Cell height in pixels.
- Word Wrap - Wrap text onto a new line within the defined cell width.
- Horizontal Alignment - Align text horizontally left, centre, right or justify
- Vertical Alignment - Align text vertically to the top, middle, bottom or baseline.
- Cell Type - Define a cell as data or header content.
- Rows Span - Specifies the number of rows a cell should span.
- Columns Span - Specifies the number of columns a cell should span.
- Background Color - Type a Hex colour code for the background or click Choose to display the colour picker.
- Border Color - Type a Hex colour code for the border or click Choose to display the colour picker.
- After you have changed the settings, select OK to update your table.
Saving
Select Save on the Edit tab and choose the desired save option:
-
Save & Publish
- If you see this option, you can save and publish your item immediately to make it live on the website.
- If you have purchased our School News Mobile App, Administrators or Publishers can select the option to send a notification to subscribed app users.
-
Save Draft
- This will allow you to save your item without publishing it, and return to continue editing via Drafts on the Home tab
-
Send for Approval
- This option enables you to send an item to be reviewed and approved by either an Administrator or Publisher. Once approved this item will be made live on the site.
Updated